1 files changed, 63 insertions, 0 deletions
diff --git a/WebContent/VAADIN/themes/valo/util/_bevel-and-shadow.scss b/WebContent/VAADIN/themes/valo/util/_bevel-and-shadow.scss
new file mode 100644
index 0000000000..2b627df3e7
--- /dev/null
+++ b/WebContent/VAADIN/themes/valo/util/_bevel-and-shadow.scss
@@ -0,0 +1,63 @@
+@function v-valo-bevel ($color, $bevel-style: $v-bevel-style, $bevel-depth: $v-bevel-depth, 
+                        $gradient-style: $v-gradient-style, $gradient-depth: $v-gradient-depth) {
+  
+  @if $bevel-depth == 0% or $bevel-style == none {
+    @return null;
+  }
+  
+  $color-stops: v-valo-gradient-color-stops($color, $gradient-style, $gradient-depth);
+
+  $top-color: first(first($color-stops));
+  $bottom-color: first(last($color-stops));
+
+  $top-color: blend-lighten(adjust-color($top-color, $lightness: $bevel-depth/4, $saturation: -$bevel-depth), scale-color($top-color, $lightness: $bevel-depth/4));
+  $bottom-color: blend-darken(rgba(scale-color($bottom-color, $lightness: max(-30%, -$bevel-depth/3), $saturation: -$bevel-depth), $bevel-depth/100%), $bottom-color);
+  
+  @return v-valo-replace-hilite-and-shade($bevel-style, $top-color, $bottom-color);
+}
+
+
+
+@function v-valo-shadow ($shadow-style: null, $shadow-depth: null) {
+  $shadow-style: $shadow-style or $v-shadow-style;
+  $shadow-depth: $shadow-depth or $v-shadow-depth;
+
+  @if $shadow-depth == 0% or $shadow-style == none {
+    @return null;
+  }
+
+  @return v-valo-replace-hilite-and-shade($shadow-style, rgba(#fff, $shadow-depth/100%), rgba(#000, $shadow-depth/100%));
+}
+
+
+
+@function v-valo-replace-hilite-and-shade($shadow-list, $hilite, $shade) {
+  @if $shadow-list == none {
+    @return null;
+  }
+
+  @if type-of(last($shadow-list)) == color {
+    @return $shadow-list;
+  }
+
+  // If the shadow-list only contains one shadow
+  // (we can't use the recursive replace function because that will mess up the list delimeters)
+  @if last($shadow-list) == hilite {
+    @return replace($shadow-list, hilite, $hilite);
+  } @else if last($shadow-list) == shade {
+    @return replace($shadow-list, shade, $shade);
+  }
+  
+  // If there are multiple shadows in a list, recurse and separate lists with a comma
+  $new: null;
+  @each $part in $shadow-list {
+    @if type-of($part) == list and length($part) > 0 {
+      $part: v-valo-replace-hilite-and-shade($part, $hilite, $shade);
+      @if $part {
+        $new: $new, $part;
+      }
+    }
+  }
+
+  @return $new;
+}