Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-02-12 10:09:03 -05:00
Code Issues Activity

remove set-item-set-selected and remove class

Browse source
This commit is contained in:
Akshay Gupta 2024-08-20 15:37:37 +05:30
parent 74c6228c25
commit 98b5791e27
No known key found for this signature in database
2 changed files with 3 additions and 42 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
frontend/src/app/main/ui/workspace/tokens/sets.cljs
View file

@ -69,8 +69,8 @@
[:div {:class (stl/css :set-item-container) [:div {:class (stl/css :set-item-container)
:on-click on-click} :on-click on-click}
[:div {:class (stl/css-case :set-item-group (= type :group) [:div {:class (stl/css-case :set-item-group (= type :group)
:set-item-set-selected @selected? :set-item-set (= type :set)
:set-item-set (and (= type :set) (not @selected?)))} :selected-set (and (= type :set) @selected?))}
[:span {:class (stl/css :icon) [:span {:class (stl/css :icon)
:on-click #(when (= type :group) (swap! collapsed? not))} icon] :on-click #(when (= type :group) (swap! collapsed? not))} icon]
[:div {:class (stl/css :set-name)} name] [:div {:class (stl/css :set-name)} name]

41
frontend/src/app/main/ui/workspace/tokens/sets.scss
View file

@ -93,48 +93,9 @@
.selected-set { .selected-set {
background-color: var(--layer-row-background-color-selected); background-color: var(--layer-row-background-color-selected);
color: var(--layer-row-foreground-color-selected); color: var(--layer-row-foreground-color-selected);
box-shadow: -20px 0 0 0 var(--layer-row-background-color-selected); box-shadow: -100px 0 0 0 var(--layer-row-background-color-selected);
} }
.set-item-set-selected {
@include bodySmallTypography;
display: flex;
align-items: center;
min-height: $s-32;
width: 100%;
cursor: pointer;
//color: var(--layer-row-foreground-color);
background-color: var(--layer-row-background-color-selected);
color: var(--layer-row-foreground-color-selected);
box-shadow: -20px 0 0 0 var(--layer-row-background-color-selected);
.set-name {
@include textEllipsis;
flex-grow: 1;
padding-left: $s-2;
}
.icon {
display: flex;
align-items: center;
width: $s-20;
height: $s-20;
padding-right: $s-4;
svg {
height: $s-20;
width: $s-20;
color: white;
fill: none;
stroke: var(--icon-foreground);
}
}
&:hover {
background-color: var(--layer-row-background-color-hover);
color: var(--layer-row-foreground-color-hover);
box-shadow: -100px 0 0 0 var(--layer-row-background-color-hover);
}
}
.action-btn { .action-btn {
@extend .button-tertiary; @extend .button-tertiary;
height: $s-20; height: $s-20;