summaryrefslogtreecommitdiffstats
path: root/src/objects
diff options
context:
space:
mode:
Diffstat (limited to 'src/objects')
-rw-r--r--src/objects/_card.vars.scss3
-rw-r--r--src/objects/_divider.scss2
-rw-r--r--src/objects/_divider.vars.scss1
-rw-r--r--src/objects/_heading.scss28
-rw-r--r--src/objects/_heading.vars.scss114
-rw-r--r--src/objects/_tabbar.scss4
-rw-r--r--src/objects/_tabbar.vars.scss1
7 files changed, 125 insertions, 28 deletions
diff --git a/src/objects/_card.vars.scss b/src/objects/_card.vars.scss
index ebfba10..1e6448a 100644
--- a/src/objects/_card.vars.scss
+++ b/src/objects/_card.vars.scss
@@ -37,3 +37,6 @@ $key-focus--outline-color: props.def(--o-card--key-focus--outline-color, props.g
37 37
38$quiet--image-color: props.def(--o-card--quiet--image-color, props.get(core.$theme, --bg-base), 'color') !default; 38$quiet--image-color: props.def(--o-card--quiet--image-color, props.get(core.$theme, --bg-base), 'color') !default;
39$quiet--hover--image-color: props.def(--o-card--quiet--hover--image-color, props.get(core.$theme, --border), 'color') !default; 39$quiet--hover--image-color: props.def(--o-card--quiet--hover--image-color, props.get(core.$theme, --border), 'color') !default;
40
41$pad-i--sm: props.def(--o-card--pad-i, props.get(core.$size--200), 'sm') !default;
42$pad-b--sm: props.def(--o-card--pad-b, props.get(core.$size--175), 'sm') !default;
diff --git a/src/objects/_divider.scss b/src/objects/_divider.scss
index 27af173..51175a7 100644
--- a/src/objects/_divider.scss
+++ b/src/objects/_divider.scss
@@ -24,7 +24,7 @@
24 line-height: 1; 24 line-height: 1;
25 color: props.get(vars.$strong--label-color); 25 color: props.get(vars.$strong--label-color);
26 text-transform: uppercase; 26 text-transform: uppercase;
27 letter-spacing: .5px; 27 letter-spacing: props.get(vars.$letter-spacing);
28 background-color: transparent; 28 background-color: transparent;
29 29
30 &::before, 30 &::before,
diff --git a/src/objects/_divider.vars.scss b/src/objects/_divider.vars.scss
index 688fbb3..7081f47 100644
--- a/src/objects/_divider.vars.scss
+++ b/src/objects/_divider.vars.scss
@@ -6,6 +6,7 @@
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(--o-divider--vertical--width, props.get(core.$border-width--thin)) !default; 7$vertical--border-width: props.def(--o-divider--vertical--width, props.get(core.$border-width--thin)) !default;
8$dot--size: props.def(--o-divider--dot--size, props.get(core.$size--50)) !default; 8$dot--size: props.def(--o-divider--dot--size, props.get(core.$size--50)) !default;
9$letter-spacing: props.def(--o-divider--letter-spacing, 1px) !default;
9 10
10$strong--border-width: props.def(--o-divider--strong--border-width, props.get(core.$border-width--thick)) !default; 11$strong--border-width: props.def(--o-divider--strong--border-width, props.get(core.$border-width--thick)) !default;
11$strong--label-font-size: props.def(--o-divider--strong--label-font-size, props.get(core.$font-size--100)) !default; 12$strong--label-font-size: props.def(--o-divider--strong--label-font-size, props.get(core.$font-size--100)) !default;
diff --git a/src/objects/_heading.scss b/src/objects/_heading.scss
index 82e03f3..1d6e2dc 100644
--- a/src/objects/_heading.scss
+++ b/src/objects/_heading.scss
@@ -1,4 +1,6 @@
1@use 'sass:map';
1@use 'sass:meta'; 2@use 'sass:meta';
3@use 'sass:string';
2@use 'iro-sass/src/bem'; 4@use 'iro-sass/src/bem';
3@use 'iro-sass/src/props'; 5@use 'iro-sass/src/props';
4@use '../props' as *; 6@use '../props' as *;
@@ -32,31 +34,53 @@
32 transparent props.get(vars.$bg-end)); 34 transparent props.get(vars.$bg-end));
33 } 35 }
34 36
35 @each $mod, $font-family, $line-height, $font-size, $font-weight, $letter-spacing, $feature-settings, $text-transform in vars.$sizes { 37 @each $mod, $font-family, $line-height, $font-size, $font-weight, $letter-spacing, $feature-settings, $text-transform, $text-color in vars.$sizes {
36 @include bem.modifier($mod) { 38 @include bem.modifier($mod) {
37 font-family: props.get($font-family); 39 font-family: props.get($font-family);
38 font-size: props.get($font-size); 40 font-size: props.get($font-size);
39 font-weight: props.get($font-weight); 41 font-weight: props.get($font-weight);
40 font-feature-settings: props.get($feature-settings); 42 font-feature-settings: props.get($feature-settings);
41 line-height: props.get($line-height); 43 line-height: props.get($line-height);
44 color: props.get($text-color);
42 text-transform: props.get($text-transform); 45 text-transform: props.get($text-transform);
43 letter-spacing: props.get($letter-spacing); 46 letter-spacing: props.get($letter-spacing);
44 } 47 }
45 } 48 }
46 49
47 @include bem.modifier('display') { 50 @include bem.modifier('display') {
48 @each $mod, $font-family, $line-height, $font-size, $font-weight, $letter-spacing, $feature-settings, $text-transform in vars.$display--sizes { 51 @each $mod, $font-family, $line-height, $font-size, $font-weight, $letter-spacing, $feature-settings, $text-transform, $text-color in vars.$display--sizes {
49 @include bem.modifier($mod) { 52 @include bem.modifier($mod) {
50 font-family: props.get($font-family); 53 font-family: props.get($font-family);
51 font-size: props.get($font-size); 54 font-size: props.get($font-size);
52 font-weight: props.get($font-weight); 55 font-weight: props.get($font-weight);
53 font-feature-settings: props.get($feature-settings); 56 font-feature-settings: props.get($feature-settings);
54 line-height: props.get($line-height); 57 line-height: props.get($line-height);
58 color: props.get($text-color);
55 text-transform: props.get($text-transform); 59 text-transform: props.get($text-transform);
56 letter-spacing: props.get($letter-spacing); 60 letter-spacing: props.get($letter-spacing);
57 transform: translateX(props.get(vars.$offset)); 61 transform: translateX(props.get(vars.$offset));
58 } 62 }
59 } 63 }
60 } 64 }
65
66 @each $theme in map.keys(props.get(vars.$static-themes)) {
67 @include bem.modifier(string.slice($theme, 3)) {
68 color: props.get(vars.$static-themes, $theme, --text-color);
69
70 @each $mod, $value in vars.$sizes {
71 @include bem.modifier($mod) {
72 color: props.get(vars.$static-themes, $theme, --#{$mod}, --text-color);
73 }
74 }
75
76 @include bem.modifier('display') {
77 @each $mod, $value in vars.$sizes {
78 @include bem.modifier($mod) {
79 color: props.get(vars.$static-themes, $theme, --display, --#{$mod}, --text-color);
80 }
81 }
82 }
83 }
84 }
61 } 85 }
62} 86}
diff --git a/src/objects/_heading.vars.scss b/src/objects/_heading.vars.scss
index 78413dd..cf07488 100644
--- a/src/objects/_heading.vars.scss
+++ b/src/objects/_heading.vars.scss
@@ -1,3 +1,5 @@
1@use 'sass:map';
2@use 'sass:string';
1@use 'iro-sass/src/props'; 3@use 'iro-sass/src/props';
2@use '../core.vars' as core; 4@use '../core.vars' as core;
3 5
@@ -5,8 +7,22 @@ $offset: props.def(--o-heading--offset, -.02em) !default;
5$margin-bs: props.def(--o-heading--margin-bs, props.get(core.$size--700)) !default; 7$margin-bs: props.def(--o-heading--margin-bs, props.get(core.$size--700)) !default;
6$margin-bs-sibling: props.def(--o-heading--margin-bs-sibling, props.get(core.$size--325)) !default; 8$margin-bs-sibling: props.def(--o-heading--margin-bs-sibling, props.get(core.$size--325)) !default;
7 9
8$text-color: props.def(--o-heading--text-color, props.get(core.$theme, --heading), 'color') !default; 10$text-color: props.def(--o-heading--text-color, props.get(core.$theme, --heading), 'color') !default;
9$bg-color: props.def(--o-heading--bg-color, props.get(core.$theme, --base, --50), 'color') !default; 11$bg-color: props.def(--o-heading--bg-color, props.get(core.$theme, --base, --50), 'color') !default;
12
13$text-color--xxl: props.def(--o-heading--xxl--text-color, props.get(core.$theme, --heading), 'color') !default;
14$text-color--xl: props.def(--o-heading--xl--text-color, props.get($text-color--xxl), 'color') !default;
15$text-color--lg: props.def(--o-heading--lg--text-color, props.get($text-color--xxl), 'color') !default;
16$text-color--md: props.def(--o-heading--md--text-color, props.get($text-color--xxl), 'color') !default;
17$text-color--sm: props.def(--o-heading--sm--text-color, props.get(core.$theme, --text-mute-more), 'color') !default;
18$text-color--xs: props.def(--o-heading--xs--text-color, props.get($text-color--sm), 'color') !default;
19
20$display--text-color--xxl: props.def(--o-heading--display--xxl--text-color, props.get(core.$theme, --heading), 'color') !default;
21$display--text-color--xl: props.def(--o-heading--display--xl--text-color, props.get($display--text-color--xxl), 'color') !default;
22$display--text-color--lg: props.def(--o-heading--display--lg--text-color, props.get($display--text-color--xxl), 'color') !default;
23$display--text-color--md: props.def(--o-heading--display--md--text-color, props.get($display--text-color--xxl), 'color') !default;
24$display--text-color--sm: props.def(--o-heading--display--sm--text-color, props.get($display--text-color--xxl), 'color') !default;
25$display--text-color--xs: props.def(--o-heading--display--xs--text-color, props.get(core.$theme, --text-mute-more), 'color') !default;
10 26
11$bg-start: props.def(--o-heading--bg-start, .05em) !default; 27$bg-start: props.def(--o-heading--bg-start, .05em) !default;
12$bg-end: props.def(--o-heading--bg-end, .5em) !default; 28$bg-end: props.def(--o-heading--bg-end, .5em) !default;
@@ -20,7 +36,7 @@ $text-transform: props.def(--o-heading--text-transform, none) !default;
20$font-family--xxl: props.def(--o-heading--xxl--font-family, props.get(core.$font--standard--family)) !default; 36$font-family--xxl: props.def(--o-heading--xxl--font-family, props.get(core.$font--standard--family)) !default;
21$line-height--xxl: props.def(--o-heading--xxl--line-height, props.get(core.$font--standard--line-height)) !default; 37$line-height--xxl: props.def(--o-heading--xxl--line-height, props.get(core.$font--standard--line-height)) !default;
22$font-size--xxl: props.def(--o-heading--xxl--font-size, props.get(core.$font-size--300)) !default; 38$font-size--xxl: props.def(--o-heading--xxl--font-size, props.get(core.$font-size--300)) !default;
23$font-weight--xxl: props.def(--o-heading--xxl--font-weight, props.get(core.$font--standard--weight)) !default; 39$font-weight--xxl: props.def(--o-heading--xxl--font-weight, bold) !default;
24$letter-spacing--xxl: props.def(--o-heading--xxl--letter-spacing, 0) !default; 40$letter-spacing--xxl: props.def(--o-heading--xxl--letter-spacing, 0) !default;
25$feature-settings--xxl: props.def(--o-heading--xxl--feature-settings, props.get(core.$font--standard--feature-settings)) !default; 41$feature-settings--xxl: props.def(--o-heading--xxl--feature-settings, props.get(core.$font--standard--feature-settings)) !default;
26$text-transform--xxl: props.def(--o-heading--xxl--text-transform, none) !default; 42$text-transform--xxl: props.def(--o-heading--xxl--text-transform, none) !default;
@@ -28,7 +44,7 @@ $text-transform--xxl: props.def(--o-heading--xxl--text-transform, none) !defau
28$font-family--xl: props.def(--o-heading--xl--font-family, props.get(core.$font--standard--family)) !default; 44$font-family--xl: props.def(--o-heading--xl--font-family, props.get(core.$font--standard--family)) !default;
29$line-height--xl: props.def(--o-heading--xl--line-height, props.get(core.$font--standard--line-height)) !default; 45$line-height--xl: props.def(--o-heading--xl--line-height, props.get(core.$font--standard--line-height)) !default;
30$font-size--xl: props.def(--o-heading--xl--font-size, props.get(core.$font-size--200)) !default; 46$font-size--xl: props.def(--o-heading--xl--font-size, props.get(core.$font-size--200)) !default;
31$font-weight--xl: props.def(--o-heading--xl--font-weight, props.get(core.$font--standard--weight)) !default; 47$font-weight--xl: props.def(--o-heading--xl--font-weight, bold) !default;
32$letter-spacing--xl: props.def(--o-heading--xl--letter-spacing, 0) !default; 48$letter-spacing--xl: props.def(--o-heading--xl--letter-spacing, 0) !default;
33$feature-settings--xl: props.def(--o-heading--xl--feature-settings, props.get(core.$font--standard--feature-settings)) !default; 49$feature-settings--xl: props.def(--o-heading--xl--feature-settings, props.get(core.$font--standard--feature-settings)) !default;
34$text-transform--xl: props.def(--o-heading--xl--text-transform, none) !default; 50$text-transform--xl: props.def(--o-heading--xl--text-transform, none) !default;
@@ -51,27 +67,27 @@ $text-transform--md: props.def(--o-heading--md--text-transform, none) !default
51 67
52$font-family--sm: props.def(--o-heading--sm--font-family, props.get(core.$font--standard--family)) !default; 68$font-family--sm: props.def(--o-heading--sm--font-family, props.get(core.$font--standard--family)) !default;
53$line-height--sm: props.def(--o-heading--sm--line-height, props.get(core.$font--standard--line-height)) !default; 69$line-height--sm: props.def(--o-heading--sm--line-height, props.get(core.$font--standard--line-height)) !default;
54$font-size--sm: props.def(--o-heading--sm--font-size, props.get(core.$font-size--75)) !default; 70$font-size--sm: props.def(--o-heading--sm--font-size, props.get(core.$font-size--100)) !default;
55$font-weight--sm: props.def(--o-heading--sm--font-weight, 500) !default; 71$font-weight--sm: props.def(--o-heading--sm--font-weight, normal) !default;
56$letter-spacing--sm: props.def(--o-heading--sm--letter-spacing, 1px) !default; 72$letter-spacing--sm: props.def(--o-heading--sm--letter-spacing, 0) !default;
57$feature-settings--sm: props.def(--o-heading--sm--feature-settings, props.get(core.$font--standard--feature-settings)) !default; 73$feature-settings--sm: props.def(--o-heading--sm--feature-settings, props.get(core.$font--standard--feature-settings)) !default;
58$text-transform--sm: props.def(--o-heading--sm--text-transform, none) !default; 74$text-transform--sm: props.def(--o-heading--sm--text-transform, none) !default;
59 75
60$font-family--xs: props.def(--o-heading--xs--font-family, props.get(core.$font--standard--family)) !default; 76$font-family--xs: props.def(--o-heading--xs--font-family, props.get(core.$font--standard--family)) !default;
61$line-height--xs: props.def(--o-heading--xs--line-height, props.get(core.$font--standard--line-height)) !default; 77$line-height--xs: props.def(--o-heading--xs--line-height, props.get(core.$font--standard--line-height)) !default;
62$font-size--xs: props.def(--o-heading--xs--font-size, props.get(core.$font-size--50)) !default; 78$font-size--xs: props.def(--o-heading--xs--font-size, props.get(core.$font-size--50)) !default;
63$font-weight--xs: props.def(--o-heading--xs--font-weight, 500) !default; 79$font-weight--xs: props.def(--o-heading--xs--font-weight, normal) !default;
64$letter-spacing--xs: props.def(--o-heading--xs--letter-spacing, 1px) !default; 80$letter-spacing--xs: props.def(--o-heading--xs--letter-spacing, 1px) !default;
65$feature-settings--xs: props.def(--o-heading--xs--feature-settings, props.get(core.$font--standard--feature-settings)) !default; 81$feature-settings--xs: props.def(--o-heading--xs--feature-settings, props.get(core.$font--standard--feature-settings)) !default;
66$text-transform--xs: props.def(--o-heading--xs--text-transform, none) !default; 82$text-transform--xs: props.def(--o-heading--xs--text-transform, none) !default;
67 83
68$sizes: ( 84$sizes: (
69 'xs' $font-family--xs $line-height--xs $font-size--xs $font-weight--xs $letter-spacing--xs $feature-settings--xs $text-transform--xs, 85 'xs' $font-family--xs $line-height--xs $font-size--xs $font-weight--xs $letter-spacing--xs $feature-settings--xs $text-transform--xs $text-color--xs,
70 'sm' $font-family--sm $line-height--sm $font-size--sm $font-weight--sm $letter-spacing--sm $feature-settings--sm $text-transform--sm, 86 'sm' $font-family--sm $line-height--sm $font-size--sm $font-weight--sm $letter-spacing--sm $feature-settings--sm $text-transform--sm $text-color--sm,
71 'md' $font-family--md $line-height--md $font-size--md $font-weight--md $letter-spacing--md $feature-settings--md $text-transform--md, 87 'md' $font-family--md $line-height--md $font-size--md $font-weight--md $letter-spacing--md $feature-settings--md $text-transform--md $text-color--md,
72 'lg' $font-family--lg $line-height--lg $font-size--lg $font-weight--lg $letter-spacing--lg $feature-settings--lg $text-transform--lg, 88 'lg' $font-family--lg $line-height--lg $font-size--lg $font-weight--lg $letter-spacing--lg $feature-settings--lg $text-transform--lg $text-color--lg,
73 'xl' $font-family--xl $line-height--xl $font-size--xl $font-weight--xl $letter-spacing--xl $feature-settings--xl $text-transform--xl, 89 'xl' $font-family--xl $line-height--xl $font-size--xl $font-weight--xl $letter-spacing--xl $feature-settings--xl $text-transform--xl $text-color--xl,
74 'xxl' $font-family--xxl $line-height--xxl $font-size--xxl $font-weight--xxl $letter-spacing--xxl $feature-settings--xxl $text-transform--xxl, 90 'xxl' $font-family--xxl $line-height--xxl $font-size--xxl $font-weight--xxl $letter-spacing--xxl $feature-settings--xxl $text-transform--xxl $text-color--xxl,
75) !default; 91) !default;
76 92
77$display--font-family--xxl: props.def(--o-heading--display--xxl--font-family, props.get(core.$font--headline--family)) !default; 93$display--font-family--xxl: props.def(--o-heading--display--xxl--font-family, props.get(core.$font--headline--family)) !default;
@@ -101,14 +117,14 @@ $display--text-transform--lg: props.def(--o-heading--display--lg--text-transfo
101$display--font-family--md: props.def(--o-heading--display--md--font-family, props.get(core.$font--standard--family)) !default; 117$display--font-family--md: props.def(--o-heading--display--md--font-family, props.get(core.$font--standard--family)) !default;
102$display--line-height--md: props.def(--o-heading--display--md--line-height, props.get(core.$font--standard--line-height)) !default; 118$display--line-height--md: props.def(--o-heading--display--md--line-height, props.get(core.$font--standard--line-height)) !default;
103$display--font-size--md: props.def(--o-heading--display--md--font-size, props.get(core.$font-size--150)) !default; 119$display--font-size--md: props.def(--o-heading--display--md--font-size, props.get(core.$font-size--150)) !default;
104$display--font-weight--md: props.def(--o-heading--display--md--font-weight, props.get(core.$font--standard--weight)) !default; 120$display--font-weight--md: props.def(--o-heading--display--md--font-weight, bold) !default;
105$display--letter-spacing--md: props.def(--o-heading--display--md--letter-spacing, 0) !default; 121$display--letter-spacing--md: props.def(--o-heading--display--md--letter-spacing, 0) !default;
106$display--feature-settings--md: props.def(--o-heading--display--md--feature-settings, props.get(core.$font--standard--feature-settings)) !default; 122$display--feature-settings--md: props.def(--o-heading--display--md--feature-settings, props.get(core.$font--standard--feature-settings)) !default;
107$display--text-transform--md: props.def(--o-heading--display--md--text-transform, none) !default; 123$display--text-transform--md: props.def(--o-heading--display--md--text-transform, none) !default;
108 124
109$display--font-family--sm: props.def(--o-heading--display--sm--font-family, props.get(core.$font--standard--family)) !default; 125$display--font-family--sm: props.def(--o-heading--display--sm--font-family, props.get(core.$font--standard--family)) !default;
110$display--line-height--sm: props.def(--o-heading--display--sm--line-height, props.get(core.$font--standard--line-height)) !default; 126$display--line-height--sm: props.def(--o-heading--display--sm--line-height, props.get(core.$font--standard--line-height)) !default;
111$display--font-size--sm: props.def(--o-heading--display--sm--font-size, props.get(core.$font-size--75)) !default; 127$display--font-size--sm: props.def(--o-heading--display--sm--font-size, props.get(core.$font-size--100)) !default;
112$display--font-weight--sm: props.def(--o-heading--display--sm--font-weight, bold) !default; 128$display--font-weight--sm: props.def(--o-heading--display--sm--font-weight, bold) !default;
113$display--letter-spacing--sm: props.def(--o-heading--display--sm--letter-spacing, 0) !default; 129$display--letter-spacing--sm: props.def(--o-heading--display--sm--letter-spacing, 0) !default;
114$display--feature-settings--sm: props.def(--o-heading--display--sm--feature-settings, props.get(core.$font--standard--feature-settings)) !default; 130$display--feature-settings--sm: props.def(--o-heading--display--sm--feature-settings, props.get(core.$font--standard--feature-settings)) !default;
@@ -117,7 +133,7 @@ $display--text-transform--sm: props.def(--o-heading--display--sm--text-transfo
117$display--font-family--xs: props.def(--o-heading--display--xs--font-family, props.get(core.$font--standard--family)) !default; 133$display--font-family--xs: props.def(--o-heading--display--xs--font-family, props.get(core.$font--standard--family)) !default;
118$display--line-height--xs: props.def(--o-heading--display--xs--line-height, props.get(core.$font--standard--line-height)) !default; 134$display--line-height--xs: props.def(--o-heading--display--xs--line-height, props.get(core.$font--standard--line-height)) !default;
119$display--font-size--xs: props.def(--o-heading--display--xs--font-size, props.get(core.$font-size--50)) !default; 135$display--font-size--xs: props.def(--o-heading--display--xs--font-size, props.get(core.$font-size--50)) !default;
120$display--font-weight--xs: props.def(--o-heading--display--xs--font-weight, 500) !default; 136$display--font-weight--xs: props.def(--o-heading--display--xs--font-weight, normal) !default;
121$display--letter-spacing--xs: props.def(--o-heading--display--xs--letter-spacing, 1px) !default; 137$display--letter-spacing--xs: props.def(--o-heading--display--xs--letter-spacing, 1px) !default;
122$display--feature-settings--xs: props.def(--o-heading--display--xs--feature-settings, props.get(core.$font--standard--feature-settings)) !default; 138$display--feature-settings--xs: props.def(--o-heading--display--xs--feature-settings, props.get(core.$font--standard--feature-settings)) !default;
123$display--text-transform--xs: props.def(--o-heading--display--xs--text-transform, none) !default; 139$display--text-transform--xs: props.def(--o-heading--display--xs--text-transform, none) !default;
@@ -130,10 +146,62 @@ $display--font-size--sm--md: props.def(--o-heading--display--sm--font-size, pro
130$display--font-size--xs--md: props.def(--o-heading--display--xs--font-size, props.get(core.$font-size--50), 'md') !default; 146$display--font-size--xs--md: props.def(--o-heading--display--xs--font-size, props.get(core.$font-size--50), 'md') !default;
131 147
132$display--sizes: ( 148$display--sizes: (
133 'xs' $display--font-family--xs $display--line-height--xs $display--font-size--xs $display--font-weight--xs $display--letter-spacing--xs $display--feature-settings--xs $display--text-transform--xs, 149 'xs' $display--font-family--xs $display--line-height--xs $display--font-size--xs $display--font-weight--xs $display--letter-spacing--xs $display--feature-settings--xs $display--text-transform--xs $display--text-color--xs,
134 'sm' $display--font-family--sm $display--line-height--sm $display--font-size--sm $display--font-weight--sm $display--letter-spacing--sm $display--feature-settings--sm $display--text-transform--sm, 150 'sm' $display--font-family--sm $display--line-height--sm $display--font-size--sm $display--font-weight--sm $display--letter-spacing--sm $display--feature-settings--sm $display--text-transform--sm $display--text-color--sm,
135 'md' $display--font-family--md $display--line-height--md $display--font-size--md $display--font-weight--md $display--letter-spacing--md $display--feature-settings--md $display--text-transform--md, 151 'md' $display--font-family--md $display--line-height--md $display--font-size--md $display--font-weight--md $display--letter-spacing--md $display--feature-settings--md $display--text-transform--md $display--text-color--md,
136 'lg' $display--font-family--lg $display--line-height--lg $display--font-size--lg $display--font-weight--lg $display--letter-spacing--lg $display--feature-settings--lg $display--text-transform--lg, 152 'lg' $display--font-family--lg $display--line-height--lg $display--font-size--lg $display--font-weight--lg $display--letter-spacing--lg $display--feature-settings--lg $display--text-transform--lg $display--text-color--lg,
137 'xl' $display--font-family--xl $display--line-height--xl $display--font-size--xl $display--font-weight--xl $display--letter-spacing--xl $display--feature-settings--xl $display--text-transform--xl, 153 'xl' $display--font-family--xl $display--line-height--xl $display--font-size--xl $display--font-weight--xl $display--letter-spacing--xl $display--feature-settings--xl $display--text-transform--xl $display--text-color--xl,
138 'xxl' $display--font-family--xxl $display--line-height--xxl $display--font-size--xxl $display--font-weight--xxl $display--letter-spacing--xxl $display--feature-settings--xxl $display--text-transform--xxl, 154 'xxl' $display--font-family--xxl $display--line-height--xxl $display--font-size--xxl $display--font-weight--xxl $display--letter-spacing--xxl $display--feature-settings--xxl $display--text-transform--xxl $display--text-color--xxl,
139) !default; 155) !default;
156
157$static-themes: props.def(--o-heading, (), 'color');
158
159@each $theme in map.keys(props.get(core.$transparent-colors)) {
160 $heading-theme: --static-#{string.slice($theme, 3)};
161
162 $static-themes: props.merge($static-themes, (
163 $heading-theme: (
164 --text-color: props.get(core.$transparent-colors, $theme, --900),
165
166 --xxl: (
167 --text-color: props.get(core.$transparent-colors, $theme, --900),
168 ),
169 --xl: (
170 --text-color: props.get(core.$transparent-colors, $theme, --900),
171 ),
172 --lg: (
173 --text-color: props.get(core.$transparent-colors, $theme, --900),
174 ),
175 --md: (
176 --text-color: props.get(core.$transparent-colors, $theme, --900),
177 ),
178 --sm: (
179 --text-color: props.get(core.$transparent-colors, $theme, --500),
180 ),
181 --xs: (
182 --text-color: props.get(core.$transparent-colors, $theme, --500),
183 ),
184
185 --display: (
186 --xxl: (
187 --text-color: props.get(core.$transparent-colors, $theme, --900),
188 ),
189 --xl: (
190 --text-color: props.get(core.$transparent-colors, $theme, --900),
191 ),
192 --lg: (
193 --text-color: props.get(core.$transparent-colors, $theme, --900),
194 ),
195 --md: (
196 --text-color: props.get(core.$transparent-colors, $theme, --900),
197 ),
198 --sm: (
199 --text-color: props.get(core.$transparent-colors, $theme, --900),
200 ),
201 --xs: (
202 --text-color: props.get(core.$transparent-colors, $theme, --500),
203 ),
204 ),
205 )
206 ));
207}
diff --git a/src/objects/_tabbar.scss b/src/objects/_tabbar.scss
index a9daaae..eee38e9 100644
--- a/src/objects/_tabbar.scss
+++ b/src/objects/_tabbar.scss
@@ -18,8 +18,8 @@
18 18
19 &::after { 19 &::after {
20 display: block; 20 display: block;
21 block-size: props.get(vars.$indicator--width); 21 block-size: props.get(vars.$border--width);
22 margin-block-start: calc(-1 * props.get(vars.$indicator--width)); 22 margin-block-start: calc(-1 * props.get(vars.$border--width));
23 content: ''; 23 content: '';
24 background-color: props.get(vars.$railing--bg-color); 24 background-color: props.get(vars.$railing--bg-color);
25 } 25 }
diff --git a/src/objects/_tabbar.vars.scss b/src/objects/_tabbar.vars.scss
index 4095629..3cf01fd 100644
--- a/src/objects/_tabbar.vars.scss
+++ b/src/objects/_tabbar.vars.scss
@@ -8,6 +8,7 @@ $rounding: props.def(--o-tabbar--rounding, props.get(core.$rounding--sm)) !def
8$spacing: props.def(--o-tabbar--spacing, props.get(core.$size--400)) !default; 8$spacing: props.def(--o-tabbar--spacing, props.get(core.$size--400)) !default;
9$tab--pad-i: props.def(--o-tabbar--tab--pad-i, props.get(core.$size--50)) !default; 9$tab--pad-i: props.def(--o-tabbar--tab--pad-i, props.get(core.$size--50)) !default;
10 10
11$border--width: props.def(--o-tabbar--border--width, props.get(core.$border-width--thin)) !default;
11$indicator--width: props.def(--o-tabbar--indicator--width, props.get(core.$border-width--medium)) !default; 12$indicator--width: props.def(--o-tabbar--indicator--width, props.get(core.$border-width--medium)) !default;
12 13
13$key-focus--border-width: props.def(--o-tabbar--key-focus--border-width, props.get(core.$key-focus--border-width)) !default; 14$key-focus--border-width: props.def(--o-tabbar--key-focus--border-width, props.get(core.$key-focus--border-width)) !default;
generated by cgit v1.2.3-70-g09d2 (git 2.50.0) at 2025-11-09 19:59:14 +0000