Consolidating button, action-button and badge; change design to have some 3D components

1 files changed, 10 insertions, 4 deletions

diff --git a/src/_core.vars.scss b/src/_core.vars.scss
index 0a94534..04c0f63 100644
--- a/src/_core.vars.scss
+++ b/src/_core.vars.scss
@@ -89,11 +89,17 @@ $border-width--thick:  props.def(--border-width--thick, 4px) !default;
 $border-width--medium: props.def(--border-width--medium, 2px) !default;
 $border-width--thin:   props.def(--border-width--thin, 1px) !default;
 
-$shadow--x:    props.def(--shadow--x, 0) !default;
-$shadow--y:    props.def(--shadow--y, 1px) !default;
-$shadow--blur: props.def(--shadow--blur, 4px) !default;
+$shadow--l1--x:    props.def(--shadow--l1--x, 0) !default;
+$shadow--l1--y:    props.def(--shadow--l1--y, 2px) !default;
+$shadow--l1--blur: props.def(--shadow--l1--blur, 3px) !default;
+$shadow--l1--grow: props.def(--shadow--l1--grow, -1px) !default;
 
-$rounding: props.def(--rounding, 4px) !default;
+$shadow--l2--x:    props.def(--shadow--l2--x, 0) !default;
+$shadow--l2--y:    props.def(--shadow--l2--y, 4px) !default;
+$shadow--l2--blur: props.def(--shadow--l2--blur, 8px) !default;
+$shadow--l2--grow: props.def(--shadow--l2--grow, -3px) !default;
+
+$rounding: props.def(--rounding, 8px) !default;
 
 $key-focus--outline-width: props.def(--key-focus--outline-width, props.get($border-width--thick)) !default;
 $key-focus--border-width:  props.def(--key-focus--border-width, props.get($border-width--medium)) !default;