mirror of
https://github.com/penpot/penpot.git
synced 2025-02-09 16:48:16 -05:00
🐛 Fix importzip file modal
This commit is contained in:
parent
e92932b4f9
commit
a3a7c597b5
2 changed files with 39 additions and 20 deletions
|
@ -216,7 +216,9 @@
|
|||
|
||||
[:div {:class (stl/css :file-name-label)}
|
||||
(:name file)
|
||||
(when is-shared? i/library-refactor)])
|
||||
(when is-shared?
|
||||
[:span {:class (stl/css :icon)}
|
||||
i/library-refactor])])
|
||||
|
||||
[:div {:class (stl/css :edit-entry-buttons)}
|
||||
(when (= "application/zip" (:type file))
|
||||
|
@ -242,9 +244,10 @@
|
|||
(let [library-data (->> @state :files (d/seek #(= library-id (:file-id %))))
|
||||
error? (or (:deleted? library-data) (:import-error library-data))]
|
||||
(when (some? library-data)
|
||||
[:div {:class (stl/css-case :linked-library-tag true
|
||||
:error error?)}
|
||||
i/detach-refactor (:name library-data)])))]]))
|
||||
[:div {:class (stl/css :linked-library)}
|
||||
(:name library-data)
|
||||
[:span {:class (stl/css-case :linked-library-tag true
|
||||
:error error?)} i/detach-refactor]])))]]))
|
||||
|
||||
(mf/defc import-dialog
|
||||
{::mf/register modal/components
|
||||
|
|
48
frontend/src/app/main/ui/dashboard/import.scss
vendored
48
frontend/src/app/main/ui/dashboard/import.scss
vendored
|
@ -107,7 +107,19 @@
|
|||
}
|
||||
.file-name-label {
|
||||
@include titleTipography;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: $s-12;
|
||||
flex-grow: 1;
|
||||
.icon {
|
||||
@include flexCenter;
|
||||
height: $s-16;
|
||||
width: $s-16;
|
||||
svg {
|
||||
@extend .button-icon-small;
|
||||
stroke: var(--icon-foreground);
|
||||
}
|
||||
}
|
||||
}
|
||||
.edit-entry-buttons {
|
||||
@include flexRow;
|
||||
|
@ -128,18 +140,22 @@
|
|||
color: var(--modal-text-foreground-color);
|
||||
}
|
||||
|
||||
.linked-libraries {
|
||||
.linked-library {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: $s-12;
|
||||
color: var(--modal-text-foreground-color);
|
||||
.linked-library-tag {
|
||||
@include flexCenter;
|
||||
height: $s-24;
|
||||
width: $s-16;
|
||||
width: $s-24;
|
||||
svg {
|
||||
@extend .button-icon;
|
||||
stroke: var(--icon-foreground);
|
||||
}
|
||||
&.error {
|
||||
svg {
|
||||
stroke: var(--error-color);
|
||||
stroke: var(--status-error-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -147,46 +163,46 @@
|
|||
|
||||
&.loading {
|
||||
.file-name {
|
||||
color: var(--pending-color);
|
||||
color: var(--status-pending-color);
|
||||
.file-icon {
|
||||
:global(#loader-pencil) {
|
||||
color: var(--pending-color);
|
||||
stroke: var(--pending-color);
|
||||
fill: var(--pending-color);
|
||||
color: var(--status-pending-color);
|
||||
stroke: var(--status-pending-color);
|
||||
fill: var(--status-pending-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
&.warning {
|
||||
.file-name {
|
||||
color: var(--warning-color);
|
||||
color: var(--status-warning-color);
|
||||
.file-icon svg {
|
||||
stroke: var(--warning-color);
|
||||
stroke: var(--status-warning-color);
|
||||
}
|
||||
.file-icon.icon-fill svg {
|
||||
fill: var(--warning-color);
|
||||
fill: var(--status-warning-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
&.success {
|
||||
.file-name {
|
||||
color: var(--ok-color);
|
||||
color: var(--status-success-color);
|
||||
.file-icon svg {
|
||||
stroke: var(--ok-color);
|
||||
stroke: var(--status-success-color);
|
||||
}
|
||||
.file-icon.icon-fill svg {
|
||||
fill: var(--ok-color);
|
||||
fill: var(--status-success-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
&.error {
|
||||
.file-name {
|
||||
color: var(--error-color);
|
||||
color: var(--status-error-color);
|
||||
.file-icon svg {
|
||||
stroke: var(--error-color);
|
||||
stroke: var(--status-error-color);
|
||||
}
|
||||
.file-icon.icon-fill svg {
|
||||
fill: var(--error-color);
|
||||
fill: var(--status-error-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Add table
Reference in a new issue