Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-01-21 06:02:32 -05:00
Code Issues Activity

Add basic toggle switch

Browse source
This commit is contained in:
Florian Schroedl 2024-08-23 15:08:53 +02:00
parent d23c5cbbbe
commit cc7de14539
1 changed files with 22 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -8,6 +8,8 @@
(:require-macros [app.main.style :as stl])
(:require
[app.main.data.modal :as modal]
[app.main.ui.components.radio-buttons :refer [radio-button radio-buttons]]
[cuerdas.core :as str]
[app.main.data.tokens :as wdt]
[app.main.refs :as refs]
[app.main.store :as st]
@ -15,6 +17,7 @@
[app.util.dom :as dom]
[rumext.v2 :as mf]))
(def ^:private close-icon
(i/icon-xref :close (stl/css :close-icon)))
@ -22,6 +25,22 @@
[{:keys []}]
"Empty")
(mf/defc switch
[{:keys [selected? name on-change]}]
(let [selected (if selected? :on :off)]
[:& radio-buttons {:selected selected
:on-change on-change
:name name}
[:& radio-button {:id :on
:value :on
:icon i/tick
:label ""}]
[:& radio-button {:id :off
:value :off
:icon i/close
:label ""}]]))
(mf/defc themes-overview
[{:keys []}]
(let [active-theme-ids (mf/deref refs/workspace-active-theme-ids)
@ -37,12 +56,9 @@
[:div.spaced
name
[:div.spaced
[:button
{:on-click (fn [e]
(dom/prevent-default e)
(dom/stop-propagation e)
(st/emit! (wdt/toggle-token-theme id)))}
(if (get active-theme-ids id) "✅" "❎")]
[:& switch {:name (str "Theme" name)
:on-change #(st/emit! (wdt/toggle-token-theme id))
:selected? (get active-theme-ids id)}]
[:button {:on-click (fn [e]
(dom/prevent-default e)
(dom/stop-propagation e)