From adf1586875cdf2d2b0e31d9ed2bfc7054395d381 Mon Sep 17 00:00:00 2001
From: Jouni Koivuviita <jouni@vaadin.com>
Date: Tue, 5 Aug 2014 23:08:10 +0300
Subject: Fix color picker button for IE8
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The selected color hex value is no longer overlapping with the color
square.

But now when there’s no hex value as the button caption, there’s extra
white space on the right edge of the button, which is unavoidable. This
is a lesser evil.

Change-Id: I9c7e36fdf22f63c9cad6972f0f2038513f841d6b
---
 .../VAADIN/themes/valo/components/_colorpicker.scss     | 17 +++++++++++++++++
 1 file changed, 17 insertions(+)

diff --git a/WebContent/VAADIN/themes/valo/components/_colorpicker.scss b/WebContent/VAADIN/themes/valo/components/_colorpicker.scss
index 4509c23f15..4460aafb21 100644
--- a/WebContent/VAADIN/themes/valo/components/_colorpicker.scss
+++ b/WebContent/VAADIN/themes/valo/components/_colorpicker.scss
@@ -203,6 +203,23 @@
     + .v-button-caption:not(:empty) {
       margin-left: round($v-unit-size/2);
     }
+
+    .v-ie8 & {
+      position: relative;
+      top: auto;
+      right: auto;
+      bottom: auto;
+      left: auto;
+      width: $v-font-size;
+      height: $v-font-size;
+      display: inline-block;
+      vertical-align: middle;
+      margin: 0 round($v-font-size / -2);
+
+      + .v-button-caption {
+        margin-left: round($v-unit-size/2);
+      }
+    }
   }
 
 }
-- 
cgit v1.2.3