@sandlada/material-design-css 2.3.0-20250927.a → 2.3.0-20250927.b
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 -27
- package/prebuild-color/cold-blue.css +58 -0
- package/prebuild-color/cold-purple.css +58 -0
- package/prebuild-color/monochrome-high-contrast.css +58 -0
- package/prebuild-color/monochrome-low-contrast.css +58 -0
- package/prebuild-color/monochrome.css +58 -0
- package/prebuild-color/orange.css +58 -0
- package/prebuild-color/viridian.css +58 -0
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name" : "@sandlada/material-design-css",
|
|
3
|
-
"version" : "2.3.0-20250927.
|
|
3
|
+
"version" : "2.3.0-20250927.b",
|
|
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",
|
|
@@ -50,35 +50,27 @@
|
|
|
50
50
|
"./typography/tailwind-theme.css" : "./typography/tailwind-theme.css",
|
|
51
51
|
"./typography/tailwind-utilities.css" : "./typography/tailwind-utilities.css",
|
|
52
52
|
|
|
53
|
-
"./prebuild-color/blue.css"
|
|
54
|
-
"./prebuild-color/
|
|
55
|
-
"./prebuild-color/
|
|
56
|
-
"./prebuild-color/
|
|
57
|
-
"./prebuild-color/
|
|
53
|
+
"./prebuild-color/blue.css" : "./prebuild-color/blue.css",
|
|
54
|
+
"./prebuild-color/cold-blue.css" : "./prebuild-color/cold-blue.css",
|
|
55
|
+
"./prebuild-color/cold-purple.css" : "./prebuild-color/cold-purple.css",
|
|
56
|
+
"./prebuild-color/green.css" : "./prebuild-color/green.css",
|
|
57
|
+
"./prebuild-color/light-green.css" : "./prebuild-color/light-green.css",
|
|
58
|
+
"./prebuild-color/mono-chrome-high-contrast.css": "./prebuild-color/mono-chrome-high-contrast.css",
|
|
59
|
+
"./prebuild-color/mono-chrome-low-contrast.css" : "./prebuild-color/mono-chrome-low-contrast.css",
|
|
60
|
+
"./prebuild-color/mono-chrome.css" : "./prebuild-color/mono-chrome.css",
|
|
61
|
+
"./prebuild-color/orange.css" : "./prebuild-color/orange.css",
|
|
62
|
+
"./prebuild-color/pink.css" : "./prebuild-color/pink.css",
|
|
63
|
+
"./prebuild-color/viridian.css" : "./prebuild-color/viridian.css",
|
|
64
|
+
"./prebuild-color/yellow.css" : "./prebuild-color/yellow.css"
|
|
58
65
|
},
|
|
59
66
|
"style": "index.css",
|
|
60
67
|
"files": [
|
|
61
|
-
"color
|
|
62
|
-
"
|
|
63
|
-
"
|
|
64
|
-
"color
|
|
65
|
-
"motion/transition-utilities.css",
|
|
66
|
-
"motion/animation-utilities.css",
|
|
67
|
-
"motion/tailwind-theme.css",
|
|
68
|
-
"palette/bg-utilities.css",
|
|
69
|
-
"palette/text-utilities.css",
|
|
70
|
-
"palette/tailwind-theme.css",
|
|
71
|
-
"prebuild-color/blue.css",
|
|
72
|
-
"prebuild-color/green.css",
|
|
73
|
-
"prebuild-color/light-green.css",
|
|
74
|
-
"prebuild-color/pink.css",
|
|
75
|
-
"prebuild-color/yellow.css",
|
|
68
|
+
"color/*",
|
|
69
|
+
"motion/*",
|
|
70
|
+
"palette/*",
|
|
71
|
+
"prebuild-color/*",
|
|
76
72
|
"preset.css",
|
|
77
|
-
"shape
|
|
78
|
-
"
|
|
79
|
-
"typography/typography-utilities.css",
|
|
80
|
-
"typography/tailwind-theme.css",
|
|
81
|
-
"typography/tailwind-utilities.css"
|
|
82
|
-
|
|
73
|
+
"shape/*",
|
|
74
|
+
"typography/*"
|
|
83
75
|
]
|
|
84
76
|
}
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
@layer material-design-system.color.variable {
|
|
2
|
+
:root {
|
|
3
|
+
--md-sys-color-primary-palette-key-color : light-dark(#6b7986, #6b7986);
|
|
4
|
+
--md-sys-color-secondary-palette-key-color : light-dark(#72777d, #72777d);
|
|
5
|
+
--md-sys-color-tertiary-palette-key-color : light-dark(#ddbca7, #ddbca7);
|
|
6
|
+
--md-sys-color-neutral-palette-key-color : light-dark(#787778, #787778);
|
|
7
|
+
--md-sys-color-neutral-variant-palette-key-color: light-dark(#74777c, #74777c);
|
|
8
|
+
--md-sys-color-background : light-dark(#fbf9f9, #fbf9f9);
|
|
9
|
+
--md-sys-color-on-background : light-dark(#1b1c1c, #1b1c1c);
|
|
10
|
+
--md-sys-color-surface : light-dark(#fbf9f9, #fbf9f9);
|
|
11
|
+
--md-sys-color-surface-dim : light-dark(#dbd9da, #dbd9da);
|
|
12
|
+
--md-sys-color-surface-bright : light-dark(#fbf9f9, #fbf9f9);
|
|
13
|
+
--md-sys-color-surface-container-lowest : light-dark(#ffffff, #ffffff);
|
|
14
|
+
--md-sys-color-surface-container-low : light-dark(#f5f3f4, #f5f3f4);
|
|
15
|
+
--md-sys-color-surface-container : light-dark(#f0edee, #f0edee);
|
|
16
|
+
--md-sys-color-surface-container-high : light-dark(#eae7e8, #eae7e8);
|
|
17
|
+
--md-sys-color-surface-container-highest : light-dark(#e4e2e3, #e4e2e3);
|
|
18
|
+
--md-sys-color-on-surface : light-dark(#1b1c1c, #1b1c1c);
|
|
19
|
+
--md-sys-color-surface-variant : light-dark(#e0e2e8, #e0e2e8);
|
|
20
|
+
--md-sys-color-on-surface-variant : light-dark(#44474b, #44474b);
|
|
21
|
+
--md-sys-color-inverse-surface : light-dark(#303031, #303031);
|
|
22
|
+
--md-sys-color-inverse-on-surface : light-dark(#f2f0f1, #f2f0f1);
|
|
23
|
+
--md-sys-color-outline : light-dark(#74777c, #74777c);
|
|
24
|
+
--md-sys-color-outline-variant : light-dark(#c4c7cc, #c4c7cc);
|
|
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(#52606d, #52606d);
|
|
28
|
+
--md-sys-color-primary : light-dark(#52606d, #52606d);
|
|
29
|
+
--md-sys-color-on-primary : light-dark(#ffffff, #ffffff);
|
|
30
|
+
--md-sys-color-primary-container : light-dark(#b6c4d3, #b6c4d3);
|
|
31
|
+
--md-sys-color-on-primary-container : light-dark(#44515e, #44515e);
|
|
32
|
+
--md-sys-color-inverse-primary : light-dark(#bac8d7, #bac8d7);
|
|
33
|
+
--md-sys-color-secondary : light-dark(#5a5f65, #5a5f65);
|
|
34
|
+
--md-sys-color-on-secondary : light-dark(#ffffff, #ffffff);
|
|
35
|
+
--md-sys-color-secondary-container : light-dark(#dce0e7, #dce0e7);
|
|
36
|
+
--md-sys-color-on-secondary-container : light-dark(#5e6369, #5e6369);
|
|
37
|
+
--md-sys-color-tertiary : light-dark(#735948, #735948);
|
|
38
|
+
--md-sys-color-on-tertiary : light-dark(#ffffff, #ffffff);
|
|
39
|
+
--md-sys-color-tertiary-container : light-dark(#ddbca7, #ddbca7);
|
|
40
|
+
--md-sys-color-on-tertiary-container : light-dark(#634b3a, #634b3a);
|
|
41
|
+
--md-sys-color-error : light-dark(#ba1a1a, #ba1a1a);
|
|
42
|
+
--md-sys-color-on-error : light-dark(#ffffff, #ffffff);
|
|
43
|
+
--md-sys-color-error-container : light-dark(#ffdad6, #ffdad6);
|
|
44
|
+
--md-sys-color-on-error-container : light-dark(#93000a, #93000a);
|
|
45
|
+
--md-sys-color-primary-fixed : light-dark(#d6e4f4, #d6e4f4);
|
|
46
|
+
--md-sys-color-primary-fixed-dim : light-dark(#bac8d7, #bac8d7);
|
|
47
|
+
--md-sys-color-on-primary-fixed : light-dark(#0f1d28, #0f1d28);
|
|
48
|
+
--md-sys-color-on-primary-fixed-variant : light-dark(#3b4855, #3b4855);
|
|
49
|
+
--md-sys-color-secondary-fixed : light-dark(#dfe3e9, #dfe3e9);
|
|
50
|
+
--md-sys-color-secondary-fixed-dim : light-dark(#c2c7cd, #c2c7cd);
|
|
51
|
+
--md-sys-color-on-secondary-fixed : light-dark(#171c21, #171c21);
|
|
52
|
+
--md-sys-color-on-secondary-fixed-variant : light-dark(#42474d, #42474d);
|
|
53
|
+
--md-sys-color-tertiary-fixed : light-dark(#ffdcc6, #ffdcc6);
|
|
54
|
+
--md-sys-color-tertiary-fixed-dim : light-dark(#e1c0ab, #e1c0ab);
|
|
55
|
+
--md-sys-color-on-tertiary-fixed : light-dark(#29170a, #29170a);
|
|
56
|
+
--md-sys-color-on-tertiary-fixed-variant : light-dark(#594232, #594232);
|
|
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(#6f72ac, #6f72ac);
|
|
4
|
+
--md-sys-color-secondary-palette-key-color : light-dark(#75758b, #75758b);
|
|
5
|
+
--md-sys-color-tertiary-palette-key-color : light-dark(#936b83, #936b83);
|
|
6
|
+
--md-sys-color-neutral-palette-key-color : light-dark(#78767d, #78767d);
|
|
7
|
+
--md-sys-color-neutral-variant-palette-key-color: light-dark(#777680, #777680);
|
|
8
|
+
--md-sys-color-background : light-dark(#fbf8ff, #fbf8ff);
|
|
9
|
+
--md-sys-color-on-background : light-dark(#1b1b21, #1b1b21);
|
|
10
|
+
--md-sys-color-surface : light-dark(#fbf8ff, #fbf8ff);
|
|
11
|
+
--md-sys-color-surface-dim : light-dark(#dcd9e0, #dcd9e0);
|
|
12
|
+
--md-sys-color-surface-bright : light-dark(#fbf8ff, #fbf8ff);
|
|
13
|
+
--md-sys-color-surface-container-lowest : light-dark(#ffffff, #ffffff);
|
|
14
|
+
--md-sys-color-surface-container-low : light-dark(#f6f2fa, #f6f2fa);
|
|
15
|
+
--md-sys-color-surface-container : light-dark(#f0ecf4, #f0ecf4);
|
|
16
|
+
--md-sys-color-surface-container-high : light-dark(#eae7ef, #eae7ef);
|
|
17
|
+
--md-sys-color-surface-container-highest : light-dark(#e4e1e9, #e4e1e9);
|
|
18
|
+
--md-sys-color-on-surface : light-dark(#1b1b21, #1b1b21);
|
|
19
|
+
--md-sys-color-surface-variant : light-dark(#e4e1ec, #e4e1ec);
|
|
20
|
+
--md-sys-color-on-surface-variant : light-dark(#46464f, #46464f);
|
|
21
|
+
--md-sys-color-inverse-surface : light-dark(#303036, #303036);
|
|
22
|
+
--md-sys-color-inverse-on-surface : light-dark(#f3eff7, #f3eff7);
|
|
23
|
+
--md-sys-color-outline : light-dark(#777680, #777680);
|
|
24
|
+
--md-sys-color-outline-variant : light-dark(#c7c5d0, #c7c5d0);
|
|
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(#565992, #565992);
|
|
28
|
+
--md-sys-color-primary : light-dark(#565992, #565992);
|
|
29
|
+
--md-sys-color-on-primary : light-dark(#ffffff, #ffffff);
|
|
30
|
+
--md-sys-color-primary-container : light-dark(#e1e0ff, #e1e0ff);
|
|
31
|
+
--md-sys-color-on-primary-container : light-dark(#3f4178, #3f4178);
|
|
32
|
+
--md-sys-color-inverse-primary : light-dark(#bfc1ff, #bfc1ff);
|
|
33
|
+
--md-sys-color-secondary : light-dark(#5c5d72, #5c5d72);
|
|
34
|
+
--md-sys-color-on-secondary : light-dark(#ffffff, #ffffff);
|
|
35
|
+
--md-sys-color-secondary-container : light-dark(#e2e0f9, #e2e0f9);
|
|
36
|
+
--md-sys-color-on-secondary-container : light-dark(#454559, #454559);
|
|
37
|
+
--md-sys-color-tertiary : light-dark(#79536a, #79536a);
|
|
38
|
+
--md-sys-color-on-tertiary : light-dark(#ffffff, #ffffff);
|
|
39
|
+
--md-sys-color-tertiary-container : light-dark(#ffd8ed, #ffd8ed);
|
|
40
|
+
--md-sys-color-on-tertiary-container : light-dark(#5f3c52, #5f3c52);
|
|
41
|
+
--md-sys-color-error : light-dark(#ba1a1a, #ba1a1a);
|
|
42
|
+
--md-sys-color-on-error : light-dark(#ffffff, #ffffff);
|
|
43
|
+
--md-sys-color-error-container : light-dark(#ffdad6, #ffdad6);
|
|
44
|
+
--md-sys-color-on-error-container : light-dark(#93000a, #93000a);
|
|
45
|
+
--md-sys-color-primary-fixed : light-dark(#e1e0ff, #e1e0ff);
|
|
46
|
+
--md-sys-color-primary-fixed-dim : light-dark(#bfc1ff, #bfc1ff);
|
|
47
|
+
--md-sys-color-on-primary-fixed : light-dark(#12144b, #12144b);
|
|
48
|
+
--md-sys-color-on-primary-fixed-variant : light-dark(#3f4178, #3f4178);
|
|
49
|
+
--md-sys-color-secondary-fixed : light-dark(#e2e0f9, #e2e0f9);
|
|
50
|
+
--md-sys-color-secondary-fixed-dim : light-dark(#c5c4dd, #c5c4dd);
|
|
51
|
+
--md-sys-color-on-secondary-fixed : light-dark(#191a2c, #191a2c);
|
|
52
|
+
--md-sys-color-on-secondary-fixed-variant : light-dark(#454559, #454559);
|
|
53
|
+
--md-sys-color-tertiary-fixed : light-dark(#ffd8ed, #ffd8ed);
|
|
54
|
+
--md-sys-color-tertiary-fixed-dim : light-dark(#e8b9d4, #e8b9d4);
|
|
55
|
+
--md-sys-color-on-tertiary-fixed : light-dark(#2e1125, #2e1125);
|
|
56
|
+
--md-sys-color-on-tertiary-fixed-variant : light-dark(#5f3c52, #5f3c52);
|
|
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(#777777, #777777);
|
|
4
|
+
--md-sys-color-secondary-palette-key-color : light-dark(#777777, #777777);
|
|
5
|
+
--md-sys-color-tertiary-palette-key-color : light-dark(#777777, #777777);
|
|
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, #f9f9f9);
|
|
9
|
+
--md-sys-color-on-background : light-dark(#1b1b1b, #1b1b1b);
|
|
10
|
+
--md-sys-color-surface : light-dark(#f9f9f9, #f9f9f9);
|
|
11
|
+
--md-sys-color-surface-dim : light-dark(#b9b9b9, #b9b9b9);
|
|
12
|
+
--md-sys-color-surface-bright : light-dark(#f9f9f9, #f9f9f9);
|
|
13
|
+
--md-sys-color-surface-container-lowest : light-dark(#ffffff, #ffffff);
|
|
14
|
+
--md-sys-color-surface-container-low : light-dark(#f1f1f1, #f1f1f1);
|
|
15
|
+
--md-sys-color-surface-container : light-dark(#e2e2e2, #e2e2e2);
|
|
16
|
+
--md-sys-color-surface-container-high : light-dark(#d4d4d4, #d4d4d4);
|
|
17
|
+
--md-sys-color-surface-container-highest : light-dark(#c6c6c6, #c6c6c6);
|
|
18
|
+
--md-sys-color-on-surface : light-dark(#000000, #000000);
|
|
19
|
+
--md-sys-color-surface-variant : light-dark(#e2e2e2, #e2e2e2);
|
|
20
|
+
--md-sys-color-on-surface-variant : light-dark(#000000, #000000);
|
|
21
|
+
--md-sys-color-inverse-surface : light-dark(#303030, #303030);
|
|
22
|
+
--md-sys-color-inverse-on-surface : light-dark(#ffffff, #ffffff);
|
|
23
|
+
--md-sys-color-outline : light-dark(#2c2c2c, #2c2c2c);
|
|
24
|
+
--md-sys-color-outline-variant : light-dark(#494949, #494949);
|
|
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(#5e5e5e, #5e5e5e);
|
|
28
|
+
--md-sys-color-primary : light-dark(#000000, #000000);
|
|
29
|
+
--md-sys-color-on-primary : light-dark(#ffffff, #ffffff);
|
|
30
|
+
--md-sys-color-primary-container : light-dark(#3b3b3b, #3b3b3b);
|
|
31
|
+
--md-sys-color-on-primary-container : light-dark(#ffffff, #ffffff);
|
|
32
|
+
--md-sys-color-inverse-primary : light-dark(#c6c6c6, #c6c6c6);
|
|
33
|
+
--md-sys-color-secondary : light-dark(#2c2c2c, #2c2c2c);
|
|
34
|
+
--md-sys-color-on-secondary : light-dark(#ffffff, #ffffff);
|
|
35
|
+
--md-sys-color-secondary-container : light-dark(#494949, #494949);
|
|
36
|
+
--md-sys-color-on-secondary-container : light-dark(#ffffff, #ffffff);
|
|
37
|
+
--md-sys-color-tertiary : light-dark(#2c2c2c, #2c2c2c);
|
|
38
|
+
--md-sys-color-on-tertiary : light-dark(#ffffff, #ffffff);
|
|
39
|
+
--md-sys-color-tertiary-container : light-dark(#494949, #494949);
|
|
40
|
+
--md-sys-color-on-tertiary-container : light-dark(#ffffff, #ffffff);
|
|
41
|
+
--md-sys-color-error : light-dark(#600004, #600004);
|
|
42
|
+
--md-sys-color-on-error : light-dark(#ffffff, #ffffff);
|
|
43
|
+
--md-sys-color-error-container : light-dark(#98000a, #98000a);
|
|
44
|
+
--md-sys-color-on-error-container : light-dark(#ffffff, #ffffff);
|
|
45
|
+
--md-sys-color-primary-fixed : light-dark(#494949, #494949);
|
|
46
|
+
--md-sys-color-primary-fixed-dim : light-dark(#333333, #333333);
|
|
47
|
+
--md-sys-color-on-primary-fixed : light-dark(#ffffff, #ffffff);
|
|
48
|
+
--md-sys-color-on-primary-fixed-variant : light-dark(#ffffff, #ffffff);
|
|
49
|
+
--md-sys-color-secondary-fixed : light-dark(#494949, #494949);
|
|
50
|
+
--md-sys-color-secondary-fixed-dim : light-dark(#333333, #333333);
|
|
51
|
+
--md-sys-color-on-secondary-fixed : light-dark(#ffffff, #ffffff);
|
|
52
|
+
--md-sys-color-on-secondary-fixed-variant : light-dark(#ffffff, #ffffff);
|
|
53
|
+
--md-sys-color-tertiary-fixed : light-dark(#494949, #494949);
|
|
54
|
+
--md-sys-color-tertiary-fixed-dim : light-dark(#333333, #333333);
|
|
55
|
+
--md-sys-color-on-tertiary-fixed : light-dark(#ffffff, #ffffff);
|
|
56
|
+
--md-sys-color-on-tertiary-fixed-variant : light-dark(#ffffff, #ffffff);
|
|
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(#777777, #777777);
|
|
4
|
+
--md-sys-color-secondary-palette-key-color : light-dark(#777777, #777777);
|
|
5
|
+
--md-sys-color-tertiary-palette-key-color : light-dark(#777777, #777777);
|
|
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, #f9f9f9);
|
|
9
|
+
--md-sys-color-on-background : light-dark(#909090, #909090);
|
|
10
|
+
--md-sys-color-surface : light-dark(#f9f9f9, #f9f9f9);
|
|
11
|
+
--md-sys-color-surface-dim : light-dark(#dadada, #dadada);
|
|
12
|
+
--md-sys-color-surface-bright : light-dark(#f9f9f9, #f9f9f9);
|
|
13
|
+
--md-sys-color-surface-container-lowest : light-dark(#ffffff, #ffffff);
|
|
14
|
+
--md-sys-color-surface-container-low : light-dark(#f3f3f3, #f3f3f3);
|
|
15
|
+
--md-sys-color-surface-container : light-dark(#eeeeee, #eeeeee);
|
|
16
|
+
--md-sys-color-surface-container-high : light-dark(#e8e8e8, #e8e8e8);
|
|
17
|
+
--md-sys-color-surface-container-highest : light-dark(#e2e2e2, #e2e2e2);
|
|
18
|
+
--md-sys-color-on-surface : light-dark(#5f5f5f, #5f5f5f);
|
|
19
|
+
--md-sys-color-surface-variant : light-dark(#e2e2e2, #e2e2e2);
|
|
20
|
+
--md-sys-color-on-surface-variant : light-dark(#7b7b7b, #7b7b7b);
|
|
21
|
+
--md-sys-color-inverse-surface : light-dark(#303030, #303030);
|
|
22
|
+
--md-sys-color-inverse-on-surface : light-dark(#989898, #989898);
|
|
23
|
+
--md-sys-color-outline : light-dark(#b2b2b2, #b2b2b2);
|
|
24
|
+
--md-sys-color-outline-variant : light-dark(#d9d9d9, #d9d9d9);
|
|
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(#5e5e5e, #5e5e5e);
|
|
28
|
+
--md-sys-color-primary : light-dark(#747474, #747474);
|
|
29
|
+
--md-sys-color-on-primary : light-dark(#fcfcfc, #fcfcfc);
|
|
30
|
+
--md-sys-color-primary-container : light-dark(#d9d9d9, #d9d9d9);
|
|
31
|
+
--md-sys-color-on-primary-container : light-dark(#7a7a7a, #7a7a7a);
|
|
32
|
+
--md-sys-color-inverse-primary : light-dark(#7a7a7a, #7a7a7a);
|
|
33
|
+
--md-sys-color-secondary : light-dark(#747474, #747474);
|
|
34
|
+
--md-sys-color-on-secondary : light-dark(#fcfcfc, #fcfcfc);
|
|
35
|
+
--md-sys-color-secondary-container : light-dark(#d9d9d9, #d9d9d9);
|
|
36
|
+
--md-sys-color-on-secondary-container : light-dark(#7a7a7a, #7a7a7a);
|
|
37
|
+
--md-sys-color-tertiary : light-dark(#747474, #747474);
|
|
38
|
+
--md-sys-color-on-tertiary : light-dark(#fcfcfc, #fcfcfc);
|
|
39
|
+
--md-sys-color-tertiary-container : light-dark(#d9d9d9, #d9d9d9);
|
|
40
|
+
--md-sys-color-on-tertiary-container : light-dark(#7a7a7a, #7a7a7a);
|
|
41
|
+
--md-sys-color-error : light-dark(#da342e, #da342e);
|
|
42
|
+
--md-sys-color-on-error : light-dark(#fffbff, #fffbff);
|
|
43
|
+
--md-sys-color-error-container : light-dark(#ffcdc7, #ffcdc7);
|
|
44
|
+
--md-sys-color-on-error-container : light-dark(#e23a32, #e23a32);
|
|
45
|
+
--md-sys-color-primary-fixed : light-dark(#d9d9d9, #d9d9d9);
|
|
46
|
+
--md-sys-color-primary-fixed-dim : light-dark(#bdbdbd, #bdbdbd);
|
|
47
|
+
--md-sys-color-on-primary-fixed : light-dark(#4c4c4c, #4c4c4c);
|
|
48
|
+
--md-sys-color-on-primary-fixed-variant : light-dark(#666666, #666666);
|
|
49
|
+
--md-sys-color-secondary-fixed : light-dark(#d9d9d9, #d9d9d9);
|
|
50
|
+
--md-sys-color-secondary-fixed-dim : light-dark(#bdbdbd, #bdbdbd);
|
|
51
|
+
--md-sys-color-on-secondary-fixed : light-dark(#4c4c4c, #4c4c4c);
|
|
52
|
+
--md-sys-color-on-secondary-fixed-variant : light-dark(#666666, #666666);
|
|
53
|
+
--md-sys-color-tertiary-fixed : light-dark(#d9d9d9, #d9d9d9);
|
|
54
|
+
--md-sys-color-tertiary-fixed-dim : light-dark(#bdbdbd, #bdbdbd);
|
|
55
|
+
--md-sys-color-on-tertiary-fixed : light-dark(#4c4c4c, #4c4c4c);
|
|
56
|
+
--md-sys-color-on-tertiary-fixed-variant : light-dark(#666666, #666666);
|
|
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(#777777, #777777);
|
|
4
|
+
--md-sys-color-secondary-palette-key-color : light-dark(#777777, #777777);
|
|
5
|
+
--md-sys-color-tertiary-palette-key-color : light-dark(#777777, #777777);
|
|
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, #f9f9f9);
|
|
9
|
+
--md-sys-color-on-background : light-dark(#1b1b1b, #1b1b1b);
|
|
10
|
+
--md-sys-color-surface : light-dark(#f9f9f9, #f9f9f9);
|
|
11
|
+
--md-sys-color-surface-dim : light-dark(#dadada, #dadada);
|
|
12
|
+
--md-sys-color-surface-bright : light-dark(#f9f9f9, #f9f9f9);
|
|
13
|
+
--md-sys-color-surface-container-lowest : light-dark(#ffffff, #ffffff);
|
|
14
|
+
--md-sys-color-surface-container-low : light-dark(#f3f3f3, #f3f3f3);
|
|
15
|
+
--md-sys-color-surface-container : light-dark(#eeeeee, #eeeeee);
|
|
16
|
+
--md-sys-color-surface-container-high : light-dark(#e8e8e8, #e8e8e8);
|
|
17
|
+
--md-sys-color-surface-container-highest : light-dark(#e2e2e2, #e2e2e2);
|
|
18
|
+
--md-sys-color-on-surface : light-dark(#1b1b1b, #1b1b1b);
|
|
19
|
+
--md-sys-color-surface-variant : light-dark(#e2e2e2, #e2e2e2);
|
|
20
|
+
--md-sys-color-on-surface-variant : light-dark(#474747, #474747);
|
|
21
|
+
--md-sys-color-inverse-surface : light-dark(#303030, #303030);
|
|
22
|
+
--md-sys-color-inverse-on-surface : light-dark(#f1f1f1, #f1f1f1);
|
|
23
|
+
--md-sys-color-outline : light-dark(#777777, #777777);
|
|
24
|
+
--md-sys-color-outline-variant : light-dark(#c6c6c6, #c6c6c6);
|
|
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(#5e5e5e, #5e5e5e);
|
|
28
|
+
--md-sys-color-primary : light-dark(#000000, #000000);
|
|
29
|
+
--md-sys-color-on-primary : light-dark(#e2e2e2, #e2e2e2);
|
|
30
|
+
--md-sys-color-primary-container : light-dark(#3b3b3b, #3b3b3b);
|
|
31
|
+
--md-sys-color-on-primary-container : light-dark(#ffffff, #ffffff);
|
|
32
|
+
--md-sys-color-inverse-primary : light-dark(#c6c6c6, #c6c6c6);
|
|
33
|
+
--md-sys-color-secondary : light-dark(#5e5e5e, #5e5e5e);
|
|
34
|
+
--md-sys-color-on-secondary : light-dark(#ffffff, #ffffff);
|
|
35
|
+
--md-sys-color-secondary-container : light-dark(#d4d4d4, #d4d4d4);
|
|
36
|
+
--md-sys-color-on-secondary-container : light-dark(#1b1b1b, #1b1b1b);
|
|
37
|
+
--md-sys-color-tertiary : light-dark(#3b3b3b, #3b3b3b);
|
|
38
|
+
--md-sys-color-on-tertiary : light-dark(#e2e2e2, #e2e2e2);
|
|
39
|
+
--md-sys-color-tertiary-container : light-dark(#747474, #747474);
|
|
40
|
+
--md-sys-color-on-tertiary-container : light-dark(#ffffff, #ffffff);
|
|
41
|
+
--md-sys-color-error : light-dark(#ba1a1a, #ba1a1a);
|
|
42
|
+
--md-sys-color-on-error : light-dark(#ffffff, #ffffff);
|
|
43
|
+
--md-sys-color-error-container : light-dark(#ffdad6, #ffdad6);
|
|
44
|
+
--md-sys-color-on-error-container : light-dark(#410002, #410002);
|
|
45
|
+
--md-sys-color-primary-fixed : light-dark(#5e5e5e, #5e5e5e);
|
|
46
|
+
--md-sys-color-primary-fixed-dim : light-dark(#474747, #474747);
|
|
47
|
+
--md-sys-color-on-primary-fixed : light-dark(#ffffff, #ffffff);
|
|
48
|
+
--md-sys-color-on-primary-fixed-variant : light-dark(#e2e2e2, #e2e2e2);
|
|
49
|
+
--md-sys-color-secondary-fixed : light-dark(#c6c6c6, #c6c6c6);
|
|
50
|
+
--md-sys-color-secondary-fixed-dim : light-dark(#ababab, #ababab);
|
|
51
|
+
--md-sys-color-on-secondary-fixed : light-dark(#1b1b1b, #1b1b1b);
|
|
52
|
+
--md-sys-color-on-secondary-fixed-variant : light-dark(#3b3b3b, #3b3b3b);
|
|
53
|
+
--md-sys-color-tertiary-fixed : light-dark(#5e5e5e, #5e5e5e);
|
|
54
|
+
--md-sys-color-tertiary-fixed-dim : light-dark(#474747, #474747);
|
|
55
|
+
--md-sys-color-on-tertiary-fixed : light-dark(#ffffff, #ffffff);
|
|
56
|
+
--md-sys-color-on-tertiary-fixed-variant : light-dark(#e2e2e2, #e2e2e2);
|
|
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(#fc9500, #fc9500);
|
|
4
|
+
--md-sys-color-secondary-palette-key-color : light-dark(#927146, #927146);
|
|
5
|
+
--md-sys-color-tertiary-palette-key-color : light-dark(#927231, #927231);
|
|
6
|
+
--md-sys-color-neutral-palette-key-color : light-dark(#867465, #867465);
|
|
7
|
+
--md-sys-color-neutral-variant-palette-key-color: light-dark(#887361, #887361);
|
|
8
|
+
--md-sys-color-background : light-dark(#fff8f5, #fff8f5);
|
|
9
|
+
--md-sys-color-on-background : light-dark(#25190e, #25190e);
|
|
10
|
+
--md-sys-color-surface : light-dark(#fff8f5, #fff8f5);
|
|
11
|
+
--md-sys-color-surface-dim : light-dark(#edd6c4, #edd6c4);
|
|
12
|
+
--md-sys-color-surface-bright : light-dark(#fff8f5, #fff8f5);
|
|
13
|
+
--md-sys-color-surface-container-lowest : light-dark(#ffffff, #ffffff);
|
|
14
|
+
--md-sys-color-surface-container-low : light-dark(#fff1e7, #fff1e7);
|
|
15
|
+
--md-sys-color-surface-container : light-dark(#ffeada, #ffeada);
|
|
16
|
+
--md-sys-color-surface-container-high : light-dark(#fbe4d2, #fbe4d2);
|
|
17
|
+
--md-sys-color-surface-container-highest : light-dark(#f5decc, #f5decc);
|
|
18
|
+
--md-sys-color-on-surface : light-dark(#25190e, #25190e);
|
|
19
|
+
--md-sys-color-surface-variant : light-dark(#f9dec8, #f9dec8);
|
|
20
|
+
--md-sys-color-on-surface-variant : light-dark(#554333, #554333);
|
|
21
|
+
--md-sys-color-inverse-surface : light-dark(#3b2e22, #3b2e22);
|
|
22
|
+
--md-sys-color-inverse-on-surface : light-dark(#ffeee1, #ffeee1);
|
|
23
|
+
--md-sys-color-outline : light-dark(#887361, #887361);
|
|
24
|
+
--md-sys-color-outline-variant : light-dark(#dbc2ad, #dbc2ad);
|
|
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(#8b5000, #8b5000);
|
|
28
|
+
--md-sys-color-primary : light-dark(#8b5000, #8b5000);
|
|
29
|
+
--md-sys-color-on-primary : light-dark(#ffffff, #ffffff);
|
|
30
|
+
--md-sys-color-primary-container : light-dark(#ffdcbf, #ffdcbf);
|
|
31
|
+
--md-sys-color-on-primary-container : light-dark(#6a3b00, #6a3b00);
|
|
32
|
+
--md-sys-color-inverse-primary : light-dark(#ffb872, #ffb872);
|
|
33
|
+
--md-sys-color-secondary : light-dark(#775930, #775930);
|
|
34
|
+
--md-sys-color-on-secondary : light-dark(#ffffff, #ffffff);
|
|
35
|
+
--md-sys-color-secondary-container : light-dark(#ffddb4, #ffddb4);
|
|
36
|
+
--md-sys-color-on-secondary-container : light-dark(#5d421b, #5d421b);
|
|
37
|
+
--md-sys-color-tertiary : light-dark(#775a1a, #775a1a);
|
|
38
|
+
--md-sys-color-on-tertiary : light-dark(#ffffff, #ffffff);
|
|
39
|
+
--md-sys-color-tertiary-container : light-dark(#ffdea4, #ffdea4);
|
|
40
|
+
--md-sys-color-on-tertiary-container : light-dark(#5d4202, #5d4202);
|
|
41
|
+
--md-sys-color-error : light-dark(#ba1a1a, #ba1a1a);
|
|
42
|
+
--md-sys-color-on-error : light-dark(#ffffff, #ffffff);
|
|
43
|
+
--md-sys-color-error-container : light-dark(#ffdad6, #ffdad6);
|
|
44
|
+
--md-sys-color-on-error-container : light-dark(#93000a, #93000a);
|
|
45
|
+
--md-sys-color-primary-fixed : light-dark(#ffdcbf, #ffdcbf);
|
|
46
|
+
--md-sys-color-primary-fixed-dim : light-dark(#ffb872, #ffb872);
|
|
47
|
+
--md-sys-color-on-primary-fixed : light-dark(#2d1600, #2d1600);
|
|
48
|
+
--md-sys-color-on-primary-fixed-variant : light-dark(#6a3b00, #6a3b00);
|
|
49
|
+
--md-sys-color-secondary-fixed : light-dark(#ffddb4, #ffddb4);
|
|
50
|
+
--md-sys-color-secondary-fixed-dim : light-dark(#e8c08e, #e8c08e);
|
|
51
|
+
--md-sys-color-on-secondary-fixed : light-dark(#291800, #291800);
|
|
52
|
+
--md-sys-color-on-secondary-fixed-variant : light-dark(#5d421b, #5d421b);
|
|
53
|
+
--md-sys-color-tertiary-fixed : light-dark(#ffdea4, #ffdea4);
|
|
54
|
+
--md-sys-color-tertiary-fixed-dim : light-dark(#e8c177, #e8c177);
|
|
55
|
+
--md-sys-color-on-tertiary-fixed : light-dark(#261900, #261900);
|
|
56
|
+
--md-sys-color-on-tertiary-fixed-variant : light-dark(#5d4202, #5d4202);
|
|
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(#438460, #438460);
|
|
4
|
+
--md-sys-color-secondary-palette-key-color : light-dark(#667c6d, #667c6d);
|
|
5
|
+
--md-sys-color-tertiary-palette-key-color : light-dark(#557d8b, #557d8b);
|
|
6
|
+
--md-sys-color-neutral-palette-key-color : light-dark(#727873, #727873);
|
|
7
|
+
--md-sys-color-neutral-variant-palette-key-color: light-dark(#707972, #707972);
|
|
8
|
+
--md-sys-color-background : light-dark(#f6fbf4, #f6fbf4);
|
|
9
|
+
--md-sys-color-on-background : light-dark(#171d19, #171d19);
|
|
10
|
+
--md-sys-color-surface : light-dark(#f6fbf4, #f6fbf4);
|
|
11
|
+
--md-sys-color-surface-dim : light-dark(#d6dbd5, #d6dbd5);
|
|
12
|
+
--md-sys-color-surface-bright : light-dark(#f6fbf4, #f6fbf4);
|
|
13
|
+
--md-sys-color-surface-container-lowest : light-dark(#ffffff, #ffffff);
|
|
14
|
+
--md-sys-color-surface-container-low : light-dark(#f0f5ee, #f0f5ee);
|
|
15
|
+
--md-sys-color-surface-container : light-dark(#eaefe9, #eaefe9);
|
|
16
|
+
--md-sys-color-surface-container-high : light-dark(#e4eae3, #e4eae3);
|
|
17
|
+
--md-sys-color-surface-container-highest : light-dark(#dfe4dd, #dfe4dd);
|
|
18
|
+
--md-sys-color-on-surface : light-dark(#171d19, #171d19);
|
|
19
|
+
--md-sys-color-surface-variant : light-dark(#dce5dc, #dce5dc);
|
|
20
|
+
--md-sys-color-on-surface-variant : light-dark(#404942, #404942);
|
|
21
|
+
--md-sys-color-inverse-surface : light-dark(#2c322d, #2c322d);
|
|
22
|
+
--md-sys-color-inverse-on-surface : light-dark(#edf2eb, #edf2eb);
|
|
23
|
+
--md-sys-color-outline : light-dark(#717972, #717972);
|
|
24
|
+
--md-sys-color-outline-variant : light-dark(#c0c9c0, #c0c9c0);
|
|
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(#286a48, #286a48);
|
|
28
|
+
--md-sys-color-primary : light-dark(#286a48, #286a48);
|
|
29
|
+
--md-sys-color-on-primary : light-dark(#ffffff, #ffffff);
|
|
30
|
+
--md-sys-color-primary-container : light-dark(#adf2c7, #adf2c7);
|
|
31
|
+
--md-sys-color-on-primary-container : light-dark(#065232, #065232);
|
|
32
|
+
--md-sys-color-inverse-primary : light-dark(#92d5ac, #92d5ac);
|
|
33
|
+
--md-sys-color-secondary : light-dark(#4e6355, #4e6355);
|
|
34
|
+
--md-sys-color-on-secondary : light-dark(#ffffff, #ffffff);
|
|
35
|
+
--md-sys-color-secondary-container : light-dark(#d1e8d6, #d1e8d6);
|
|
36
|
+
--md-sys-color-on-secondary-container : light-dark(#374b3e, #374b3e);
|
|
37
|
+
--md-sys-color-tertiary : light-dark(#3b6471, #3b6471);
|
|
38
|
+
--md-sys-color-on-tertiary : light-dark(#ffffff, #ffffff);
|
|
39
|
+
--md-sys-color-tertiary-container : light-dark(#bfe9f9, #bfe9f9);
|
|
40
|
+
--md-sys-color-on-tertiary-container : light-dark(#224c59, #224c59);
|
|
41
|
+
--md-sys-color-error : light-dark(#ba1a1a, #ba1a1a);
|
|
42
|
+
--md-sys-color-on-error : light-dark(#ffffff, #ffffff);
|
|
43
|
+
--md-sys-color-error-container : light-dark(#ffdad6, #ffdad6);
|
|
44
|
+
--md-sys-color-on-error-container : light-dark(#93000a, #93000a);
|
|
45
|
+
--md-sys-color-primary-fixed : light-dark(#adf2c7, #adf2c7);
|
|
46
|
+
--md-sys-color-primary-fixed-dim : light-dark(#92d5ac, #92d5ac);
|
|
47
|
+
--md-sys-color-on-primary-fixed : light-dark(#002111, #002111);
|
|
48
|
+
--md-sys-color-on-primary-fixed-variant : light-dark(#065232, #065232);
|
|
49
|
+
--md-sys-color-secondary-fixed : light-dark(#d1e8d6, #d1e8d6);
|
|
50
|
+
--md-sys-color-secondary-fixed-dim : light-dark(#b5ccbb, #b5ccbb);
|
|
51
|
+
--md-sys-color-on-secondary-fixed : light-dark(#0b1f14, #0b1f14);
|
|
52
|
+
--md-sys-color-on-secondary-fixed-variant : light-dark(#374b3e, #374b3e);
|
|
53
|
+
--md-sys-color-tertiary-fixed : light-dark(#bfe9f9, #bfe9f9);
|
|
54
|
+
--md-sys-color-tertiary-fixed-dim : light-dark(#a3cddc, #a3cddc);
|
|
55
|
+
--md-sys-color-on-tertiary-fixed : light-dark(#001f27, #001f27);
|
|
56
|
+
--md-sys-color-on-tertiary-fixed-variant : light-dark(#224c59, #224c59);
|
|
57
|
+
}
|
|
58
|
+
}
|