Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-01-06 14:50:20 -05:00
Code Issues Activity

Cleanup styles

Browse source
This commit is contained in:
Florian Schroedl 2024-08-16 13:59:18 +02:00
parent 6a7ced3204
commit 62712ef8da
1 changed files with 45 additions and 53 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

98
frontend/src/app/main/ui/workspace/tokens/sidebar.cljs
View file

@ -173,69 +173,61 @@
selected-theme (get themes-index selected-theme-id)
selected-token-set-id (mf/deref refs/workspace-selected-token-set-id)
token-sets (mf/deref refs/workspace-token-sets)]
(js/console.log "selected-theme" selected-theme)
[:div
{:style {:display "flex"
:flex-direction "column"
:gap "10px"
:max-height "60vh"
:overflow "auto"
:border-bottom "2px solid grey"
:padding "10px"
:margin-bottom "50px"}}
[:style
(str "@scope {"
(str/join "\n"
["ul { list-style-type: disk; margin-left: 20px; }"
".spaced { display: flex; gap: 10px; justify-content: space-between; }"
".spaced-y { display: flex; flex-direction: column; gap: 10px }"
".selected { font-weight: 600; }"
"b { font-weight: 600; }"])
"}")]
[:div.spaced-y
{:style {:max-height "60vh"
:overflow "auto"
:border-bottom "2px solid grey"
:padding "10px"
:margin-bottom "50px"}}
(str "Themes (selected: " selected-theme-id ")")
[:div
[:ul {:style {:list-style "disk"}}
[:ul
[:& tokene-theme-create]
(for [[group themes] themes]
[:li
{:key (str "token-theme-group" group)}
group
#_[:ul {:style {:list-style "disk"
:margin-left "20px"}}
#_[:ul
(for [{:keys [id] :as theme} themes]
[:li {:key (str "tokene-theme-" id)}
[:input {:type "checkbox"
:checked (wtts/theme-selected? theme)}]])]])]]
"Sets"
[:div
{:style {:display "flex" :gap "10px"}}
[:button
{:on-click #(st/emit! (wdt/create-token-set nil))}
"Create"]
#_[:button "Delete"]]
[:ul
{:style {:list-style "disk"
:margin-left "20px"
:display "flex"
:flex-direction "column"
:gap "10px"}}
(for [[_ {:keys [id name]}] token-sets]
[:li {:style {:font-weight (when (= selected-token-set-id id) "bold")}
:on-click (fn []
(st/emit!
(wdt/set-selected-token-set-id id)
(wtu/update-workspace-tokens)))}
[:div {:style {:display "flex"
:justify-content "space-between"}}
name
[:div {:style {:display "flex"
:gap "5px"}}
[:button
{:on-click (fn [e]
(dom/prevent-default e)
(dom/stop-propagation e)
(st/emit! (wdt/toggle-token-set id)))}
(if (wtts/token-set-enabled-in-theme? id selected-theme)
"👁️"
" ")]
[:button {:on-click (fn [e]
(dom/prevent-default e)
(dom/stop-propagation e)
(st/emit! (wdt/delete-token-set id)))}
"🗑️"]]]])]
[:hr]]))
:checked (wtts/theme-selected? theme)}]])]])]
[:div.spaced
[:b "Sets"]
[:button {:on-click #(st/emit! (wdt/create-token-set nil))} "Create"]]
[:ul.spaced-y
(for [[_ {:keys [id name]}] token-sets]
[:li {:class [(when (= selected-token-set-id id) "selected")]
:on-click (fn []
(st/emit!
(wdt/set-selected-token-set-id id)
(wtu/update-workspace-tokens)))}
[:div.spaced
name
[:div.spaced
[:button
{:on-click (fn [e]
(dom/prevent-default e)
(dom/stop-propagation e)
(st/emit! (wdt/toggle-token-set id)))}
(if (wtts/token-set-enabled-in-theme? id selected-theme)
"👁️"
"")]
[:button {:on-click (fn [e]
(dom/prevent-default e)
(dom/stop-propagation e)
(st/emit! (wdt/delete-token-set id)))}
"🗑️"]]]])]
[:hr]]]))
(mf/defc tokens-explorer
[_props]