box-shadow should have -webkit prefix (#14093)

Mass find-and-replace, tested to work as before in Chrome, and that the
output now includes box -webkit-box-shadow as well as box-shadow.

Bourbon needed to be imported before the css3 utils, so that the
box-shadow mixin can be overridden (Bourbon prints a warning as it has
already deprecated box-shadow prefixes).

Change-Id: I6b4f2047a6d8bfb74f2dbf999d10f7e00005e794

2 files changed, 6 insertions, 1 deletions

diff --git a/WebContent/VAADIN/themes/valo/util/_color.scss b/WebContent/VAADIN/themes/valo/util/_color.scss
index b7f8c10ad8..0c80d2f0d0 100644
--- a/WebContent/VAADIN/themes/valo/util/_color.scss
+++ b/WebContent/VAADIN/themes/valo/util/_color.scss
@@ -88,7 +88,7 @@ $v-luminance-threshold: 150 !default;
 
 @mixin valo-focus-style($include-box-shadow: false) {
   @if $include-box-shadow and type-of($v-focus-style) == list {
-    box-shadow: $v-focus-style;
+    @include box-shadow($v-focus-style);
   } @else if type-of($v-focus-style) == color {
     border-color: $v-focus-style;
   }
diff --git a/WebContent/VAADIN/themes/valo/util/_css3.scss b/WebContent/VAADIN/themes/valo/util/_css3.scss
index 98f1619eff..ca354e89af 100644
--- a/WebContent/VAADIN/themes/valo/util/_css3.scss
+++ b/WebContent/VAADIN/themes/valo/util/_css3.scss
@@ -8,3 +8,8 @@
     filter: none remove-nth($o, 1);
   }
 }
+
+// -webkit-box-shadow still needed for Android 2.3 and 3.0, as well as iOS 5
+@mixin box-shadow ($shadows...) {
+  @include prefixer(box-shadow, $shadows, webkit spec);
+}