Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-01-21 14:12:36 -05:00
Code Issues Activity

Add theme creation form

Browse source
This commit is contained in:
Florian Schroedl 2024-08-26 14:32:01 +02:00
parent f37cf8be5e
commit b5e08c5b8b
1 changed files with 17 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
frontend/src/app/main/ui/workspace/tokens/modals/themes.cljs
View file

@ -92,7 +92,11 @@
(st/emit! (wdt/delete-token-theme id)))} (st/emit! (wdt/delete-token-theme id)))}
i/delete]]]])]])] i/delete]]]])]])]
[:div {:class (stl/css :button-footer)} [:div {:class (stl/css :button-footer)}
[:button {:class (stl/css :create-theme-button)} [:button {:class (stl/css :create-theme-button)
:on-click (fn [e]
(dom/prevent-default e)
(dom/stop-propagation e)
(set-state (fn [_] {:type :create-theme})))}
i/add i/add
"Create theme"]]])) "Create theme"]]]))
@ -176,6 +180,16 @@
:on-back #(set-state (constantly {:type :themes-overview})) :on-back #(set-state (constantly {:type :themes-overview}))
:on-submit #(st/emit! (wdt/update-token-theme %))}])) :on-submit #(st/emit! (wdt/update-token-theme %))}]))
(mf/defc create-theme
[{:keys [set-state]}]
(let [token-sets (mf/deref refs/workspace-token-sets)
theme {:name "Theme" :sets #{}}]
[:& edit-theme
{:token-sets token-sets
:theme theme
:on-back #(set-state (constantly {:type :themes-overview}))
:on-submit #(st/emit! (wdt/create-token-theme %))}]))
(mf/defc themes (mf/defc themes
[{:keys [] :as _args}] [{:keys [] :as _args}]
(let [themes (mf/deref refs/workspace-ordered-token-themes) (let [themes (mf/deref refs/workspace-ordered-token-themes)
@ -189,7 +203,8 @@
component (case (:type @state) component (case (:type @state)
:empty-themes empty-themes :empty-themes empty-themes
:themes-overview themes-overview :themes-overview themes-overview
:edit-theme controlled-edit-theme)] :edit-theme controlled-edit-theme
:create-theme create-theme)]
[:div [:div
[:div {:class (stl/css :modal-title)} title] [:div {:class (stl/css :modal-title)} title]