mirror of
https://github.com/penpot/penpot.git
synced 2025-01-10 08:50:57 -05:00
add color palette slider scss
This commit is contained in:
parent
3f1ae0feaa
commit
bb28ab78d6
2 changed files with 17 additions and 8 deletions
|
@ -85,6 +85,14 @@
|
|||
.color-palette-content {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.color-palette-inside {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
transition: all .6s ease;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
|
|
|
@ -38,14 +38,15 @@
|
|||
(st/emit! (uds/update-selected-shapes-stroke {:color color}))
|
||||
(st/emit! (uds/update-selected-shapes-fill {:color color}))))]
|
||||
[:div.color-palette-content
|
||||
(for [hex-color colors
|
||||
:let [rgb-vec (hex->rgb hex-color)
|
||||
rgb-color (apply str "" (interpose ", " rgb-vec))]]
|
||||
[:div.color-cell {:key (str hex-color)
|
||||
:on-click #(select-color % hex-color)}
|
||||
[:span.color {:style {:background hex-color}}]
|
||||
[:span.color-text hex-color]
|
||||
[:span.color-text rgb-color]])]))
|
||||
[:div.color-palette-inside
|
||||
(for [hex-color colors
|
||||
:let [rgb-vec (hex->rgb hex-color)
|
||||
rgb-color (apply str "" (interpose ", " rgb-vec))]]
|
||||
[:div.color-cell {:key (str hex-color)
|
||||
:on-click #(select-color % hex-color)}
|
||||
[:span.color {:style {:background hex-color}}]
|
||||
[:span.color-text hex-color]
|
||||
[:span.color-text rgb-color]])]]))
|
||||
|
||||
(mx/defcs palette
|
||||
{:mixins [mx/static mx/reactive (mx/local)]}
|
||||
|
|
Loading…
Reference in a new issue