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

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