From 62a20552a4aad406ccb278bbaf4239b54b9ad1e2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Xavier=20Juli=C3=A1n?= <xavier.julian@kaleidos.net>
Date: Thu, 22 Sep 2016 11:06:09 +0200
Subject: [PATCH] Color selector fixes for transparent color

---
 .../components/color-selector/color-selector.jade     | 11 ++++++-----
 .../components/color-selector/color-selector.scss     |  6 +++++-
 2 files changed, 11 insertions(+), 6 deletions(-)

diff --git a/app/modules/components/color-selector/color-selector.jade b/app/modules/components/color-selector/color-selector.jade
index d4213b62..dda5becc 100644
--- a/app/modules/components/color-selector/color-selector.jade
+++ b/app/modules/components/color-selector/color-selector.jade
@@ -28,11 +28,12 @@
             .display-custom-color.empty-color(
                 ng-if="!vm.color"
             )
-            .display-custom-color(
-                ng-if="vm.color"
-                ng-style="{'background': vm.color}"
-                ng-click="vm.onSelectDropdownColor(vm.color)"
-            )
+            .display-custom-color-wrapper
+                .display-custom-color(
+                    ng-if="vm.color"
+                    ng-style="{'background': vm.color}"
+                    ng-click="vm.onSelectDropdownColor(vm.color)"
+                )
             input.custom-color-input(
                 type="text"
                 maxlength="7"
diff --git a/app/modules/components/color-selector/color-selector.scss b/app/modules/components/color-selector/color-selector.scss
index 3f5a9bc0..98cf62fd 100644
--- a/app/modules/components/color-selector/color-selector.scss
+++ b/app/modules/components/color-selector/color-selector.scss
@@ -52,16 +52,20 @@
 }
 
 .custom-color-selector {
+    align-items: center;
     display: flex;
     .custom-color-input {
         margin: 0;
         width: 100%;
     }
+    .display-custom-color-wrapper {
+        background: $mass-white;
+        margin-right: .5rem;
+    }
     .display-custom-color {
         @include color-selector-option;
         flex-shrink: 0;
         margin: 0;
-        margin-right: .5rem;
         &.empty-color {
             @include empty-color(34);
             cursor: default;