Add shadow utility variables (#1620)

chatwoot · Jan 6, 2021 · 64b0d48 · 64b0d48
1 parent 0348701
commit 64b0d48
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 0 deletions.
diff --git a/app/javascript/dashboard/assets/scss/app.scss b/app/javascript/dashboard/assets/scss/app.scss
@@ -3,6 +3,7 @@
 @import 'shared/assets/stylesheets/spacing';
 @import 'shared/assets/stylesheets/font-size';
 @import 'shared/assets/stylesheets/font-weights';
+@import 'shared/assets/stylesheets/shadows';
 @import 'shared/assets/stylesheets/border-radius';
 @import 'variables';
 

diff --git a/app/javascript/shared/assets/stylesheets/shadows.scss b/app/javascript/shared/assets/stylesheets/shadows.scss
@@ -0,0 +1,11 @@
+:root {
+    --shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1),
+        0 1px 2px 0 rgba(0, 0, 0, 0.06);
+    --shadow-small: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
+    --shadow-medium: 0 4px 6px -1px rgba(0, 0, 0, 0.1),
+        0 2px 4px -1px rgba(0, 0, 0, 0.06);
+    --shadow-large: 0 10px 15px -3px rgba(0, 0, 0, 0.1),
+        0 4px 6px -2px rgba(0, 0, 0, 0.05);
+    --shadow-larger: 0 20px 25px -5px rgba(0, 0, 0, 0.1),
+        0 10px 10px -5px rgba(0, 0, 0, 0.04);
+}