@oardi/css-utils 0.121.2 → 0.123.0
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 +1 -1
- package/scss/components/icon.scss +23 -0
- package/scss/index.scss +1 -0
- package/scss/text.scss +7 -0
- package/scss/theme.scss +11 -0
- package/scss/variables.scss +5 -0
package/package.json
CHANGED
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
.icon {
|
|
2
|
+
display: inline-flex;
|
|
3
|
+
|
|
4
|
+
&-sm svg {
|
|
5
|
+
width: 1rem;
|
|
6
|
+
height: 1rem;
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
&-md svg {
|
|
10
|
+
width: 1.5rem;
|
|
11
|
+
height: 1.5rem;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
&-lg svg {
|
|
15
|
+
width: 2rem;
|
|
16
|
+
height: 2rem;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
&-xl svg {
|
|
20
|
+
width: 2.5rem;
|
|
21
|
+
height: 2.5rem;
|
|
22
|
+
}
|
|
23
|
+
}
|
package/scss/index.scss
CHANGED
|
@@ -37,6 +37,7 @@
|
|
|
37
37
|
@forward './components/file-upload.scss';
|
|
38
38
|
@forward './components/form.scss';
|
|
39
39
|
@forward './components/icon-button.scss';
|
|
40
|
+
@forward './components/icon.scss';
|
|
40
41
|
@forward './components/input-group.scss';
|
|
41
42
|
@forward './components/list.scss';
|
|
42
43
|
@forward './components/menu.scss';
|
package/scss/text.scss
CHANGED
|
@@ -86,12 +86,19 @@ $letterSpacings: 0, 1, 2, 3, 4, 5;
|
|
|
86
86
|
}
|
|
87
87
|
}
|
|
88
88
|
|
|
89
|
+
// Deprecated: use .line-height-* utilities instead.
|
|
89
90
|
@each $name, $value in map.get(theme.$theme, lineHeights) {
|
|
90
91
|
.lh-#{$name} {
|
|
91
92
|
line-height: var(--line-height-#{$name});
|
|
92
93
|
}
|
|
93
94
|
}
|
|
94
95
|
|
|
96
|
+
@each $effect, $legacy-name in theme.$line-height-effect-names {
|
|
97
|
+
.line-height-#{$effect} {
|
|
98
|
+
line-height: var(--line-height-#{$effect});
|
|
99
|
+
}
|
|
100
|
+
}
|
|
101
|
+
|
|
95
102
|
@each $letterSpacing in $letterSpacings {
|
|
96
103
|
.letter-space-#{$letterSpacing} {
|
|
97
104
|
letter-spacing: #{$letterSpacing}px;
|
package/scss/theme.scss
CHANGED
|
@@ -166,6 +166,17 @@ $-line-heights: (
|
|
|
166
166
|
xxxl: 2.5,
|
|
167
167
|
);
|
|
168
168
|
|
|
169
|
+
// Map the public effect names to the existing Sass scale during the compatibility period.
|
|
170
|
+
$line-height-effect-names: (
|
|
171
|
+
none: xs,
|
|
172
|
+
tight: sm,
|
|
173
|
+
snug: md,
|
|
174
|
+
normal: lg,
|
|
175
|
+
relaxed: xl,
|
|
176
|
+
loose: xxl,
|
|
177
|
+
extra-loose: xxxl,
|
|
178
|
+
);
|
|
179
|
+
|
|
169
180
|
$-font-sizes: (
|
|
170
181
|
xs: 0.75rem,
|
|
171
182
|
sm: 0.875rem,
|
package/scss/variables.scss
CHANGED
|
@@ -32,6 +32,11 @@
|
|
|
32
32
|
}
|
|
33
33
|
|
|
34
34
|
--line-height: 1.8;
|
|
35
|
+
@each $effect, $legacy-name in theme.$line-height-effect-names {
|
|
36
|
+
--line-height-#{$effect}: #{map.get(map.get(theme.$theme, lineHeights), $legacy-name)};
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
// Deprecated: retained for existing .lh-* utilities and component tokens.
|
|
35
40
|
@each $name, $value in map.get(theme.$theme, lineHeights) {
|
|
36
41
|
--line-height-#{$name}: #{$value};
|
|
37
42
|
}
|