From d886c5615acf99c1eeede2fb8cd725ceae157610 Mon Sep 17 00:00:00 2001
From: Juan de la Cruz <juan.delacruz@kaleidos.net>
Date: Wed, 18 Dec 2019 13:58:46 +0100
Subject: [PATCH] wip options css

---
 .../public/images/svg/arrow-down-white.svg    | 60 +++++++++++++++++++
 .../resources/styles/common/framework.scss    |  2 +-
 .../styles/main/partials/colorpicker.scss     |  7 ++-
 .../partials/sidebar-element-options.scss     | 11 ++--
 .../main/ui/workspace/sidebar/layers.cljs     |  3 +-
 .../main/ui/workspace/sidebar/options.cljs    |  8 +--
 6 files changed, 79 insertions(+), 12 deletions(-)
 create mode 100644 frontend/resources/public/images/svg/arrow-down-white.svg

diff --git a/frontend/resources/public/images/svg/arrow-down-white.svg b/frontend/resources/public/images/svg/arrow-down-white.svg
new file mode 100644
index 000000000..c47a7be72
--- /dev/null
+++ b/frontend/resources/public/images/svg/arrow-down-white.svg
@@ -0,0 +1,60 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="500"
+   height="500"
+   viewBox="0 0 500 500.00001"
+   id="svg2"
+   version="1.1"
+   sodipodi:docname="arrow-down-white.svg"
+   inkscape:version="0.92.3 (2405546, 2018-03-11)">
+  <defs
+     id="defs4" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     showgrid="false"
+     units="px"
+     inkscape:zoom="0.472"
+     inkscape:cx="-221.39831"
+     inkscape:cy="250"
+     inkscape:window-width="1920"
+     inkscape:window-height="1020"
+     inkscape:window-x="0"
+     inkscape:window-y="27"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg2" />
+  <metadata
+     id="metadata7">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>
+          image/svg+xml
+        </dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     id="layer1"
+     transform="matrix(0,1,-1,0,1052.3622,3.4029767e-6)"
+     style="fill:#e7ecf2">
+    <path
+       d="m 138.95104,552.39877 c -15.97981,-0.91956 -29.97031,15.64781 -25.60739,31.33414 4.13074,8.64975 24.56735,29.78594 24.56735,29.78594 0,0 124.53922,124.60864 185.12839,188.55293 2.98762,7.37445 -5.2414,11.74615 -9.09921,16.46818 -65.67593,65.77624 -134.53948,128.31983 -199.74642,194.55784 -10.04086,14.0513 -0.63252,36.5051 16.6162,38.8691 11.18564,2.1327 21.43639,-4.6772 28.26602,-12.9034 69.31825,-65.46486 137.62693,-132.00453 206.41188,-198.03973 7.65756,-8.14176 16.96875,-15.29428 22.61013,-25.01415 5.09335,-12.02529 -1.09218,-25.6828 -11.04128,-33.08286 -74.27352,-75.37761 -148.37953,-150.94757 -224.06956,-224.8979 -3.90281,-3.30297 -8.78051,-5.91159 -14.03611,-5.63009 z"
+       id="path4149"
+       fill="E1E1E1"
+       sodipodi:nodetypes="ccccccccccccc"
+       inkscape:connector-curvature="0"
+       style="fill:#e7ecf2" />
+  </g>
+</svg>
diff --git a/frontend/resources/styles/common/framework.scss b/frontend/resources/styles/common/framework.scss
index dde66467b..a96aced98 100644
--- a/frontend/resources/styles/common/framework.scss
+++ b/frontend/resources/styles/common/framework.scss
@@ -454,7 +454,7 @@ input.element-name {
 
 .input-select {
   @extend .input-text;
-  background-image: url("/images/svg/arrow-down.svg");
+  background-image: url("/images/svg/arrow-down-white.svg");
   background-repeat: no-repeat;
   background-position: 95% 48%;
   background-size: 10px;
diff --git a/frontend/resources/styles/main/partials/colorpicker.scss b/frontend/resources/styles/main/partials/colorpicker.scss
index 94202077c..89f5ffc77 100644
--- a/frontend/resources/styles/main/partials/colorpicker.scss
+++ b/frontend/resources/styles/main/partials/colorpicker.scss
@@ -154,12 +154,17 @@
 
   .color-info {
     input {
-      border: 1px solid $soft-ui-border;
+      border: 1px solid $intense-ui-border;
       border-radius: $br-small;
+      color: $soft-ui-text;
       margin: 3px 0 0 $x-small;
       padding: 0 $x-small;
       width: 58px;
       font-size: $fs13;
+
+      &:focus {
+        border-color: $soft-ui-text;
+      }
     }
   }
 
diff --git a/frontend/resources/styles/main/partials/sidebar-element-options.scss b/frontend/resources/styles/main/partials/sidebar-element-options.scss
index c3b4c5129..2eee292bd 100644
--- a/frontend/resources/styles/main/partials/sidebar-element-options.scss
+++ b/frontend/resources/styles/main/partials/sidebar-element-options.scss
@@ -62,14 +62,15 @@
   }
 
   .element-set {
+    border-bottom: 1px solid $soft-ui-border;
     color: $medium-ui-text;
     margin: 0 $x-small;
 
     .element-set-title {
-      border-bottom: 1px dashed $soft-ui-border;
-      color: $medium-ui-text;
-      font-weight: bold;
-      padding: 2px $x-small;
+      color: $soft-ui-text;
+      font-size: $fs14;
+      margin-top: $x-small;
+      padding: $x-small;
       width: 100%;
     }
 
@@ -214,7 +215,7 @@
   }
 
   span {
-    color: $medium-ui-text;
+    color: $soft-ui-text;
     font-size: $fs12;
   }
 
diff --git a/frontend/src/uxbox/main/ui/workspace/sidebar/layers.cljs b/frontend/src/uxbox/main/ui/workspace/sidebar/layers.cljs
index 066854cc4..e76075ac7 100644
--- a/frontend/src/uxbox/main/ui/workspace/sidebar/layers.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/sidebar/layers.cljs
@@ -260,7 +260,8 @@
      [:div.tool-window-bar
       [:div.tool-window-icon i/layers]
       [:span (tr "ds.settings.layers")]
-      [:div.tool-window-close {:on-click on-click} i/close]]
+      ;; [:div.tool-window-close {:on-click on-click} i/close]
+     ]
      [:div.tool-window-content
       [:& canvas-list {:canvas canvas
                        :shapes all-shapes
diff --git a/frontend/src/uxbox/main/ui/workspace/sidebar/options.cljs b/frontend/src/uxbox/main/ui/workspace/sidebar/options.cljs
index 492e1bc42..9feb2214c 100644
--- a/frontend/src/uxbox/main/ui/workspace/sidebar/options.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/sidebar/options.cljs
@@ -113,10 +113,10 @@
   (let [close #(st/emit! (udw/toggle-layout-flag :element-options))
         selected (mf/deref refs/selected-shapes)]
     [:div.elementa-options.tool-window
-     [:div.tool-window-bar
-      [:div.tool-window-icon i/options]
-      [:span (tr "ds.settings.element-options")]
-      [:div.tool-window-close {:on-click close} i/close]]
+     ;; [:div.tool-window-bar
+      ;; [:div.tool-window-icon i/options]
+      ;; [:span (tr "ds.settings.element-options")]
+      ;; [:div.tool-window-close {:on-click close} i/close]]
      [:div.tool-window-content
       [:div.element-options
        (if (= (count selected) 1)