@sandlada/material-design-css 2.0.0-nightly.20250809a → 2.0.0
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/package.json +19 -17
- package/prebuild-color/blue.css +58 -0
- package/prebuild-color/green.css +58 -0
- package/prebuild-color/light-green.css +58 -0
- package/prebuild-color/pink.css +58 -0
- package/prebuild-color/yellow.css +58 -0
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sandlada/material-design-css",
|
|
3
|
-
"version": "2.0.0
|
|
3
|
+
"version": "2.0.0",
|
|
4
4
|
"description": "A ready-made npm package for a collection of css styles in the material design style.",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"author": "Sandlada & Kai-Orion",
|
|
@@ -11,7 +11,9 @@
|
|
|
11
11
|
},
|
|
12
12
|
"bugs": "https://github.com/sandlada/material-design-css/issues",
|
|
13
13
|
"homepage": "https://material-design-css.sandlada.com",
|
|
14
|
-
|
|
14
|
+
"publishConfig": {
|
|
15
|
+
"access": "public"
|
|
16
|
+
},
|
|
15
17
|
"keywords": [
|
|
16
18
|
"material-design",
|
|
17
19
|
"css-library",
|
|
@@ -45,16 +47,16 @@
|
|
|
45
47
|
"./shape": "./shape.css",
|
|
46
48
|
"./typography.css": "./typography.css",
|
|
47
49
|
"./typography": "./typography.css",
|
|
48
|
-
"./prebuild-color
|
|
49
|
-
"./prebuild-color
|
|
50
|
-
"./prebuild-color
|
|
51
|
-
"./prebuild-color
|
|
52
|
-
"./prebuild-color
|
|
53
|
-
"./prebuild-color
|
|
54
|
-
"./prebuild-color
|
|
55
|
-
"./prebuild-color
|
|
56
|
-
"./prebuild-color
|
|
57
|
-
"./prebuild-color
|
|
50
|
+
"./prebuild-color/blue.css": "./prebuild-color/blue.css",
|
|
51
|
+
"./prebuild-color/blue": "./prebuild-color/blue.css",
|
|
52
|
+
"./prebuild-color/green.css": "./prebuild-color/green.css",
|
|
53
|
+
"./prebuild-color/green": "./prebuild-color/green.css",
|
|
54
|
+
"./prebuild-color/light-green.css": "./prebuild-color/light-green.css",
|
|
55
|
+
"./prebuild-color/light-green": "./prebuild-color/light-green.css",
|
|
56
|
+
"./prebuild-color/pink.css": "./prebuild-color/pink.css",
|
|
57
|
+
"./prebuild-color/pink": "./prebuild-color/pink.css",
|
|
58
|
+
"./prebuild-color/yellow.css": "./prebuild-color/yellow.css",
|
|
59
|
+
"./prebuild-color/yellow": "./prebuild-color/yellow.css"
|
|
58
60
|
},
|
|
59
61
|
"style": "index.css",
|
|
60
62
|
"files": [
|
|
@@ -67,10 +69,10 @@
|
|
|
67
69
|
"motion/animation-utilities.css",
|
|
68
70
|
"shape.css",
|
|
69
71
|
"typography.css",
|
|
70
|
-
"prebuild-color
|
|
71
|
-
"prebuild-color
|
|
72
|
-
"prebuild-color
|
|
73
|
-
"prebuild-color
|
|
74
|
-
"prebuild-color
|
|
72
|
+
"prebuild-color/blue.css",
|
|
73
|
+
"prebuild-color/green.css",
|
|
74
|
+
"prebuild-color/light-green.css",
|
|
75
|
+
"prebuild-color/pink.css",
|
|
76
|
+
"prebuild-color/yellow.css"
|
|
75
77
|
]
|
|
76
78
|
}
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
@layer material-design-system.color.variable {
|
|
2
|
+
:root {
|
|
3
|
+
--md-sys-color-primary-palette-key-color : light-dark(#377f9d, #377f9d);
|
|
4
|
+
--md-sys-color-secondary-palette-key-color : light-dark(#667a85, #667a85);
|
|
5
|
+
--md-sys-color-tertiary-palette-key-color : light-dark(#777397, #777397);
|
|
6
|
+
--md-sys-color-neutral-palette-key-color : light-dark(#73787b, #73787b);
|
|
7
|
+
--md-sys-color-neutral-variant-palette-key-color: light-dark(#70787d, #70787d);
|
|
8
|
+
--md-sys-color-background : light-dark(#f6fafe, #0f1417);
|
|
9
|
+
--md-sys-color-on-background : light-dark(#171c1f, #dfe3e7);
|
|
10
|
+
--md-sys-color-surface : light-dark(#f6fafe, #0f1417);
|
|
11
|
+
--md-sys-color-surface-dim : light-dark(#d6dbde, #0f1417);
|
|
12
|
+
--md-sys-color-surface-bright : light-dark(#f6fafe, #353a3d);
|
|
13
|
+
--md-sys-color-surface-container-lowest : light-dark(#ffffff, #0a0f12);
|
|
14
|
+
--md-sys-color-surface-container-low : light-dark(#f0f4f8, #171c1f);
|
|
15
|
+
--md-sys-color-surface-container : light-dark(#eaeef2, #1b2023);
|
|
16
|
+
--md-sys-color-surface-container-high : light-dark(#e4e9ec, #262b2e);
|
|
17
|
+
--md-sys-color-surface-container-highest : light-dark(#dfe3e7, #303538);
|
|
18
|
+
--md-sys-color-on-surface : light-dark(#171c1f, #dfe3e7);
|
|
19
|
+
--md-sys-color-surface-variant : light-dark(#dce3e9, #40484c);
|
|
20
|
+
--md-sys-color-on-surface-variant : light-dark(#40484c, #c0c8cd);
|
|
21
|
+
--md-sys-color-inverse-surface : light-dark(#2c3134, #dfe3e7);
|
|
22
|
+
--md-sys-color-inverse-on-surface : light-dark(#edf1f5, #2c3134);
|
|
23
|
+
--md-sys-color-outline : light-dark(#70787d, #8a9297);
|
|
24
|
+
--md-sys-color-outline-variant : light-dark(#c0c8cd, #40484c);
|
|
25
|
+
--md-sys-color-shadow : light-dark(#000000, #000000);
|
|
26
|
+
--md-sys-color-scrim : light-dark(#000000, #000000);
|
|
27
|
+
--md-sys-color-surface-tint : light-dark(#146683, #8ccff0);
|
|
28
|
+
--md-sys-color-primary : light-dark(#146683, #8ccff0);
|
|
29
|
+
--md-sys-color-on-primary : light-dark(#ffffff, #003547);
|
|
30
|
+
--md-sys-color-primary-container : light-dark(#bfe9ff, #004d65);
|
|
31
|
+
--md-sys-color-on-primary-container : light-dark(#004d65, #bfe9ff);
|
|
32
|
+
--md-sys-color-inverse-primary : light-dark(#8ccff0, #146683);
|
|
33
|
+
--md-sys-color-secondary : light-dark(#4d616c, #b4cad6);
|
|
34
|
+
--md-sys-color-on-secondary : light-dark(#ffffff, #1f333d);
|
|
35
|
+
--md-sys-color-secondary-container : light-dark(#d0e6f2, #364954);
|
|
36
|
+
--md-sys-color-on-secondary-container : light-dark(#364954, #d0e6f2);
|
|
37
|
+
--md-sys-color-tertiary : light-dark(#5e5b7d, #c7c2ea);
|
|
38
|
+
--md-sys-color-on-tertiary : light-dark(#ffffff, #2f2d4c);
|
|
39
|
+
--md-sys-color-tertiary-container : light-dark(#e4dfff, #464364);
|
|
40
|
+
--md-sys-color-on-tertiary-container : light-dark(#464364, #e4dfff);
|
|
41
|
+
--md-sys-color-error : light-dark(#ba1a1a, #ffb4ab);
|
|
42
|
+
--md-sys-color-on-error : light-dark(#ffffff, #690005);
|
|
43
|
+
--md-sys-color-error-container : light-dark(#ffdad6, #93000a);
|
|
44
|
+
--md-sys-color-on-error-container : light-dark(#93000a, #ffdad6);
|
|
45
|
+
--md-sys-color-primary-fixed : light-dark(#bfe9ff, #bfe9ff);
|
|
46
|
+
--md-sys-color-primary-fixed-dim : light-dark(#8ccff0, #8ccff0);
|
|
47
|
+
--md-sys-color-on-primary-fixed : light-dark(#001f2a, #001f2a);
|
|
48
|
+
--md-sys-color-on-primary-fixed-variant : light-dark(#004d65, #004d65);
|
|
49
|
+
--md-sys-color-secondary-fixed : light-dark(#d0e6f2, #d0e6f2);
|
|
50
|
+
--md-sys-color-secondary-fixed-dim : light-dark(#b4cad6, #b4cad6);
|
|
51
|
+
--md-sys-color-on-secondary-fixed : light-dark(#081e27, #081e27);
|
|
52
|
+
--md-sys-color-on-secondary-fixed-variant : light-dark(#364954, #364954);
|
|
53
|
+
--md-sys-color-tertiary-fixed : light-dark(#e4dfff, #e4dfff);
|
|
54
|
+
--md-sys-color-tertiary-fixed-dim : light-dark(#c7c2ea, #c7c2ea);
|
|
55
|
+
--md-sys-color-on-tertiary-fixed : light-dark(#1a1836, #1a1836);
|
|
56
|
+
--md-sys-color-on-tertiary-fixed-variant : light-dark(#464364, #464364);
|
|
57
|
+
}
|
|
58
|
+
}
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
@layer material-design-system.color.variable {
|
|
2
|
+
:root {
|
|
3
|
+
--md-sys-color-primary-palette-key-color : light-dark(#49835a, #49835a);
|
|
4
|
+
--md-sys-color-secondary-palette-key-color : light-dark(#687c6b, #687c6b);
|
|
5
|
+
--md-sys-color-tertiary-palette-key-color : light-dark(#547e88, #547e88);
|
|
6
|
+
--md-sys-color-neutral-palette-key-color : light-dark(#737872, #737872);
|
|
7
|
+
--md-sys-color-neutral-variant-palette-key-color: light-dark(#717971, #717971);
|
|
8
|
+
--md-sys-color-background : light-dark(#f6fbf3, #101510);
|
|
9
|
+
--md-sys-color-on-background : light-dark(#181d18, #dfe4dc);
|
|
10
|
+
--md-sys-color-surface : light-dark(#f6fbf3, #101510);
|
|
11
|
+
--md-sys-color-surface-dim : light-dark(#d7dbd4, #101510);
|
|
12
|
+
--md-sys-color-surface-bright : light-dark(#f6fbf3, #353a35);
|
|
13
|
+
--md-sys-color-surface-container-lowest : light-dark(#ffffff, #0a0f0b);
|
|
14
|
+
--md-sys-color-surface-container-low : light-dark(#f0f5ed, #181d18);
|
|
15
|
+
--md-sys-color-surface-container : light-dark(#ebefe7, #1c211c);
|
|
16
|
+
--md-sys-color-surface-container-high : light-dark(#e5eae2, #262b26);
|
|
17
|
+
--md-sys-color-surface-container-highest : light-dark(#dfe4dc, #313631);
|
|
18
|
+
--md-sys-color-on-surface : light-dark(#181d18, #dfe4dc);
|
|
19
|
+
--md-sys-color-surface-variant : light-dark(#dde5da, #414941);
|
|
20
|
+
--md-sys-color-on-surface-variant : light-dark(#414941, #c1c9bf);
|
|
21
|
+
--md-sys-color-inverse-surface : light-dark(#2d322d, #dfe4dc);
|
|
22
|
+
--md-sys-color-inverse-on-surface : light-dark(#eef2ea, #2d322d);
|
|
23
|
+
--md-sys-color-outline : light-dark(#717971, #8b938a);
|
|
24
|
+
--md-sys-color-outline-variant : light-dark(#c1c9bf, #414941);
|
|
25
|
+
--md-sys-color-shadow : light-dark(#000000, #000000);
|
|
26
|
+
--md-sys-color-scrim : light-dark(#000000, #000000);
|
|
27
|
+
--md-sys-color-surface-tint : light-dark(#306a43, #97d5a5);
|
|
28
|
+
--md-sys-color-primary : light-dark(#306a43, #97d5a5);
|
|
29
|
+
--md-sys-color-on-primary : light-dark(#ffffff, #00391a);
|
|
30
|
+
--md-sys-color-primary-container : light-dark(#b2f1bf, #14512d);
|
|
31
|
+
--md-sys-color-on-primary-container : light-dark(#14512d, #b2f1bf);
|
|
32
|
+
--md-sys-color-inverse-primary : light-dark(#97d5a5, #306a43);
|
|
33
|
+
--md-sys-color-secondary : light-dark(#506353, #b6ccb8);
|
|
34
|
+
--md-sys-color-on-secondary : light-dark(#ffffff, #223526);
|
|
35
|
+
--md-sys-color-secondary-container : light-dark(#d2e8d3, #384b3c);
|
|
36
|
+
--md-sys-color-on-secondary-container : light-dark(#384b3c, #d2e8d3);
|
|
37
|
+
--md-sys-color-tertiary : light-dark(#3a656f, #a2ced9);
|
|
38
|
+
--md-sys-color-on-tertiary : light-dark(#ffffff, #01363f);
|
|
39
|
+
--md-sys-color-tertiary-container : light-dark(#beeaf6, #204d56);
|
|
40
|
+
--md-sys-color-on-tertiary-container : light-dark(#204d56, #beeaf6);
|
|
41
|
+
--md-sys-color-error : light-dark(#ba1a1a, #ffb4ab);
|
|
42
|
+
--md-sys-color-on-error : light-dark(#ffffff, #690005);
|
|
43
|
+
--md-sys-color-error-container : light-dark(#ffdad6, #93000a);
|
|
44
|
+
--md-sys-color-on-error-container : light-dark(#93000a, #ffdad6);
|
|
45
|
+
--md-sys-color-primary-fixed : light-dark(#b2f1bf, #b2f1bf);
|
|
46
|
+
--md-sys-color-primary-fixed-dim : light-dark(#97d5a5, #97d5a5);
|
|
47
|
+
--md-sys-color-on-primary-fixed : light-dark(#00210d, #00210d);
|
|
48
|
+
--md-sys-color-on-primary-fixed-variant : light-dark(#14512d, #14512d);
|
|
49
|
+
--md-sys-color-secondary-fixed : light-dark(#d2e8d3, #d2e8d3);
|
|
50
|
+
--md-sys-color-secondary-fixed-dim : light-dark(#b6ccb8, #b6ccb8);
|
|
51
|
+
--md-sys-color-on-secondary-fixed : light-dark(#0d1f12, #0d1f12);
|
|
52
|
+
--md-sys-color-on-secondary-fixed-variant : light-dark(#384b3c, #384b3c);
|
|
53
|
+
--md-sys-color-tertiary-fixed : light-dark(#beeaf6, #beeaf6);
|
|
54
|
+
--md-sys-color-tertiary-fixed-dim : light-dark(#a2ced9, #a2ced9);
|
|
55
|
+
--md-sys-color-on-tertiary-fixed : light-dark(#001f25, #001f25);
|
|
56
|
+
--md-sys-color-on-tertiary-fixed-variant : light-dark(#204d56, #204d56);
|
|
57
|
+
}
|
|
58
|
+
}
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
@layer material-design-system.color.variable {
|
|
2
|
+
:root {
|
|
3
|
+
--md-sys-color-primary-palette-key-color : light-dark(#388647, #388647);
|
|
4
|
+
--md-sys-color-secondary-palette-key-color : light-dark(#697c68, #697c68);
|
|
5
|
+
--md-sys-color-tertiary-palette-key-color : light-dark(#527e86, #527e86);
|
|
6
|
+
--md-sys-color-neutral-palette-key-color : light-dark(#777777, #777777);
|
|
7
|
+
--md-sys-color-neutral-variant-palette-key-color: light-dark(#777777, #777777);
|
|
8
|
+
--md-sys-color-background : light-dark(#f9f9f9, #131313);
|
|
9
|
+
--md-sys-color-on-background : light-dark(#1b1b1b, #e2e2e2);
|
|
10
|
+
--md-sys-color-surface : light-dark(#f9f9f9, #131313);
|
|
11
|
+
--md-sys-color-surface-dim : light-dark(#dadada, #131313);
|
|
12
|
+
--md-sys-color-surface-bright : light-dark(#f9f9f9, #393939);
|
|
13
|
+
--md-sys-color-surface-container-lowest : light-dark(#ffffff, #0e0e0e);
|
|
14
|
+
--md-sys-color-surface-container-low : light-dark(#f3f3f3, #1b1b1b);
|
|
15
|
+
--md-sys-color-surface-container : light-dark(#eeeeee, #1f1f1f);
|
|
16
|
+
--md-sys-color-surface-container-high : light-dark(#e8e8e8, #2a2a2a);
|
|
17
|
+
--md-sys-color-surface-container-highest : light-dark(#e2e2e2, #353535);
|
|
18
|
+
--md-sys-color-on-surface : light-dark(#1b1b1b, #e2e2e2);
|
|
19
|
+
--md-sys-color-surface-variant : light-dark(#e2e2e2, #474747);
|
|
20
|
+
--md-sys-color-on-surface-variant : light-dark(#474747, #c6c6c6);
|
|
21
|
+
--md-sys-color-inverse-surface : light-dark(#303030, #e2e2e2);
|
|
22
|
+
--md-sys-color-inverse-on-surface : light-dark(#f1f1f1, #303030);
|
|
23
|
+
--md-sys-color-outline : light-dark(#777777, #919191);
|
|
24
|
+
--md-sys-color-outline-variant : light-dark(#c6c6c6, #474747);
|
|
25
|
+
--md-sys-color-shadow : light-dark(#000000, #000000);
|
|
26
|
+
--md-sys-color-scrim : light-dark(#000000, #000000);
|
|
27
|
+
--md-sys-color-surface-tint : light-dark(#1a6c31, #88d990);
|
|
28
|
+
--md-sys-color-primary : light-dark(#1a6c31, #88d990);
|
|
29
|
+
--md-sys-color-on-primary : light-dark(#ffffff, #003913);
|
|
30
|
+
--md-sys-color-primary-container : light-dark(#a3f5aa, #00531f);
|
|
31
|
+
--md-sys-color-on-primary-container : light-dark(#00531f, #a3f5aa);
|
|
32
|
+
--md-sys-color-inverse-primary : light-dark(#88d990, #1a6c31);
|
|
33
|
+
--md-sys-color-secondary : light-dark(#516351, #b8ccb5);
|
|
34
|
+
--md-sys-color-on-secondary : light-dark(#ffffff, #243425);
|
|
35
|
+
--md-sys-color-secondary-container : light-dark(#d4e8d1, #3a4b3a);
|
|
36
|
+
--md-sys-color-on-secondary-container : light-dark(#3a4b3a, #d4e8d1);
|
|
37
|
+
--md-sys-color-tertiary : light-dark(#39656c, #a1ced6);
|
|
38
|
+
--md-sys-color-on-tertiary : light-dark(#ffffff, #00363d);
|
|
39
|
+
--md-sys-color-tertiary-container : light-dark(#bdeaf3, #1f4d54);
|
|
40
|
+
--md-sys-color-on-tertiary-container : light-dark(#1f4d54, #bdeaf3);
|
|
41
|
+
--md-sys-color-error : light-dark(#ba1a1a, #ffb4ab);
|
|
42
|
+
--md-sys-color-on-error : light-dark(#ffffff, #690005);
|
|
43
|
+
--md-sys-color-error-container : light-dark(#ffdad6, #93000a);
|
|
44
|
+
--md-sys-color-on-error-container : light-dark(#93000a, #ffdad6);
|
|
45
|
+
--md-sys-color-primary-fixed : light-dark(#a3f5aa, #a3f5aa);
|
|
46
|
+
--md-sys-color-primary-fixed-dim : light-dark(#88d990, #88d990);
|
|
47
|
+
--md-sys-color-on-primary-fixed : light-dark(#002108, #002108);
|
|
48
|
+
--md-sys-color-on-primary-fixed-variant : light-dark(#00531f, #00531f);
|
|
49
|
+
--md-sys-color-secondary-fixed : light-dark(#d4e8d1, #d4e8d1);
|
|
50
|
+
--md-sys-color-secondary-fixed-dim : light-dark(#b8ccb5, #b8ccb5);
|
|
51
|
+
--md-sys-color-on-secondary-fixed : light-dark(#0f1f11, #0f1f11);
|
|
52
|
+
--md-sys-color-on-secondary-fixed-variant : light-dark(#3a4b3a, #3a4b3a);
|
|
53
|
+
--md-sys-color-tertiary-fixed : light-dark(#bdeaf3, #bdeaf3);
|
|
54
|
+
--md-sys-color-tertiary-fixed-dim : light-dark(#a1ced6, #a1ced6);
|
|
55
|
+
--md-sys-color-on-tertiary-fixed : light-dark(#001f24, #001f24);
|
|
56
|
+
--md-sys-color-on-tertiary-fixed-variant : light-dark(#1f4d54, #1f4d54);
|
|
57
|
+
}
|
|
58
|
+
}
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
@layer material-design-system.color.variable {
|
|
2
|
+
:root {
|
|
3
|
+
--md-sys-color-primary-palette-key-color : light-dark(#ab616d, #ab616d);
|
|
4
|
+
--md-sys-color-secondary-palette-key-color : light-dark(#906e72, #906e72);
|
|
5
|
+
--md-sys-color-tertiary-palette-key-color : light-dark(#947047, #947047);
|
|
6
|
+
--md-sys-color-neutral-palette-key-color : light-dark(#817475, #817475);
|
|
7
|
+
--md-sys-color-neutral-variant-palette-key-color: light-dark(#847374, #847374);
|
|
8
|
+
--md-sys-color-background : light-dark(#fff8f7, #1a1112);
|
|
9
|
+
--md-sys-color-on-background : light-dark(#22191a, #f0dedf);
|
|
10
|
+
--md-sys-color-surface : light-dark(#fff8f7, #1a1112);
|
|
11
|
+
--md-sys-color-surface-dim : light-dark(#e7d6d7, #1a1112);
|
|
12
|
+
--md-sys-color-surface-bright : light-dark(#fff8f7, #413738);
|
|
13
|
+
--md-sys-color-surface-container-lowest : light-dark(#ffffff, #140c0d);
|
|
14
|
+
--md-sys-color-surface-container-low : light-dark(#fff0f1, #22191a);
|
|
15
|
+
--md-sys-color-surface-container : light-dark(#fbeaeb, #261d1e);
|
|
16
|
+
--md-sys-color-surface-container-high : light-dark(#f6e4e5, #312829);
|
|
17
|
+
--md-sys-color-surface-container-highest : light-dark(#f0dedf, #3d3233);
|
|
18
|
+
--md-sys-color-on-surface : light-dark(#22191a, #f0dedf);
|
|
19
|
+
--md-sys-color-surface-variant : light-dark(#f3dddf, #524345);
|
|
20
|
+
--md-sys-color-on-surface-variant : light-dark(#524345, #d7c1c3);
|
|
21
|
+
--md-sys-color-inverse-surface : light-dark(#382e2f, #f0dedf);
|
|
22
|
+
--md-sys-color-inverse-on-surface : light-dark(#feeded, #382e2f);
|
|
23
|
+
--md-sys-color-outline : light-dark(#847374, #9f8c8e);
|
|
24
|
+
--md-sys-color-outline-variant : light-dark(#d7c1c3, #524345);
|
|
25
|
+
--md-sys-color-shadow : light-dark(#000000, #000000);
|
|
26
|
+
--md-sys-color-scrim : light-dark(#000000, #000000);
|
|
27
|
+
--md-sys-color-surface-tint : light-dark(#8e4955, #ffb2bc);
|
|
28
|
+
--md-sys-color-primary : light-dark(#8e4955, #ffb2bc);
|
|
29
|
+
--md-sys-color-on-primary : light-dark(#ffffff, #561d29);
|
|
30
|
+
--md-sys-color-primary-container : light-dark(#ffd9dd, #72333e);
|
|
31
|
+
--md-sys-color-on-primary-container : light-dark(#72333e, #ffd9dd);
|
|
32
|
+
--md-sys-color-inverse-primary : light-dark(#ffb2bc, #8e4955);
|
|
33
|
+
--md-sys-color-secondary : light-dark(#76565a, #e5bdc1);
|
|
34
|
+
--md-sys-color-on-secondary : light-dark(#ffffff, #43292d);
|
|
35
|
+
--md-sys-color-secondary-container : light-dark(#ffd9dd, #5c3f43);
|
|
36
|
+
--md-sys-color-on-secondary-container : light-dark(#5c3f43, #ffd9dd);
|
|
37
|
+
--md-sys-color-tertiary : light-dark(#795831, #eabf8f);
|
|
38
|
+
--md-sys-color-on-tertiary : light-dark(#ffffff, #452b07);
|
|
39
|
+
--md-sys-color-tertiary-container : light-dark(#ffddb9, #5e411c);
|
|
40
|
+
--md-sys-color-on-tertiary-container : light-dark(#5e411c, #ffddb9);
|
|
41
|
+
--md-sys-color-error : light-dark(#ba1a1a, #ffb4ab);
|
|
42
|
+
--md-sys-color-on-error : light-dark(#ffffff, #690005);
|
|
43
|
+
--md-sys-color-error-container : light-dark(#ffdad6, #93000a);
|
|
44
|
+
--md-sys-color-on-error-container : light-dark(#93000a, #ffdad6);
|
|
45
|
+
--md-sys-color-primary-fixed : light-dark(#ffd9dd, #ffd9dd);
|
|
46
|
+
--md-sys-color-primary-fixed-dim : light-dark(#ffb2bc, #ffb2bc);
|
|
47
|
+
--md-sys-color-on-primary-fixed : light-dark(#3b0714, #3b0714);
|
|
48
|
+
--md-sys-color-on-primary-fixed-variant : light-dark(#72333e, #72333e);
|
|
49
|
+
--md-sys-color-secondary-fixed : light-dark(#ffd9dd, #ffd9dd);
|
|
50
|
+
--md-sys-color-secondary-fixed-dim : light-dark(#e5bdc1, #e5bdc1);
|
|
51
|
+
--md-sys-color-on-secondary-fixed : light-dark(#2c1518, #2c1518);
|
|
52
|
+
--md-sys-color-on-secondary-fixed-variant : light-dark(#5c3f43, #5c3f43);
|
|
53
|
+
--md-sys-color-tertiary-fixed : light-dark(#ffddb9, #ffddb9);
|
|
54
|
+
--md-sys-color-tertiary-fixed-dim : light-dark(#eabf8f, #eabf8f);
|
|
55
|
+
--md-sys-color-on-tertiary-fixed : light-dark(#2b1700, #2b1700);
|
|
56
|
+
--md-sys-color-on-tertiary-fixed-variant : light-dark(#5e411c, #5e411c);
|
|
57
|
+
}
|
|
58
|
+
}
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
@layer material-design-system.color.variable {
|
|
2
|
+
:root {
|
|
3
|
+
--md-sys-color-primary-palette-key-color : light-dark(#a46a32, #a46a32);
|
|
4
|
+
--md-sys-color-secondary-palette-key-color : light-dark(#8e725a, #8e725a);
|
|
5
|
+
--md-sys-color-tertiary-palette-key-color : light-dark(#737b4e, #737b4e);
|
|
6
|
+
--md-sys-color-neutral-palette-key-color : light-dark(#81756d, #81756d);
|
|
7
|
+
--md-sys-color-neutral-variant-palette-key-color: light-dark(#837469, #837469);
|
|
8
|
+
--md-sys-color-background : light-dark(#fff8f5, #19120c);
|
|
9
|
+
--md-sys-color-on-background : light-dark(#221a14, #efe0d5);
|
|
10
|
+
--md-sys-color-surface : light-dark(#fff8f5, #19120c);
|
|
11
|
+
--md-sys-color-surface-dim : light-dark(#e6d7cd, #19120c);
|
|
12
|
+
--md-sys-color-surface-bright : light-dark(#fff8f5, #413730);
|
|
13
|
+
--md-sys-color-surface-container-lowest : light-dark(#ffffff, #130d08);
|
|
14
|
+
--md-sys-color-surface-container-low : light-dark(#fff1e8, #221a14);
|
|
15
|
+
--md-sys-color-surface-container : light-dark(#fbebe1, #261e18);
|
|
16
|
+
--md-sys-color-surface-container-high : light-dark(#f5e5db, #312822);
|
|
17
|
+
--md-sys-color-surface-container-highest : light-dark(#efe0d5, #3c332c);
|
|
18
|
+
--md-sys-color-on-surface : light-dark(#221a14, #efe0d5);
|
|
19
|
+
--md-sys-color-surface-variant : light-dark(#f2dfd1, #51443a);
|
|
20
|
+
--md-sys-color-on-surface-variant : light-dark(#51443a, #d6c3b6);
|
|
21
|
+
--md-sys-color-inverse-surface : light-dark(#372f28, #efe0d5);
|
|
22
|
+
--md-sys-color-inverse-on-surface : light-dark(#feeee3, #372f28);
|
|
23
|
+
--md-sys-color-outline : light-dark(#837469, #9e8e82);
|
|
24
|
+
--md-sys-color-outline-variant : light-dark(#d6c3b6, #51443a);
|
|
25
|
+
--md-sys-color-shadow : light-dark(#000000, #000000);
|
|
26
|
+
--md-sys-color-scrim : light-dark(#000000, #000000);
|
|
27
|
+
--md-sys-color-surface-tint : light-dark(#87521c, #ffb778);
|
|
28
|
+
--md-sys-color-primary : light-dark(#87521c, #ffb778);
|
|
29
|
+
--md-sys-color-on-primary : light-dark(#ffffff, #4c2700);
|
|
30
|
+
--md-sys-color-primary-container : light-dark(#ffdcc1, #6b3b04);
|
|
31
|
+
--md-sys-color-on-primary-container : light-dark(#6b3b04, #ffdcc1);
|
|
32
|
+
--md-sys-color-inverse-primary : light-dark(#ffb778, #87521c);
|
|
33
|
+
--md-sys-color-secondary : light-dark(#735943, #e2c0a5);
|
|
34
|
+
--md-sys-color-on-secondary : light-dark(#ffffff, #412c19);
|
|
35
|
+
--md-sys-color-secondary-container : light-dark(#ffdcc1, #5a422d);
|
|
36
|
+
--md-sys-color-on-secondary-container : light-dark(#5a422d, #ffdcc1);
|
|
37
|
+
--md-sys-color-tertiary : light-dark(#5b6238, #c3cb98);
|
|
38
|
+
--md-sys-color-on-tertiary : light-dark(#ffffff, #2d330e);
|
|
39
|
+
--md-sys-color-tertiary-container : light-dark(#dfe7b2, #434a22);
|
|
40
|
+
--md-sys-color-on-tertiary-container : light-dark(#434a22, #dfe7b2);
|
|
41
|
+
--md-sys-color-error : light-dark(#ba1a1a, #ffb4ab);
|
|
42
|
+
--md-sys-color-on-error : light-dark(#ffffff, #690005);
|
|
43
|
+
--md-sys-color-error-container : light-dark(#ffdad6, #93000a);
|
|
44
|
+
--md-sys-color-on-error-container : light-dark(#93000a, #ffdad6);
|
|
45
|
+
--md-sys-color-primary-fixed : light-dark(#ffdcc1, #ffdcc1);
|
|
46
|
+
--md-sys-color-primary-fixed-dim : light-dark(#ffb778, #ffb778);
|
|
47
|
+
--md-sys-color-on-primary-fixed : light-dark(#2e1500, #2e1500);
|
|
48
|
+
--md-sys-color-on-primary-fixed-variant : light-dark(#6b3b04, #6b3b04);
|
|
49
|
+
--md-sys-color-secondary-fixed : light-dark(#ffdcc1, #ffdcc1);
|
|
50
|
+
--md-sys-color-secondary-fixed-dim : light-dark(#e2c0a5, #e2c0a5);
|
|
51
|
+
--md-sys-color-on-secondary-fixed : light-dark(#2a1706, #2a1706);
|
|
52
|
+
--md-sys-color-on-secondary-fixed-variant : light-dark(#5a422d, #5a422d);
|
|
53
|
+
--md-sys-color-tertiary-fixed : light-dark(#dfe7b2, #dfe7b2);
|
|
54
|
+
--md-sys-color-tertiary-fixed-dim : light-dark(#c3cb98, #c3cb98);
|
|
55
|
+
--md-sys-color-on-tertiary-fixed : light-dark(#181e00, #181e00);
|
|
56
|
+
--md-sys-color-on-tertiary-fixed-variant : light-dark(#434a22, #434a22);
|
|
57
|
+
}
|
|
58
|
+
}
|