@progress/kendo-theme-core 8.0.0-dev.0 → 8.0.0-dev.10

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.
@@ -0,0 +1,228 @@
1
+ @import "../functions/index.import.scss";
2
+
3
+ /// The base font size across all components.
4
+ /// @group typography
5
+ $kendo-font-size: 0.875rem !default;
6
+ /// The extra extra small font size across all components.
7
+ /// @group typography
8
+ $kendo-font-size-xxs: 0.5rem !default;
9
+ /// The extra small font size across all components.
10
+ /// @group typography
11
+ $kendo-font-size-xs: 0.625rem !default;
12
+ /// The small font size across all components.
13
+ /// @group typography
14
+ $kendo-font-size-sm: 0.75rem !default;
15
+ /// The medium font size across all components.
16
+ /// @group typography
17
+ $kendo-font-size-md: $kendo-font-size !default;
18
+ /// The large font size across all components.
19
+ /// @group typography
20
+ $kendo-font-size-lg: 1rem !default;
21
+ /// The extra large font size across all components.
22
+ /// @group typography
23
+ $kendo-font-size-xl: 1.25rem !default;
24
+
25
+ /// The base line height across all components.
26
+ /// @group typography
27
+ $kendo-line-height: k-math-div( 20, 14 ) !default;
28
+ /// The extra small line height across all components.
29
+ /// @group typography
30
+ $kendo-line-height-xs: 1 !default;
31
+ /// The small line height across all components.
32
+ /// @group typography
33
+ $kendo-line-height-sm: 1.25 !default;
34
+ /// The medium line height across all components.
35
+ /// @group typography
36
+ $kendo-line-height-md: $kendo-line-height !default;
37
+ /// The large line height across all components.
38
+ /// @group typography
39
+ $kendo-line-height-lg: 1.5 !default;
40
+ /// The base line height in ems across all components.
41
+ /// @group typography
42
+ $kendo-line-height-em: calc( #{$kendo-line-height-md} * 1em ) !default;
43
+
44
+ /// The base font weight across all components.
45
+ /// @group typography
46
+ $kendo-font-weight: 400 !default;
47
+ /// The thin font weight across all components.
48
+ /// @group typography
49
+ $kendo-font-weight-thin: 100 !default;
50
+ /// The extra light font weight across all components.
51
+ /// @group typography
52
+ $kendo-font-weight-extra-light: 200 !default;
53
+ /// The light font weight across all components.
54
+ /// @group typography
55
+ $kendo-font-weight-light: 300 !default;
56
+ /// The normal font weight across all components.
57
+ /// @group typography
58
+ $kendo-font-weight-normal: $kendo-font-weight !default;
59
+ /// The medium font weight across all components.
60
+ /// @group typography
61
+ $kendo-font-weight-medium: 500 !default;
62
+ /// The semibold font weight across all components.
63
+ /// @group typography
64
+ $kendo-font-weight-semibold: 600 !default;
65
+ /// The bold font weight across all components.
66
+ /// @group typography
67
+ $kendo-font-weight-bold: 700 !default;
68
+ /// The extra bold font weight across all components.
69
+ /// @group typography
70
+ $kendo-font-weight-extra-bold: 800 !default;
71
+ /// The most pronounced font weight across all components.
72
+ /// @group typography
73
+ $kendo-font-weight-black: 900 !default;
74
+
75
+ /// The base letter spacing across all components.
76
+ /// @group typography
77
+ $kendo-letter-spacing: null !default;
78
+ /// The tightest letter spacing across all components.
79
+ /// @group typography
80
+ $kendo-letter-spacing-tightest: -.15px !default;
81
+ /// Slightly looser than the tighter letter spacing across all components.
82
+ /// @group typography
83
+ $kendo-letter-spacing-tighter: -.10px !default;
84
+ /// Moderately tight letter spacing across all components.
85
+ /// @group typography
86
+ $kendo-letter-spacing-tight: -.5px !default;
87
+ /// The normal letter spacing across all components.
88
+ /// @group typography
89
+ $kendo-letter-spacing-normal: 0px !default;
90
+ /// Wide letter spacing across all components.
91
+ /// @group typography
92
+ $kendo-letter-spacing-wide: .5px !default;
93
+ /// Slightly wider than the wide letter spacing across all components.
94
+ /// @group typography
95
+ $kendo-letter-spacing-wider: .10px !default;
96
+ /// The widest letter spacing across all components.
97
+ /// @group typography
98
+ $kendo-letter-spacing-widest: .15px !default;
99
+
100
+ /// The sans font family across all components.
101
+ /// @group typography
102
+ $kendo-font-family-sans: Arial, Verdana, Tahoma, "Trebuchet MS", Helvetica, Impact, Gill Sans !default;
103
+ /// The serif font family across all components.
104
+ /// @group typography
105
+ $kendo-font-family-serif: "Times New Roman", Georgia, Garamond, Palatino, Baskerville !default;
106
+ /// The sans-serif font family across all components.
107
+ /// @group typography
108
+ $kendo-font-family-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !default;
109
+ /// The monospace font family across all components.
110
+ /// @group typography
111
+ $kendo-font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Roboto Mono", "Ubuntu Mono", "Lucida Console", "Courier New", monospace !default;
112
+
113
+ /// The base font family across all components.
114
+ /// @group typography
115
+ $kendo-font-family: inherit !default;
116
+
117
+ $_default-font-sizes: (
118
+ xxs: $kendo-font-size-xxs,
119
+ xs: $kendo-font-size-xs,
120
+ sm: $kendo-font-size-sm,
121
+ md: $kendo-font-size-md,
122
+ lg: $kendo-font-size-lg,
123
+ xl: $kendo-font-size-xl
124
+ ) !default;
125
+
126
+ $_default-line-heights: (
127
+ xs: $kendo-line-height-xs,
128
+ sm: $kendo-line-height-sm,
129
+ md: $kendo-line-height-md,
130
+ lg: $kendo-line-height-lg,
131
+ ) !default;
132
+
133
+ $_default-font-weights: (
134
+ thin: $kendo-font-weight-thin,
135
+ extra-light: $kendo-font-weight-extra-light,
136
+ light: $kendo-font-weight-light,
137
+ normal: $kendo-font-weight-normal,
138
+ medium: $kendo-font-weight-medium,
139
+ semibold: $kendo-font-weight-semibold,
140
+ bold: $kendo-font-weight-bold
141
+ ) !default;
142
+
143
+ $_default-letter-spacings: (
144
+ tightest: $kendo-letter-spacing-tightest,
145
+ tighter: $kendo-letter-spacing-tighter,
146
+ tight: $kendo-letter-spacing-tight,
147
+ normal: $kendo-letter-spacing-normal,
148
+ wide: $kendo-letter-spacing-wide,
149
+ wider: $kendo-letter-spacing-wider,
150
+ widest: $kendo-letter-spacing-widest
151
+ ) !default;
152
+
153
+ $_default-font-families: (
154
+ sans: $kendo-font-family-sans,
155
+ serif: $kendo-font-family-serif,
156
+ sans-serif: $kendo-font-family-sans-serif,
157
+ monospace: $kendo-font-family-monospace
158
+ ) !default;
159
+
160
+ $kendo-font-sizes: $_default-font-sizes !default;
161
+
162
+ /// The font sizes map
163
+ /// @group typography
164
+ $kendo-font-sizes: k-map-merge( $_default-font-sizes, $kendo-font-sizes );
165
+
166
+ $kendo-line-heights: $_default-line-heights !default;
167
+
168
+ /// The line heights map
169
+ /// @group typography
170
+ $kendo-line-heights: k-map-merge( $_default-line-heights, $kendo-line-heights );
171
+
172
+ $kendo-font-weights: $_default-font-weights !default;
173
+
174
+ /// The font weights map
175
+ /// @group typography
176
+ $kendo-font-weights: k-map-merge( $_default-font-weights, $kendo-font-weights );
177
+
178
+ $kendo-letter-spacings: $_default-letter-spacings !default;
179
+
180
+ /// The letter spacings map
181
+ /// @group typography
182
+ $kendo-letter-spacings: k-map-merge( $_default-letter-spacings, $kendo-letter-spacings );
183
+
184
+ $kendo-font-families: $_default-font-families !default;
185
+
186
+ /// The font families map
187
+ /// @group typography
188
+ $kendo-font-families: k-map-merge( $_default-font-families, $kendo-font-families );
189
+
190
+ @mixin typography( $font-size: null, $font-family: null, $line-height: null, $font-weight: null, $letter-spacing: null ) {
191
+ font-size: $font-size;
192
+ font-family: $font-family;
193
+ line-height: $line-height;
194
+ font-weight: $font-weight;
195
+ letter-spacing: $letter-spacing;
196
+ }
197
+
198
+
199
+ @mixin kendo-core--typography--styles() {
200
+ :root {
201
+
202
+ --kendo-font-family: #{k-meta-inspect($kendo-font-family)};
203
+ --kendo-font-size: #{$kendo-font-size};
204
+ --kendo-line-height: #{$kendo-line-height};
205
+ --kendo-font-weight: #{$kendo-font-weight};
206
+ --kendo-letter-spacing: #{$kendo-letter-spacing};
207
+
208
+ @each $size, $value in $kendo-font-sizes {
209
+ --kendo-font-size-#{$size}: #{$value};
210
+ }
211
+
212
+ @each $size, $value in $kendo-line-heights {
213
+ --kendo-line-height-#{$size}: #{$value};
214
+ }
215
+
216
+ @each $weight, $value in $kendo-font-weights {
217
+ --kendo-font-weight-#{$weight}: #{$value};
218
+ }
219
+
220
+ @each $spacing, $value in $kendo-letter-spacings {
221
+ --kendo-letter-spacing-#{$spacing}: #{$value};
222
+ }
223
+
224
+ @each $family, $value in $kendo-font-families {
225
+ --kendo-font-family-#{$family}: #{$value};
226
+ }
227
+ }
228
+ }
@@ -1,7 +0,0 @@
1
- @mixin typography( $font-size: null, $font-family: null, $line-height: null, $font-weight: null, $letter-spacing: null ) {
2
- font-size: $font-size;
3
- font-family: $font-family;
4
- line-height: $line-height;
5
- font-weight: $font-weight;
6
- letter-spacing: $letter-spacing;
7
- }