mirror of
https://github.com/penpot/penpot.git
synced 2025-01-21 06:02:32 -05:00
Add footer buttons
This commit is contained in:
parent
6f7b69c7ee
commit
db1250a315
3 changed files with 46 additions and 8 deletions
|
@ -192,7 +192,6 @@
|
|||
|
||||
[:& (mf/provider ctx/current-route) {:value route}
|
||||
[:& (mf/provider ctx/current-profile) {:value profile}
|
||||
[:& wtmt/modal]
|
||||
(if edata
|
||||
[:& static/exception-page {:data edata :route route}]
|
||||
[:*
|
||||
|
|
|
@ -10,6 +10,7 @@
|
|||
[app.main.data.modal :as modal]
|
||||
[app.main.ui.components.radio-buttons :refer [radio-button radio-buttons]]
|
||||
[cuerdas.core :as str]
|
||||
[app.main.ui.workspace.tokens.common :refer [labeled-input]]
|
||||
[app.main.ui.workspace.tokens.sets :as wts]
|
||||
[app.main.data.tokens :as wdt]
|
||||
[app.main.refs :as refs]
|
||||
|
@ -108,13 +109,24 @@
|
|||
(fn [token-set-id]
|
||||
(st/emit! (wdt/toggle-token-set {:token-set-id token-set-id
|
||||
:token-theme-id (:id theme)}))))]
|
||||
[:div {:class (stl/css :sets-list-wrapper)}
|
||||
[:& wts/controlled-sets-list
|
||||
{:token-sets token-sets
|
||||
:token-set-selected? (constantly false)
|
||||
:token-set-active? token-set-active?
|
||||
:on-select on-toggle-token-set
|
||||
:on-toggle on-toggle-token-set}]]))
|
||||
[:div {:class (stl/css :edit-theme-wrapper)}
|
||||
[:div {:class (stl/css :edit-theme-inputs-wrapper)}
|
||||
[:& labeled-input {:label "Group"
|
||||
:input-props {:value (:group theme)}}]
|
||||
[:& labeled-input {:label "Theme"
|
||||
:input-props {:value (:name theme)}}]]
|
||||
[:div {:class (stl/css :sets-list-wrapper)}
|
||||
[:& wts/controlled-sets-list
|
||||
{:token-sets token-sets
|
||||
:token-set-selected? (constantly false)
|
||||
:token-set-active? token-set-active?
|
||||
:on-select on-toggle-token-set
|
||||
:on-toggle on-toggle-token-set}]]
|
||||
[:div {:class (stl/css :edit-theme-footer)}
|
||||
[:button {:class (stl/css :button-secondary)} "Delete"]
|
||||
[:div {:class (stl/css :button-footer)}
|
||||
[:button {:class (stl/css :button-secondary)} "Cancel"]
|
||||
[:button {:class (stl/css :button-primary)} "Save theme"]]]]))
|
||||
|
||||
(mf/defc themes
|
||||
[{:keys [] :as _args}]
|
||||
|
|
|
@ -37,6 +37,22 @@ hr {
|
|||
.button-footer {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
gap: $s-6;
|
||||
}
|
||||
|
||||
.edit-theme-footer {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.button-primary {
|
||||
@extend .button-primary;
|
||||
padding: $s-6;
|
||||
}
|
||||
|
||||
.button-secondary {
|
||||
@extend .button-secondary;
|
||||
padding: $s-6;
|
||||
}
|
||||
|
||||
.create-theme-button {
|
||||
|
@ -103,6 +119,17 @@ hr {
|
|||
}
|
||||
}
|
||||
|
||||
.edit-theme-wrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: $s-12;
|
||||
}
|
||||
|
||||
.edit-theme-inputs-wrapper {
|
||||
display: flex;
|
||||
gap: $s-12;
|
||||
}
|
||||
|
||||
.sets-list-wrapper {
|
||||
border: 1px solid color-mix(in hsl, var(--color-foreground-secondary) 30%, transparent);
|
||||
border-radius: $s-8;
|
||||
|
|
Loading…
Add table
Reference in a new issue