summaryrefslogtreecommitdiffstats
path: root/src/scopes/_implicit.scss
diff options
context:
space:
mode:
Diffstat (limited to 'src/scopes/_implicit.scss')
-rw-r--r--src/scopes/_implicit.scss269
1 files changed, 145 insertions, 124 deletions
diff --git a/src/scopes/_implicit.scss b/src/scopes/_implicit.scss
index 020e311..cee1639 100644
--- a/src/scopes/_implicit.scss
+++ b/src/scopes/_implicit.scss
@@ -1,5 +1,7 @@
1@use 'sass:map';
1@use 'sass:math'; 2@use 'sass:math';
2@use 'sass:meta'; 3@use 'sass:meta';
4@use 'sass:string';
3@use 'iro-sass/src/bem'; 5@use 'iro-sass/src/bem';
4@use 'iro-sass/src/props'; 6@use 'iro-sass/src/props';
5@use '../props' as *; 7@use '../props' as *;
@@ -9,151 +11,170 @@
9@use 'implicit.vars' as vars; 11@use 'implicit.vars' as vars;
10 12
11@mixin styles { 13@mixin styles {
12 @include materialize-at-root(meta.module-variables('vars')); 14 @include materialize-at-root(meta.module-variables('vars'));
13 15
14 @layer scope { 16 @layer scope {
15 html { 17 html {
16 accent-color: props.get(core.$theme, --accent, --600); 18 accent-color: props.get(core.$theme, --accent, --600);
17 scrollbar-color: props.get(core.$theme, --text-disabled) transparent; 19 scrollbar-color: props.get(core.$theme, --text-disabled) transparent;
18 } 20 }
19 21
20 body { 22 body {
21 padding: 0; 23 padding: 0;
22 margin: 0; 24 margin: 0;
23 font-family: props.get(vars.$body--font-family); 25 font-family: props.get(vars.$body--font-family);
24 font-size: props.get(vars.$body--font-size); 26 font-size: props.get(vars.$body--font-size);
25 font-feature-settings: props.get(vars.$body--feature-settings); 27 font-feature-settings: props.get(vars.$body--feature-settings);
26 line-height: props.get(vars.$body--line-height); 28 line-height: props.get(vars.$body--line-height);
27 color: props.get(core.$theme, --text); 29 color: props.get(core.$theme, --text);
28 background-color: props.get(core.$theme, --bg-base); 30 background-color: props.get(core.$theme, --bg-base);
29 } 31 }
30 32
31 pre, 33 pre,
32 code { 34 code {
33 font-family: props.get(vars.$code--font-family); 35 font-family: props.get(vars.$code--font-family);
34 font-size: props.get(vars.$code--font-size); 36 font-size: props.get(vars.$code--font-size);
35 font-feature-settings: props.get(vars.$code--feature-settings); 37 font-feature-settings: props.get(vars.$code--feature-settings);
36 line-height: props.get(vars.$code--line-height); 38 line-height: props.get(vars.$code--line-height);
37 } 39 }
38 40
39 pre { 41 pre {
40 margin: 0; 42 margin: 0;
41 overflow-x: auto; 43 overflow-x: auto;
42 44
43 code { 45 code {
44 font-size: 1em; 46 font-size: 1em;
45 color: currentColor; 47 color: currentColor;
46 } 48 }
47 } 49 }
48 50
49 h1, 51 h1,
50 h2, 52 h2,
51 h3, 53 h3,
52 h4, 54 h4,
53 h5, 55 h5,
54 h6 { 56 h6 {
55 margin-block: props.get(vars.$heading--margin-bs) 0; 57 margin-block: props.get(vars.$heading--margin-bs) 0;
56 font-family: props.get(vars.$heading--font-family); 58 font-family: props.get(vars.$heading--font-family);
57 font-size: props.get(vars.$heading--font-size); 59 font-size: props.get(vars.$heading--font-size);
58 font-weight: props.get(vars.$heading--font-weight); 60 font-weight: props.get(vars.$heading--font-weight);
59 font-feature-settings: props.get(vars.$heading--feature-settings); 61 font-feature-settings: props.get(vars.$heading--feature-settings);
60 line-height: props.get(vars.$heading--line-height); 62 line-height: props.get(vars.$heading--line-height);
61 color: props.get(vars.$heading--color); 63 color: props.get(vars.$heading--color);
62 64
63 & + & { 65 & + & {
64 margin-block-start: props.get(vars.$heading--margin-bs-sibling); 66 margin-block-start: props.get(vars.$heading--margin-bs-sibling);
65 } 67 }
66 } 68 }
67 69
68 p { 70 p {
69 margin-block: props.get(vars.$paragraph--margin-bs) 0; 71 margin-block: props.get(vars.$paragraph--margin-bs) 0;
70 72
71 &:empty { 73 &:empty {
72 display: none; 74 display: none;
73 } 75 }
74 } 76 }
75 77
76 strong { 78 strong {
77 font-weight: bold; 79 font-weight: bold;
78 } 80 }
79 81
80 small { 82 small {
81 font-size: props.get(vars.$small--font-size); 83 font-size: props.get(vars.$small--font-size);
82 } 84 }
83 85
84 ul, 86 ul,
85 ol { 87 ol {
86 padding: 0; 88 padding: 0;
87 margin: 0; 89 margin: 0;
88 list-style: none; 90 list-style: none;
89 } 91 }
90 92
91 li { 93 li {
92 padding: 0; 94 padding: 0;
93 margin: 0; 95 margin: 0;
94 } 96 }
95 97
96 :focus, 98 :focus,
97 :focus-visible { 99 :focus-visible {
98 outline: 0; 100 outline: 0;
99 } 101 }
100 102
101 :link, 103 :link,
102 :visited { 104 :visited {
103 color: currentColor; 105 color: currentColor;
104 text-decoration: none; 106 text-decoration: none;
105 } 107 }
106 108
107 109
108 button, 110 button,
109 input, 111 input,
110 textarea { 112 textarea {
111 box-sizing: content-box; 113 box-sizing: content-box;
112 padding: 0; 114 padding: 0;
113 margin: 0; 115 margin: 0;
114 font-family: inherit; 116 font-family: inherit;
115 font-size: 1em; 117 font-size: 1em;
116 font-style: inherit; 118 font-style: inherit;
117 font-weight: inherit; 119 font-weight: inherit;
118 line-height: inherit; 120 line-height: inherit;
119 color: currentColor; 121 color: currentColor;
120 text-align: inherit; 122 text-align: inherit;
121 text-transform: inherit; 123 text-transform: inherit;
122 appearance: none; 124 appearance: none;
123 background: none; 125 background: none;
124 border: 0; 126 border: 0;
125 127
126 &::-moz-focus-inner { 128 &::-moz-focus-inner {
127 border: 0; 129 border: 0;
128 } 130 }
129 } 131 }
130 132
131 input, 133 input,
132 textarea { 134 textarea {
133 &::placeholder { 135 &::placeholder {
134 color: props.get(core.$theme, --text-mute); 136 color: props.get(core.$theme, --text-mute);
135 opacity: 1; 137 opacity: 1;
136 } 138 }
137 139
138 &:disabled { 140 &:disabled {
139 color: props.get(core.$theme, --text-disabled); 141 color: props.get(core.$theme, --text-disabled);
140 } 142 }
141 } 143 }
142 144
143 textarea { 145 textarea {
144 block-size: calc(1em * props.get(core.$font--standard--line-height)); 146 block-size: calc(1em * props.get(core.$font--standard--line-height));
145 } 147 }
146 148
147 hr { 149 hr {
148 block-size: props.get(core.$border-width--thin); 150 block-size: props.get(core.$border-width--thin);
149 margin: 0; 151 margin: 0;
150 background-color: props.get(core.$theme, --border); 152 background-color: props.get(core.$theme, --border);
151 border: 0; 153 border: 0;
152 } 154 }
153 155
154 figure { 156 figure {
155 padding: 0; 157 padding: 0;
156 margin: 0; 158 margin: 0;
157 } 159 }
158 } 160
161 @each $theme in map.keys(props.get(core.$transparent-colors)) {
162 .t-static-#{string.slice($theme, 3)} {
163 color: props.get(core.$transparent-colors, $theme, --800);
164
165 h1,
166 h2,
167 h3,
168 h4,
169 h5,
170 h6 {
171 color: props.get(core.$transparent-colors, $theme, --900);
172 }
173
174 hr {
175 color: props.get(core.$transparent-colors, $theme, --400);
176 }
177 }
178 }
179 }
159} 180}
generated by cgit v1.2.3-70-g09d2 (git 2.50.0) at 2025-09-14 01:52:21 +0000