@flodesk/grain 6.14.5 → 6.14.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/es/styles/shadows.css +9 -23
- package/package.json +1 -1
package/es/styles/shadows.css
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
:root, [data-theme="light"], [data-theme="dark"] [data-theme="invert"] {
|
|
2
|
-
--alphaRatio: 0.
|
|
2
|
+
--alphaRatio: 0.6;
|
|
3
3
|
}
|
|
4
4
|
|
|
5
5
|
[data-theme="dark"], [data-theme="light"] [data-theme="invert"] {
|
|
@@ -8,67 +8,53 @@
|
|
|
8
8
|
|
|
9
9
|
:root, [data-theme] {
|
|
10
10
|
--c: 0 0% 0%;
|
|
11
|
-
--blurRatio: 1.
|
|
12
|
-
--yRatio: 1.
|
|
13
|
-
--spreadRatio:
|
|
14
|
-
--ratioCurve: 0.
|
|
11
|
+
--blurRatio: 1.7;
|
|
12
|
+
--yRatio: 1.1;
|
|
13
|
+
--spreadRatio: 2;
|
|
14
|
+
--ratioCurve: 0.9;
|
|
15
15
|
|
|
16
16
|
--rc1: var(--ratioCurve) * 1;
|
|
17
17
|
--rc2: var(--ratioCurve) * 2;
|
|
18
18
|
--rc3: var(--ratioCurve) * 3;
|
|
19
19
|
--rc4: var(--ratioCurve) * 4;
|
|
20
|
-
--rc5: var(--ratioCurve) * 5;
|
|
21
|
-
--rc6: var(--ratioCurve) * 6;
|
|
22
20
|
|
|
23
21
|
--b1: 1px;
|
|
24
22
|
--b2: calc(var(--b1) * var(--rc2) * var(--blurRatio));
|
|
25
23
|
--b3: calc(var(--b2) * var(--rc3) * var(--blurRatio));
|
|
26
24
|
--b4: calc(var(--b3) * var(--rc4) * var(--blurRatio));
|
|
27
|
-
--b5: calc(var(--b4) * var(--rc5) * var(--blurRatio));
|
|
28
|
-
--b6: calc(var(--b5) * var(--rc6) * var(--blurRatio));
|
|
29
25
|
|
|
30
26
|
--y1: 1px;
|
|
31
27
|
--y2: calc(var(--y1) * var(--rc2) * var(--yRatio));
|
|
32
28
|
--y3: calc(var(--y2) * var(--rc3) * var(--yRatio));
|
|
33
29
|
--y4: calc(var(--y3) * var(--rc4) * var(--yRatio));
|
|
34
|
-
--y5: calc(var(--y4) * var(--rc5) * var(--yRatio));
|
|
35
|
-
--y6: calc(var(--y5) * var(--rc6) * var(--yRatio));
|
|
36
30
|
|
|
37
|
-
--a1:
|
|
31
|
+
--a1: 5%;
|
|
38
32
|
--a2: calc(var(--a1) * var(--rc2) * var(--alphaRatio));
|
|
39
33
|
--a3: calc(var(--a2) * var(--rc3) * var(--alphaRatio));
|
|
40
34
|
--a4: calc(var(--a3) * var(--rc4) * var(--alphaRatio));
|
|
41
|
-
--a5: calc(var(--a4) * var(--rc5) * var(--alphaRatio));
|
|
42
|
-
--a6: calc(var(--a5) * var(--rc6) * var(--alphaRatio));
|
|
43
35
|
|
|
44
36
|
--s1: -0.1px;
|
|
45
37
|
--s2: calc(var(--s1) * var(--rc2) * var(--spreadRatio));
|
|
46
38
|
--s3: calc(var(--s2) * var(--rc3) * var(--spreadRatio));
|
|
47
39
|
--s4: calc(var(--s3) * var(--rc4) * var(--spreadRatio));
|
|
48
|
-
--s5: calc(var(--s4) * var(--rc5) * var(--spreadRatio));
|
|
49
|
-
--s6: calc(var(--s5) * var(--rc6) * var(--spreadRatio));
|
|
50
40
|
|
|
51
41
|
--shadow1: 0 var(--y1) var(--b1) var(--s1) hsl(var(--c) / var(--a1));
|
|
52
42
|
--shadow2: 0 var(--y2) var(--b2) var(--s2) hsl(var(--c) / var(--a2));
|
|
53
43
|
--shadow3: 0 var(--y3) var(--b3) var(--s3) hsl(var(--c) / var(--a3));
|
|
54
44
|
--shadow4: 0 var(--y4) var(--b4) var(--s4) hsl(var(--c) / var(--a4));
|
|
55
|
-
--shadow5: 0 var(--y5) var(--b5) var(--s5) hsl(var(--c) / var(--a5));
|
|
56
|
-
--shadow6: 0 var(--y6) var(--b6) var(--s6) hsl(var(--c) / var(--a6));
|
|
57
45
|
|
|
58
46
|
--grn-shadow-s:
|
|
59
47
|
var(--shadow1),
|
|
60
|
-
var(--shadow2)
|
|
61
|
-
var(--shadow3),
|
|
62
|
-
var(--shadow4)
|
|
48
|
+
var(--shadow2)
|
|
63
49
|
;
|
|
64
50
|
|
|
65
51
|
--grn-shadow-m:
|
|
66
52
|
var(--grn-shadow-s),
|
|
67
|
-
var(--
|
|
53
|
+
var(--shadow3)
|
|
68
54
|
;
|
|
69
55
|
|
|
70
56
|
--grn-shadow-l:
|
|
71
57
|
var(--grn-shadow-m),
|
|
72
|
-
var(--
|
|
58
|
+
var(--shadow4)
|
|
73
59
|
;
|
|
74
60
|
}
|