0
Fork 0
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:
Juan de la Cruz 2016-11-29 15:01:20 +01:00
parent 3f1ae0feaa
commit bb28ab78d6
2 changed files with 17 additions and 8 deletions

View file

@ -85,6 +85,14 @@
.color-palette-content { .color-palette-content {
align-items: center; align-items: center;
display: flex; display: flex;
overflow: hidden;
width: 100%;
}
.color-palette-inside {
align-items: center;
display: flex;
transition: all .6s ease;
width: 100%; width: 100%;
} }

View file

@ -38,14 +38,15 @@
(st/emit! (uds/update-selected-shapes-stroke {:color color})) (st/emit! (uds/update-selected-shapes-stroke {:color color}))
(st/emit! (uds/update-selected-shapes-fill {:color color}))))] (st/emit! (uds/update-selected-shapes-fill {:color color}))))]
[:div.color-palette-content [:div.color-palette-content
(for [hex-color colors [:div.color-palette-inside
:let [rgb-vec (hex->rgb hex-color) (for [hex-color colors
rgb-color (apply str "" (interpose ", " rgb-vec))]] :let [rgb-vec (hex->rgb hex-color)
[:div.color-cell {:key (str hex-color) rgb-color (apply str "" (interpose ", " rgb-vec))]]
:on-click #(select-color % hex-color)} [:div.color-cell {:key (str hex-color)
[:span.color {:style {:background hex-color}}] :on-click #(select-color % hex-color)}
[:span.color-text hex-color] [:span.color {:style {:background hex-color}}]
[:span.color-text rgb-color]])])) [:span.color-text hex-color]
[:span.color-text rgb-color]])]]))
(mx/defcs palette (mx/defcs palette
{:mixins [mx/static mx/reactive (mx/local)]} {:mixins [mx/static mx/reactive (mx/local)]}