summaryrefslogtreecommitdiffstats
path: root/src/scopes/_implicit.scss
diff options
context:
space:
mode:
authorVolpeon <git@volpeon.ink>2026-07-22 12:27:09 +0200
committerVolpeon <git@volpeon.ink>2026-07-22 12:27:09 +0200
commitcc5329a5f4d3ea91cac93bc7f9b8f943b7ced226 (patch)
treed16dea8f0a5edca2b610ecabeac5e93a4d98be2f /src/scopes/_implicit.scss
parentUpdate _index.scss (diff)
downloadiro-design-cc5329a5f4d3ea91cac93bc7f9b8f943b7ced226.tar.gz
iro-design-cc5329a5f4d3ea91cac93bc7f9b8f943b7ced226.tar.bz2
iro-design-cc5329a5f4d3ea91cac93bc7f9b8f943b7ced226.zip
Paths
Diffstat (limited to 'src/scopes/_implicit.scss')
-rw-r--r--src/scopes/_implicit.scss105
1 files changed, 52 insertions, 53 deletions
diff --git a/src/scopes/_implicit.scss b/src/scopes/_implicit.scss
index 728fd22..f8c575d 100644
--- a/src/scopes/_implicit.scss
+++ b/src/scopes/_implicit.scss
@@ -1,21 +1,21 @@
1@use 'sass:map'; 1@use "sass:map";
2@use 'sass:math'; 2@use "sass:math";
3@use 'sass:meta'; 3@use "sass:meta";
4@use 'sass:string'; 4@use "sass:string";
5@use 'pkg:iro-sass/src/bem'; 5@use "pkg:iro-sass/bem";
6@use 'pkg:iro-sass/src/props'; 6@use "pkg:iro-sass/props";
7@use '../props' as *; 7@use "../props" as *;
8@use '../core.vars' as core; 8@use "../core.vars" as core;
9 9
10@forward 'implicit.vars'; 10@forward "implicit.vars";
11@use 'implicit.vars' as vars; 11@use "implicit.vars" as vars;
12 12
13@mixin styles { 13@mixin styles {
14 @include materialize-at-root(meta.module-variables('vars')); 14 @include materialize-at-root(meta.module-variables("vars"));
15 15
16 @layer scope { 16 @layer scope {
17 html { 17 html {
18 accent-color: props.get(core.$theme, --accent, --600); 18 accent-color: props.get(core.$theme, --accent, --600);
19 scrollbar-color: props.get(core.$theme, --text-disabled) transparent; 19 scrollbar-color: props.get(core.$theme, --text-disabled) transparent;
20 20
21 &:has(dialog[open]), 21 &:has(dialog[open]),
@@ -26,31 +26,31 @@
26 } 26 }
27 27
28 body { 28 body {
29 padding: 0; 29 padding: 0;
30 margin: 0; 30 margin: 0;
31 font-family: props.get(vars.$body--font-family); 31 font-family: props.get(vars.$body--font-family);
32 font-size: props.get(vars.$body--font-size); 32 font-size: props.get(vars.$body--font-size);
33 font-feature-settings: props.get(vars.$body--feature-settings); 33 font-feature-settings: props.get(vars.$body--feature-settings);
34 line-height: props.get(vars.$body--line-height); 34 line-height: props.get(vars.$body--line-height);
35 color: props.get(core.$theme, --text); 35 color: props.get(core.$theme, --text);
36 background-color: props.get(core.$theme, --bg-base); 36 background-color: props.get(core.$theme, --bg-base);
37 } 37 }
38 38
39 pre, 39 pre,
40 code { 40 code {
41 font-family: props.get(vars.$code--font-family); 41 font-family: props.get(vars.$code--font-family);
42 font-size: props.get(vars.$code--font-size); 42 font-size: props.get(vars.$code--font-size);
43 font-feature-settings: props.get(vars.$code--feature-settings); 43 font-feature-settings: props.get(vars.$code--feature-settings);
44 line-height: props.get(vars.$code--line-height); 44 line-height: props.get(vars.$code--line-height);
45 } 45 }
46 46
47 pre { 47 pre {
48 margin: 0; 48 margin: 0;
49 overflow-x: auto; 49 overflow-x: auto;
50 50
51 code { 51 code {
52 font-size: 1em; 52 font-size: 1em;
53 color: currentColor; 53 color: currentColor;
54 } 54 }
55 } 55 }
56 56
@@ -60,13 +60,13 @@
60 h4, 60 h4,
61 h5, 61 h5,
62 h6 { 62 h6 {
63 margin-block: props.get(vars.$heading--margin-bs) 0; 63 margin-block: props.get(vars.$heading--margin-bs) 0;
64 font-family: props.get(vars.$heading--font-family); 64 font-family: props.get(vars.$heading--font-family);
65 font-size: props.get(vars.$heading--font-size); 65 font-size: props.get(vars.$heading--font-size);
66 font-weight: props.get(vars.$heading--font-weight); 66 font-weight: props.get(vars.$heading--font-weight);
67 font-feature-settings: props.get(vars.$heading--feature-settings); 67 font-feature-settings: props.get(vars.$heading--feature-settings);
68 line-height: props.get(vars.$heading--line-height); 68 line-height: props.get(vars.$heading--line-height);
69 color: props.get(vars.$heading--color); 69 color: props.get(vars.$heading--color);
70 70
71 & + & { 71 & + & {
72 margin-block-start: props.get(vars.$heading--margin-bs-sibling); 72 margin-block-start: props.get(vars.$heading--margin-bs-sibling);
@@ -91,14 +91,14 @@
91 91
92 ul, 92 ul,
93 ol { 93 ol {
94 padding: 0; 94 padding: 0;
95 margin: 0; 95 margin: 0;
96 list-style: none; 96 list-style: none;
97 } 97 }
98 98
99 li { 99 li {
100 padding: 0; 100 padding: 0;
101 margin: 0; 101 margin: 0;
102 } 102 }
103 103
104 :focus, 104 :focus,
@@ -108,28 +108,27 @@
108 108
109 :link, 109 :link,
110 :visited { 110 :visited {
111 color: currentColor; 111 color: currentColor;
112 text-decoration: none; 112 text-decoration: none;
113 } 113 }
114 114
115
116 button, 115 button,
117 input, 116 input,
118 textarea { 117 textarea {
119 box-sizing: content-box; 118 box-sizing: content-box;
120 padding: 0; 119 padding: 0;
121 margin: 0; 120 margin: 0;
122 font-family: inherit; 121 font-family: inherit;
123 font-size: 1em; 122 font-size: 1em;
124 font-style: inherit; 123 font-style: inherit;
125 font-weight: inherit; 124 font-weight: inherit;
126 line-height: inherit; 125 line-height: inherit;
127 color: currentColor; 126 color: currentColor;
128 text-align: inherit; 127 text-align: inherit;
129 text-transform: inherit; 128 text-transform: inherit;
130 appearance: none; 129 appearance: none;
131 background: none; 130 background: none;
132 border: 0; 131 border: 0;
133 132
134 &::-moz-focus-inner { 133 &::-moz-focus-inner {
135 border: 0; 134 border: 0;
@@ -139,7 +138,7 @@
139 input, 138 input,
140 textarea { 139 textarea {
141 &::placeholder { 140 &::placeholder {
142 color: props.get(core.$theme, --text-mute); 141 color: props.get(core.$theme, --text-mute);
143 opacity: 1; 142 opacity: 1;
144 } 143 }
145 144
@@ -153,15 +152,15 @@
153 } 152 }
154 153
155 hr { 154 hr {
156 block-size: props.get(core.$border-width--thin); 155 block-size: props.get(core.$border-width--thin);
157 margin: 0; 156 margin: 0;
158 background-color: props.get(core.$theme, --border); 157 background-color: props.get(core.$theme, --border);
159 border: 0; 158 border: 0;
160 } 159 }
161 160
162 figure { 161 figure {
163 padding: 0; 162 padding: 0;
164 margin: 0; 163 margin: 0;
165 } 164 }
166 165
167 @each $theme in map.keys(props.get(core.$transparent-colors)) { 166 @each $theme in map.keys(props.get(core.$transparent-colors)) {