summaryrefslogtreecommitdiffstats
path: root/src/objects/_divider.vars.scss
diff options
context:
space:
mode:
authorVolpeon <git@volpeon.ink>2026-07-22 13:00:59 +0200
committerVolpeon <git@volpeon.ink>2026-07-22 13:00:59 +0200
commitaeed08dc46662a0d70e04bcea612a701633736e7 (patch)
treea4077017d3519185ccd9ea08955fccdd737ffe17 /src/objects/_divider.vars.scss
parentPaths (diff)
downloadiro-design-aeed08dc46662a0d70e04bcea612a701633736e7.tar.gz
iro-design-aeed08dc46662a0d70e04bcea612a701633736e7.tar.bz2
iro-design-aeed08dc46662a0d70e04bcea612a701633736e7.zip
Revert "Paths"
This reverts commit cc5329a5f4d3ea91cac93bc7f9b8f943b7ced226.
Diffstat (limited to 'src/objects/_divider.vars.scss')
-rw-r--r--src/objects/_divider.vars.scss179
1 files changed, 53 insertions, 126 deletions
diff --git a/src/objects/_divider.vars.scss b/src/objects/_divider.vars.scss
index 38224d4..a8b0f9f 100644
--- a/src/objects/_divider.vars.scss
+++ b/src/objects/_divider.vars.scss
@@ -1,153 +1,80 @@
1@use "sass:map"; 1@use 'sass:map';
2@use "sass:string"; 2@use 'sass:string';
3@use "pkg:iro-sass/props"; 3@use 'pkg:iro-sass/src/props';
4@use "../core.vars" as core; 4@use '../core.vars' as core;
5 5
6$margin-b: props.def(--o-divider--size, props.get(core.$size--85)) !default; 6$margin-b: props.def(--o-divider--size, props.get(core.$size--85)) !default;
7$vertical--border-width: props.def( 7$vertical--border-width: props.def(--o-divider--vertical--width, props.get(core.$border-width--thin)) !default;
8 --o-divider--vertical--width, 8$dot--size: props.def(--o-divider--dot--size, props.get(core.$size--50)) !default;
9 props.get(core.$border-width--thin) 9$letter-spacing: props.def(--o-divider--letter-spacing, 1px) !default;
10) !default;
11$dot--size: props.def(--o-divider--dot--size, props.get(core.$size--50)) !default;
12$letter-spacing: props.def(--o-divider--letter-spacing, 1px) !default;
13 10
14$strong--border-width: props.def( 11$strong--border-width: props.def(--o-divider--strong--border-width, props.get(core.$border-width--thick)) !default;
15 --o-divider--strong--border-width, 12$strong--label-font-size: props.def(--o-divider--strong--label-font-size, props.get(core.$font-size--100)) !default;
16 props.get(core.$border-width--thick)
17) !default;
18$strong--label-font-size: props.def(
19 --o-divider--strong--label-font-size,
20 props.get(core.$font-size--100)
21) !default;
22 13
23$medium--border-width: props.def( 14$medium--border-width: props.def(--o-divider--medium--border-width, props.get(core.$border-width--medium)) !default;
24 --o-divider--medium--border-width, 15$medium--label-font-size: props.def(--o-divider--medium--label-font-size, props.get(core.$font-size--75)) !default;
25 props.get(core.$border-width--medium)
26) !default;
27$medium--label-font-size: props.def(
28 --o-divider--medium--label-font-size,
29 props.get(core.$font-size--75)
30) !default;
31 16
32$quiet--border-width: props.def( 17$quiet--border-width: props.def(--o-divider--quiet--border-width, props.get(core.$border-width--thin)) !default;
33 --o-divider--quiet--border-width, 18$quiet--label-font-size: props.def(--o-divider--quiet--label-font-size, props.get(core.$font-size--50)) !default;
34 props.get(core.$border-width--thin)
35) !default;
36$quiet--label-font-size: props.def(
37 --o-divider--quiet--label-font-size,
38 props.get(core.$font-size--50)
39) !default;
40 19
41$faint--border-width: props.def( 20$faint--border-width: props.def(--o-divider--faint--border-width, props.get(core.$border-width--thin)) !default;
42 --o-divider--faint--border-width, 21$faint--label-font-size: props.def(--o-divider--faint--label-font-size, props.get(core.$font-size--50)) !default;
43 props.get(core.$border-width--thin)
44) !default;
45$faint--label-font-size: props.def(
46 --o-divider--faint--label-font-size,
47 props.get(core.$font-size--50)
48) !default;
49 22
50$strong--bg-color: props.def( 23$strong--bg-color: props.def(--o-divider--strong--bg-color, props.get(core.$theme, --text), 'color') !default;
51 --o-divider--strong--bg-color, 24$strong--label-color: props.def(--o-divider--strong--label-color, props.get(core.$theme, --text), 'color') !default;
52 props.get(core.$theme, --text),
53 "color"
54) !default;
55$strong--label-color: props.def(
56 --o-divider--strong--label-color,
57 props.get(core.$theme, --text),
58 "color"
59) !default;
60 25
61$medium--bg-color: props.def( 26$medium--bg-color: props.def(--o-divider--medium--bg-color, props.get(core.$theme, --border), 'color') !default;
62 --o-divider--medium--bg-color, 27$medium--label-color: props.def(--o-divider--medium--label-color, props.get(core.$theme, --text-mute), 'color') !default;
63 props.get(core.$theme, --border),
64 "color"
65) !default;
66$medium--label-color: props.def(
67 --o-divider--medium--label-color,
68 props.get(core.$theme, --text-mute),
69 "color"
70) !default;
71 28
72$quiet--bg-color: props.def( 29$quiet--bg-color: props.def(--o-divider--quiet--bg-color, props.get(core.$theme, --border), 'color') !default;
73 --o-divider--quiet--bg-color, 30$quiet--label-color: props.def(--o-divider--quiet--label-color, props.get(core.$theme, --text-mute-more), 'color') !default;
74 props.get(core.$theme, --border),
75 "color"
76) !default;
77$quiet--label-color: props.def(
78 --o-divider--quiet--label-color,
79 props.get(core.$theme, --text-mute-more),
80 "color"
81) !default;
82 31
83$faint--bg-color: props.def( 32$faint--bg-color: props.def(--o-divider--faint--bg-color, props.get(core.$theme, --border-mute), 'color') !default;
84 --o-divider--faint--bg-color, 33$faint--label-color: props.def(--o-divider--faint--label-color, props.get(core.$theme, --text-disabled), 'color') !default;
85 props.get(core.$theme, --border-mute),
86 "color"
87) !default;
88$faint--label-color: props.def(
89 --o-divider--faint--label-color,
90 props.get(core.$theme, --text-disabled),
91 "color"
92) !default;
93 34
94$vertical--quiet--bg-color: props.def( 35$vertical--quiet--bg-color: props.def(--o-divider--vertical--quiet--bg-color, props.get(core.$theme, --border-mute), 'color') !default;
95 --o-divider--vertical--quiet--bg-color,
96 props.get(core.$theme, --border-mute),
97 "color"
98) !default;
99 36
100$dot--quiet--bg-color: props.def( 37$dot--quiet--bg-color: props.def(--o-divider--dot--quiet--bg-color, props.get(core.$theme, --border-mute), 'color') !default;
101 --o-divider--dot--quiet--bg-color,
102 props.get(core.$theme, --border-mute),
103 "color"
104) !default;
105 38
106$static-themes: props.def(--o-divider, (), "color"); 39$static-themes: props.def(--o-divider, (), 'color');
107 40
108@each $theme in map.keys(props.get(core.$transparent-colors)) { 41@each $theme in map.keys(props.get(core.$transparent-colors)) {
109 $button-theme: --static-#{string.slice($theme, 3)}; 42 $button-theme: --static-#{string.slice($theme, 3)};
110 43
111 $static-themes: props.merge( 44 $static-themes: props.merge($static-themes, (
112 $static-themes, 45 $button-theme: (
113 ( 46 --strong: (
114 $button-theme: ( 47 --bg: props.get(core.$transparent-colors, $theme, --800),
115 --strong: ( 48 --label: props.get(core.$transparent-colors, $theme, --900),
116 --bg: props.get(core.$transparent-colors, $theme, --800), 49 ),
117 --label: props.get(core.$transparent-colors, $theme, --900), 50 --medium: (
118 ), 51 --bg: props.get(core.$transparent-colors, $theme, --300),
119 --medium: ( 52 --label: props.get(core.$transparent-colors, $theme, --500),
120 --bg: props.get(core.$transparent-colors, $theme, --300), 53 ),
121 --label: props.get(core.$transparent-colors, $theme, --500), 54 --quiet: (
122 ), 55 --bg: props.get(core.$transparent-colors, $theme, --300),
123 --quiet: ( 56 --label: props.get(core.$transparent-colors, $theme, --500),
124 --bg: props.get(core.$transparent-colors, $theme, --300), 57 ),
125 --label: props.get(core.$transparent-colors, $theme, --500), 58 --faint: (
126 ), 59 --bg: props.get(core.$transparent-colors, $theme, --200),
127 --faint: ( 60 --label: props.get(core.$transparent-colors, $theme, --400),
128 --bg: props.get(core.$transparent-colors, $theme, --200), 61 ),
129 --label: props.get(core.$transparent-colors, $theme, --400),
130 ),
131 ),
132 ) 62 )
133 ); 63 ));
134} 64}
135 65
136$themes-config: ( 66$themes-config: (
137 accent: --accent, 67 accent: --accent,
138 negative: --negative, 68 negative: --negative,
139) !default; 69) !default;
140 70
141$themes: props.def(--o-divider, (), "color"); 71$themes: props.def(--o-divider, (), 'color');
142 72
143@each $theme, $key in $themes-config { 73@each $theme, $key in $themes-config {
144 $themes: props.merge( 74 $themes: props.merge($themes, (
145 $themes, 75 --#{$theme}: (
146 ( 76 --bg: props.get(core.$theme, $key, --800),
147 --#{$theme}: ( 77 --label: props.get(core.$theme, $key, --1000),
148 --bg: props.get(core.$theme, $key, --800),
149 --label: props.get(core.$theme, $key, --1000),
150 )
151 ) 78 )
152 ); 79 ));
153} 80}