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 edit button

Browse source
This commit is contained in:
Florian Schroedl 2024-08-26 16:14:27 +02:00
parent c807baaf7a
commit cb46e11162
2 changed files with 31 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
frontend/src/app/main/ui/workspace/tokens/theme_select.cljs
View file

@ -28,9 +28,14 @@
[:li {:key id
:class (stl/css-case
:checked-element true
:sub-item true
:is-selected selected?)}
[:span {:class (stl/css :label)} name]
[:span {:class (stl/css :check-icon)} i/tick]])]])]))
[:span {:class (stl/css :check-icon)} i/tick]])]])
[:li {:class (stl/css-case :checked-element true
:checked-element-button true)}
[:span "Edit themes"]
[:span {:class (stl/css :icon)} i/arrow]]]))
(mf/defc theme-select
[{:keys []}]

27
frontend/src/app/main/ui/workspace/tokens/theme_select.scss
View file

@ -97,11 +97,34 @@
top: auto;
}
.sub-item {
padding-left: $s-16;
}
.checked-element-button {
@extend .dropdown-element-base;
position: relative;
display: flex;
justify-content: space-between;
padding-right: 0;
}
li + .checked-element-button {
margin-top: $s-8;
&:before {
content: "";
position: absolute;
top: -$s-4;
left: 0;
right: 0;
height: 1px;
background-color: color-mix(in hsl, var(--color-foreground-secondary) 20%, transparent);
}
}
.checked-element {
@extend .dropdown-element-base;
padding-left: $s-16;
.icon {
@include flexCenter;
height: $s-24;