From bb28ab78d6c7786c29f74f037dbad1c6ce7c7850 Mon Sep 17 00:00:00 2001
From: Juan de la Cruz <juan.delacruz@kaleidos.net>
Date: Tue, 29 Nov 2016 15:01:20 +0100
Subject: [PATCH] add color palette slider scss

---
 .../styles/main/partials/color-palette.scss     |  8 ++++++++
 .../uxbox/main/ui/workspace/colorpalette.cljs   | 17 +++++++++--------
 2 files changed, 17 insertions(+), 8 deletions(-)

diff --git a/frontend/resources/styles/main/partials/color-palette.scss b/frontend/resources/styles/main/partials/color-palette.scss
index b0a6c46bc..e2a4fa9c4 100644
--- a/frontend/resources/styles/main/partials/color-palette.scss
+++ b/frontend/resources/styles/main/partials/color-palette.scss
@@ -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%;
 }
 
diff --git a/frontend/src/uxbox/main/ui/workspace/colorpalette.cljs b/frontend/src/uxbox/main/ui/workspace/colorpalette.cljs
index 28805ff28..d9370dfcd 100644
--- a/frontend/src/uxbox/main/ui/workspace/colorpalette.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/colorpalette.cljs
@@ -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)]}