@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.
- package/dist/all.css +1 -12
- package/dist/all.scss +382 -65
- package/dist/meta/sassdoc-data.json +6771 -4005
- package/dist/meta/sassdoc-raw-data.json +1282 -7
- package/dist/meta/variables.json +195 -39
- package/package.json +2 -2
- package/scss/_variables.scss +1 -64
- package/scss/border-radii/index.import.scss +61 -0
- package/scss/index.import.scss +3 -0
- package/scss/mixins/index.import.scss +0 -1
- package/scss/spacing/index.import.scss +101 -0
- package/scss/styles/_base.scss +2 -2
- package/scss/styles/_layout.scss +0 -15
- package/scss/typography/index.import.scss +228 -0
- package/scss/mixins/_typography.scss +0 -7
package/dist/meta/variables.json
CHANGED
|
@@ -199,77 +199,233 @@
|
|
|
199
199
|
"type": "Map",
|
|
200
200
|
"value": "(1: (0 2px 3px rgba(0, 0, 0, 0.04), 0 4px 16px rgba(0, 0, 0, 0.12)), 2: (0 4px 6px rgba(0, 0, 0, 0.06), 0 4px 16px rgba(0, 0, 0, 0.12)), 3: (0 6px 8px rgba(0, 0, 0, 0.08), 0 4px 16px rgba(0, 0, 0, 0.12)), 4: (0 8px 10px rgba(0, 0, 0, 0.12), 0 4px 16px rgba(0, 0, 0, 0.12)), 5: (0 10px 12px rgba(0, 0, 0, 0.16), 0 4px 16px rgba(0, 0, 0, 0.12)), 6: (0 12px 14px rgba(0, 0, 0, 0.2), 0 4px 16px rgba(0, 0, 0, 0.12)), 7: (0 14px 16px rgba(0, 0, 0, 0.24), 0 4px 16px rgba(0, 0, 0, 0.12)), 8: (0 16px 18px rgba(0, 0, 0, 0.28), 0 4px 16px rgba(0, 0, 0, 0.12)), 9: (0 32px 34px rgba(0, 0, 0, 0.32), 0 4px 16px rgba(0, 0, 0, 0.12)))"
|
|
201
201
|
},
|
|
202
|
-
"kendo-
|
|
203
|
-
"type": "
|
|
204
|
-
"value": "
|
|
202
|
+
"kendo-font-size": {
|
|
203
|
+
"type": "Number",
|
|
204
|
+
"value": "0.875rem"
|
|
205
205
|
},
|
|
206
|
-
"kendo-
|
|
207
|
-
"type": "
|
|
208
|
-
"value": "
|
|
206
|
+
"kendo-font-size-xxs": {
|
|
207
|
+
"type": "Number",
|
|
208
|
+
"value": "0.5rem"
|
|
209
209
|
},
|
|
210
|
-
"kendo-
|
|
211
|
-
"type": "
|
|
212
|
-
"value": "
|
|
210
|
+
"kendo-font-size-xs": {
|
|
211
|
+
"type": "Number",
|
|
212
|
+
"value": "0.625rem"
|
|
213
213
|
},
|
|
214
|
-
"kendo-
|
|
215
|
-
"type": "
|
|
216
|
-
"value": "
|
|
214
|
+
"kendo-font-size-sm": {
|
|
215
|
+
"type": "Number",
|
|
216
|
+
"value": "0.75rem"
|
|
217
217
|
},
|
|
218
|
-
"kendo-
|
|
219
|
-
"type": "
|
|
220
|
-
"value": "
|
|
218
|
+
"kendo-font-size-md": {
|
|
219
|
+
"type": "Number",
|
|
220
|
+
"value": "0.875rem"
|
|
221
221
|
},
|
|
222
|
-
"kendo-
|
|
222
|
+
"kendo-font-size-lg": {
|
|
223
223
|
"type": "Number",
|
|
224
|
-
"value": "
|
|
224
|
+
"value": "1rem"
|
|
225
225
|
},
|
|
226
|
-
"kendo-
|
|
226
|
+
"kendo-font-size-xl": {
|
|
227
227
|
"type": "Number",
|
|
228
|
-
"value": "
|
|
228
|
+
"value": "1.25rem"
|
|
229
229
|
},
|
|
230
|
-
"kendo-
|
|
230
|
+
"kendo-line-height": {
|
|
231
231
|
"type": "Number",
|
|
232
|
-
"value": "
|
|
232
|
+
"value": "1.4285714286"
|
|
233
233
|
},
|
|
234
|
-
"kendo-
|
|
234
|
+
"kendo-line-height-xs": {
|
|
235
235
|
"type": "Number",
|
|
236
|
-
"value": "
|
|
236
|
+
"value": "1"
|
|
237
237
|
},
|
|
238
|
-
"kendo-
|
|
238
|
+
"kendo-line-height-sm": {
|
|
239
|
+
"type": "Number",
|
|
240
|
+
"value": "1.25"
|
|
241
|
+
},
|
|
242
|
+
"kendo-line-height-md": {
|
|
243
|
+
"type": "Number",
|
|
244
|
+
"value": "1.4285714286"
|
|
245
|
+
},
|
|
246
|
+
"kendo-line-height-lg": {
|
|
247
|
+
"type": "Number",
|
|
248
|
+
"value": "1.5"
|
|
249
|
+
},
|
|
250
|
+
"kendo-line-height-em": {
|
|
251
|
+
"type": "Calculation",
|
|
252
|
+
"value": "calc(1.4285714286 * 1em)"
|
|
253
|
+
},
|
|
254
|
+
"kendo-font-weight": {
|
|
255
|
+
"type": "Number",
|
|
256
|
+
"value": "400"
|
|
257
|
+
},
|
|
258
|
+
"kendo-font-weight-thin": {
|
|
259
|
+
"type": "Number",
|
|
260
|
+
"value": "100"
|
|
261
|
+
},
|
|
262
|
+
"kendo-font-weight-extra-light": {
|
|
263
|
+
"type": "Number",
|
|
264
|
+
"value": "200"
|
|
265
|
+
},
|
|
266
|
+
"kendo-font-weight-light": {
|
|
267
|
+
"type": "Number",
|
|
268
|
+
"value": "300"
|
|
269
|
+
},
|
|
270
|
+
"kendo-font-weight-normal": {
|
|
271
|
+
"type": "Number",
|
|
272
|
+
"value": "400"
|
|
273
|
+
},
|
|
274
|
+
"kendo-font-weight-medium": {
|
|
275
|
+
"type": "Number",
|
|
276
|
+
"value": "500"
|
|
277
|
+
},
|
|
278
|
+
"kendo-font-weight-semibold": {
|
|
279
|
+
"type": "Number",
|
|
280
|
+
"value": "600"
|
|
281
|
+
},
|
|
282
|
+
"kendo-font-weight-bold": {
|
|
283
|
+
"type": "Number",
|
|
284
|
+
"value": "700"
|
|
285
|
+
},
|
|
286
|
+
"kendo-font-weight-extra-bold": {
|
|
287
|
+
"type": "Number",
|
|
288
|
+
"value": "800"
|
|
289
|
+
},
|
|
290
|
+
"kendo-font-weight-black": {
|
|
291
|
+
"type": "Number",
|
|
292
|
+
"value": "900"
|
|
293
|
+
},
|
|
294
|
+
"kendo-letter-spacing": {
|
|
295
|
+
"type": "Null",
|
|
296
|
+
"value": "null"
|
|
297
|
+
},
|
|
298
|
+
"kendo-letter-spacing-tightest": {
|
|
299
|
+
"type": "Number",
|
|
300
|
+
"value": "-0.15px"
|
|
301
|
+
},
|
|
302
|
+
"kendo-letter-spacing-tighter": {
|
|
303
|
+
"type": "Number",
|
|
304
|
+
"value": "-0.1px"
|
|
305
|
+
},
|
|
306
|
+
"kendo-letter-spacing-tight": {
|
|
307
|
+
"type": "Number",
|
|
308
|
+
"value": "-0.5px"
|
|
309
|
+
},
|
|
310
|
+
"kendo-letter-spacing-normal": {
|
|
311
|
+
"type": "Number",
|
|
312
|
+
"value": "0px"
|
|
313
|
+
},
|
|
314
|
+
"kendo-letter-spacing-wide": {
|
|
315
|
+
"type": "Number",
|
|
316
|
+
"value": "0.5px"
|
|
317
|
+
},
|
|
318
|
+
"kendo-letter-spacing-wider": {
|
|
319
|
+
"type": "Number",
|
|
320
|
+
"value": "0.1px"
|
|
321
|
+
},
|
|
322
|
+
"kendo-letter-spacing-widest": {
|
|
323
|
+
"type": "Number",
|
|
324
|
+
"value": "0.15px"
|
|
325
|
+
},
|
|
326
|
+
"kendo-font-family-sans": {
|
|
327
|
+
"type": "List",
|
|
328
|
+
"value": "Arial, Verdana, Tahoma, \"Trebuchet MS\", Helvetica, Impact, Gill Sans"
|
|
329
|
+
},
|
|
330
|
+
"kendo-font-family-serif": {
|
|
331
|
+
"type": "List",
|
|
332
|
+
"value": "\"Times New Roman\", Georgia, Garamond, Palatino, Baskerville"
|
|
333
|
+
},
|
|
334
|
+
"kendo-font-family-sans-serif": {
|
|
335
|
+
"type": "List",
|
|
336
|
+
"value": "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\""
|
|
337
|
+
},
|
|
338
|
+
"kendo-font-family-monospace": {
|
|
339
|
+
"type": "List",
|
|
340
|
+
"value": "SFMono-Regular, Menlo, Monaco, Consolas, \"Roboto Mono\", \"Ubuntu Mono\", \"Lucida Console\", \"Courier New\", monospace"
|
|
341
|
+
},
|
|
342
|
+
"kendo-font-family": {
|
|
343
|
+
"type": "String",
|
|
344
|
+
"value": "inherit"
|
|
345
|
+
},
|
|
346
|
+
"kendo-font-sizes": {
|
|
347
|
+
"type": "Map",
|
|
348
|
+
"value": "(xxs: 0.5rem, xs: 0.625rem, sm: 0.75rem, md: 0.875rem, lg: 1rem, xl: 1.25rem)"
|
|
349
|
+
},
|
|
350
|
+
"kendo-line-heights": {
|
|
351
|
+
"type": "Map",
|
|
352
|
+
"value": "(xs: 1, sm: 1.25, md: 1.4285714286, lg: 1.5)"
|
|
353
|
+
},
|
|
354
|
+
"kendo-font-weights": {
|
|
355
|
+
"type": "Map",
|
|
356
|
+
"value": "(thin: 100, extra-light: 200, light: 300, normal: 400, medium: 500, semibold: 600, bold: 700)"
|
|
357
|
+
},
|
|
358
|
+
"kendo-letter-spacings": {
|
|
239
359
|
"type": "Map",
|
|
240
|
-
"value": "(
|
|
360
|
+
"value": "(tightest: -0.15px, tighter: -0.1px, tight: -0.5px, normal: 0px, wide: 0.5px, wider: 0.1px, widest: 0.15px)"
|
|
241
361
|
},
|
|
242
|
-
"kendo-
|
|
362
|
+
"kendo-font-families": {
|
|
363
|
+
"type": "Map",
|
|
364
|
+
"value": "(sans: (Arial, Verdana, Tahoma, \"Trebuchet MS\", Helvetica, Impact, Gill Sans), serif: (\"Times New Roman\", Georgia, Garamond, Palatino, Baskerville), 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\"), monospace: (SFMono-Regular, Menlo, Monaco, Consolas, \"Roboto Mono\", \"Ubuntu Mono\", \"Lucida Console\", \"Courier New\", monospace))"
|
|
365
|
+
},
|
|
366
|
+
"kendo-spacing": {
|
|
367
|
+
"type": "Map",
|
|
368
|
+
"value": "(0: 0px, 1px: 1px, 0.5: 0.125rem, 1: 0.25rem, 1.5: 0.375rem, 2: 0.5rem, 2.5: 0.625rem, 3: 0.75rem, 3.5: 0.875rem, 4: 1rem, 4.5: 1.125rem, 5: 1.25rem, 5.5: 1.375rem, 6: 1.5rem, 6.5: 1.625rem, 7: 1.75rem, 7.5: 1.875rem, 8: 2rem, 9: 2.25rem, 10: 2.5rem, 11: 2.75rem, 12: 3rem, 13: 3.25rem, 14: 3.5rem, 15: 3.75rem, 16: 4rem, 17: 4.25rem, 18: 4.5rem, 19: 4.75rem, 20: 5rem, 21: 5.25rem, 22: 5.5rem, 23: 5.75rem, 24: 6rem, 25: 7rem, 26: 8rem, 27: 9rem, 28: 10rem, 29: 11rem, 30: 12rem)"
|
|
369
|
+
},
|
|
370
|
+
"kendo-sizing": {
|
|
371
|
+
"type": "Map",
|
|
372
|
+
"value": "(0: 0px, 1px: 1px, 0.5: 0.125rem, 1: 0.25rem, 1.5: 0.375rem, 2: 0.5rem, 2.5: 0.625rem, 3: 0.75rem, 3.5: 0.875rem, 4: 1rem, 4.5: 1.125rem, 5: 1.25rem, 5.5: 1.375rem, 6: 1.5rem, 6.5: 1.625rem, 7: 1.75rem, 7.5: 1.875rem, 8: 2rem, 9: 2.25rem, 10: 2.5rem, 11: 2.75rem, 12: 3rem, 13: 3.25rem, 14: 3.5rem, 15: 3.75rem, 16: 4rem, 17: 4.25rem, 18: 4.5rem, 19: 4.75rem, 20: 5rem, 21: 5.25rem, 22: 5.5rem, 23: 5.75rem, 24: 6rem, 25: 7rem, 26: 8rem, 27: 9rem, 28: 10rem, 29: 11rem, 30: 12rem, \"auto\": auto, \"1/2\": 50%, \"1/3\": 33.333333%, \"2/3\": 66.666667%, \"1/4\": 25%, \"2/4\": 50%, \"3/4\": 75%, \"1/5\": 20%, \"2/5\": 40%, \"3/5\": 60%, \"4/5\": 80%, \"1/6\": 16.666667%, \"2/6\": 33.333333%, \"3/6\": 50%, \"4/6\": 66.666667%, \"5/6\": 83.333333%, \"1/12\": 8.333333%, \"2/12\": 16.666667%, \"3/12\": 25%, \"4/12\": 33.333333%, \"5/12\": 41.666667%, \"6/12\": 50%, \"7/12\": 58.333333%, \"8/12\": 66.666667%, \"9/12\": 75%, \"10/12\": 83.333333%, \"11/12\": 91.666667%, \"full\": 100%, \"min\": min-content, \"max\": max-content, \"fit\": fit-content)"
|
|
373
|
+
},
|
|
374
|
+
"kendo-border-radius-none": {
|
|
243
375
|
"type": "Number",
|
|
244
|
-
"value": "
|
|
376
|
+
"value": "0px"
|
|
245
377
|
},
|
|
246
|
-
"kendo-
|
|
378
|
+
"kendo-border-radius-xs": {
|
|
247
379
|
"type": "Number",
|
|
248
|
-
"value": "
|
|
380
|
+
"value": "1px"
|
|
381
|
+
},
|
|
382
|
+
"kendo-border-radius-sm": {
|
|
383
|
+
"type": "Number",
|
|
384
|
+
"value": "0.125rem"
|
|
249
385
|
},
|
|
250
|
-
"kendo-
|
|
386
|
+
"kendo-border-radius-md": {
|
|
251
387
|
"type": "Number",
|
|
252
388
|
"value": "0.25rem"
|
|
253
389
|
},
|
|
254
|
-
"kendo-
|
|
390
|
+
"kendo-border-radius-lg": {
|
|
255
391
|
"type": "Number",
|
|
256
|
-
"value": "0.
|
|
392
|
+
"value": "0.375rem"
|
|
257
393
|
},
|
|
258
|
-
"kendo-
|
|
394
|
+
"kendo-border-radius-xl": {
|
|
259
395
|
"type": "Number",
|
|
260
396
|
"value": "0.5rem"
|
|
261
397
|
},
|
|
262
|
-
"kendo-
|
|
398
|
+
"kendo-border-radius-xxl": {
|
|
263
399
|
"type": "Number",
|
|
264
|
-
"value": "0.
|
|
400
|
+
"value": "0.75rem"
|
|
265
401
|
},
|
|
266
|
-
"kendo-
|
|
402
|
+
"kendo-border-radius-xxxl": {
|
|
267
403
|
"type": "Number",
|
|
268
|
-
"value": "
|
|
404
|
+
"value": "1rem"
|
|
269
405
|
},
|
|
270
|
-
"kendo-
|
|
406
|
+
"kendo-border-radius-full": {
|
|
271
407
|
"type": "Number",
|
|
272
|
-
"value": "
|
|
408
|
+
"value": "9999px"
|
|
409
|
+
},
|
|
410
|
+
"kendo-border-radii": {
|
|
411
|
+
"type": "Map",
|
|
412
|
+
"value": "(none: 0px, xs: 1px, sm: 0.125rem, md: 0.25rem, lg: 0.375rem, xl: 0.5rem, xxl: 0.75rem, xxxl: 1rem, full: 9999px)"
|
|
413
|
+
},
|
|
414
|
+
"kendo-enable-shadows": {
|
|
415
|
+
"type": "Bool",
|
|
416
|
+
"value": "true"
|
|
417
|
+
},
|
|
418
|
+
"kendo-enable-rounded": {
|
|
419
|
+
"type": "Bool",
|
|
420
|
+
"value": "true"
|
|
421
|
+
},
|
|
422
|
+
"kendo-enable-gradients": {
|
|
423
|
+
"type": "Bool",
|
|
424
|
+
"value": "true"
|
|
425
|
+
},
|
|
426
|
+
"kendo-enable-transitions": {
|
|
427
|
+
"type": "Bool",
|
|
428
|
+
"value": "true"
|
|
273
429
|
},
|
|
274
430
|
"equilateral-index": {
|
|
275
431
|
"type": "Number",
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@progress/kendo-theme-core",
|
|
3
3
|
"description": "A collection of functions and mixins used for building themes for Kendo UI",
|
|
4
|
-
"version": "8.0.0-dev.
|
|
4
|
+
"version": "8.0.0-dev.10",
|
|
5
5
|
"author": "Progress",
|
|
6
6
|
"license": "Apache-2.0",
|
|
7
7
|
"keywords": [
|
|
@@ -44,5 +44,5 @@
|
|
|
44
44
|
"directories": {
|
|
45
45
|
"doc": "docs"
|
|
46
46
|
},
|
|
47
|
-
"gitHead": "
|
|
47
|
+
"gitHead": "586e93eb20d6ddbc481401a9eda9ed878ef4c3a1"
|
|
48
48
|
}
|
package/scss/_variables.scss
CHANGED
|
@@ -6,69 +6,6 @@ $kendo-enable-rounded: true !default;
|
|
|
6
6
|
$kendo-enable-gradients: true !default;
|
|
7
7
|
$kendo-enable-transitions: true !default;
|
|
8
8
|
|
|
9
|
-
$kendo-spacing: (
|
|
10
|
-
0: 0,
|
|
11
|
-
1px: 1px,
|
|
12
|
-
0.5: 0.125rem,
|
|
13
|
-
1: 0.25rem,
|
|
14
|
-
1.5: 0.375rem,
|
|
15
|
-
2: 0.5rem,
|
|
16
|
-
2.5: 0.625rem,
|
|
17
|
-
3: 0.75rem,
|
|
18
|
-
3.5: 0.875rem,
|
|
19
|
-
4: 1rem,
|
|
20
|
-
4.5: 1.125rem,
|
|
21
|
-
5: 1.25rem,
|
|
22
|
-
5.5: 1.375rem,
|
|
23
|
-
6: 1.5rem,
|
|
24
|
-
6.5: 1.625rem,
|
|
25
|
-
7: 1.75rem,
|
|
26
|
-
7.5: 1.875rem,
|
|
27
|
-
8: 2rem,
|
|
28
|
-
9: 2.25rem,
|
|
29
|
-
10: 2.5rem,
|
|
30
|
-
11: 2.75rem,
|
|
31
|
-
12: 3rem,
|
|
32
|
-
13: 3.25rem,
|
|
33
|
-
14: 3.5rem,
|
|
34
|
-
15: 3.75rem,
|
|
35
|
-
16: 4rem,
|
|
36
|
-
17: 4.25rem,
|
|
37
|
-
18: 4.5rem,
|
|
38
|
-
19: 4.75rem,
|
|
39
|
-
20: 5rem,
|
|
40
|
-
21: 5.25rem,
|
|
41
|
-
22: 5.5rem,
|
|
42
|
-
23: 5.75rem,
|
|
43
|
-
24: 6rem,
|
|
44
|
-
) !default;
|
|
45
|
-
|
|
46
|
-
/// Border radius for all components.
|
|
47
|
-
$kendo-border-radius: k-map-get($kendo-spacing, 0.5) !default;
|
|
48
|
-
$kendo-border-radius-sm: k-math-div($kendo-border-radius, 2) !default;
|
|
49
|
-
$kendo-border-radius-md: $kendo-border-radius !default;
|
|
50
|
-
$kendo-border-radius-lg: ($kendo-border-radius * 2) !default;
|
|
51
|
-
|
|
52
|
-
$kendo-border-radii: (
|
|
53
|
-
DEFAULT: var(--kendo-border-radius-md, $kendo-border-radius-md),
|
|
54
|
-
0: 0,
|
|
55
|
-
sm: var(--kendo-border-radius-sm, $kendo-border-radius-sm),
|
|
56
|
-
md: var(--kendo-border-radius-md, $kendo-border-radius-md),
|
|
57
|
-
lg: var(--kendo-border-radius-lg, $kendo-border-radius-lg),
|
|
58
|
-
none: 0,
|
|
59
|
-
full: 9999px,
|
|
60
|
-
) !default;
|
|
61
|
-
|
|
62
|
-
// Metrics
|
|
63
|
-
$kendo-padding-x: k-map-get($kendo-spacing, 2) !default;
|
|
64
|
-
$kendo-padding-y: k-map-get($kendo-spacing, 1) !default;
|
|
65
|
-
$kendo-padding-sm-x: k-map-get($kendo-spacing, 1) !default;
|
|
66
|
-
$kendo-padding-sm-y: k-map-get($kendo-spacing, 0.5) !default;
|
|
67
|
-
$kendo-padding-md-x: k-map-get($kendo-spacing, 2) !default;
|
|
68
|
-
$kendo-padding-md-y: k-map-get($kendo-spacing, 1) !default;
|
|
69
|
-
$kendo-padding-lg-x: k-map-get($kendo-spacing, 3) !default;
|
|
70
|
-
$kendo-padding-lg-y: k-map-get($kendo-spacing, 1.5) !default;
|
|
71
|
-
|
|
72
9
|
// Equilateral triangle variables
|
|
73
10
|
// stylelint-disable number-max-precision
|
|
74
11
|
$equilateral-index: 1.7320508076 !default;
|
|
@@ -77,4 +14,4 @@ $equilateral-height: 0.8660254038 !default;
|
|
|
77
14
|
|
|
78
15
|
// Loading
|
|
79
16
|
$kendo-loading-opacity: .3 !default;
|
|
80
|
-
$kendo-zindex-loading: 100 !default;
|
|
17
|
+
$kendo-zindex-loading: 100 !default;
|
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
/// The none border radius used across the Components.
|
|
2
|
+
/// @group radii
|
|
3
|
+
$kendo-border-radius-none: k-map-get($kendo-spacing, 0) !default;
|
|
4
|
+
/// The extra small border radius used across the Components.
|
|
5
|
+
/// @group radii
|
|
6
|
+
$kendo-border-radius-xs: k-map-get($kendo-spacing, 1px) !default;
|
|
7
|
+
/// The small border radius used across the Components.
|
|
8
|
+
/// @group radii
|
|
9
|
+
$kendo-border-radius-sm: k-map-get($kendo-spacing, 0.5) !default;
|
|
10
|
+
/// The medium border radius used across the Components.
|
|
11
|
+
/// @group radii
|
|
12
|
+
$kendo-border-radius-md: k-map-get($kendo-spacing, 1) !default;
|
|
13
|
+
/// The large border radius used across the Components.
|
|
14
|
+
/// @group radii
|
|
15
|
+
$kendo-border-radius-lg: k-map-get($kendo-spacing, 1.5) !default;
|
|
16
|
+
/// The extra large border radius used across the Components.
|
|
17
|
+
/// @group radii
|
|
18
|
+
$kendo-border-radius-xl: k-map-get($kendo-spacing, 2) !default;
|
|
19
|
+
/// The third largest border radius used across the Components.
|
|
20
|
+
/// @group radii
|
|
21
|
+
$kendo-border-radius-xxl: k-map-get($kendo-spacing, 3) !default;
|
|
22
|
+
/// The second largest border radius used across the Components.
|
|
23
|
+
/// @group radii
|
|
24
|
+
$kendo-border-radius-xxxl: k-map-get($kendo-spacing, 4) !default;
|
|
25
|
+
/// The largest border radius used across the Components.
|
|
26
|
+
/// @group radii
|
|
27
|
+
$kendo-border-radius-full: 9999px !default;
|
|
28
|
+
|
|
29
|
+
|
|
30
|
+
$_default-border-radii: (
|
|
31
|
+
none: $kendo-border-radius-none,
|
|
32
|
+
xs: $kendo-border-radius-xs,
|
|
33
|
+
sm: $kendo-border-radius-sm,
|
|
34
|
+
md: $kendo-border-radius-md,
|
|
35
|
+
lg: $kendo-border-radius-lg,
|
|
36
|
+
xl: $kendo-border-radius-xl,
|
|
37
|
+
xxl: $kendo-border-radius-xxl,
|
|
38
|
+
xxxl: $kendo-border-radius-xxxl,
|
|
39
|
+
full: $kendo-border-radius-full
|
|
40
|
+
|
|
41
|
+
) !default;
|
|
42
|
+
|
|
43
|
+
$kendo-border-radii: $_default-border-radii !default;
|
|
44
|
+
|
|
45
|
+
/// The global radii Map.
|
|
46
|
+
/// @group radii
|
|
47
|
+
$kendo-border-radii: k-map-merge($_default-border-radii, $kendo-border-radii);
|
|
48
|
+
|
|
49
|
+
|
|
50
|
+
@function k-border-radius($key) {
|
|
51
|
+
$_border-radius: k-map-get($kendo-border-radii, $key);
|
|
52
|
+
@return var(--kendo-border-radius-#{$key}, $_border-radius);
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
@mixin kendo-border-radius--styles() {
|
|
56
|
+
:root {
|
|
57
|
+
@each $key, $value in $kendo-border-radii {
|
|
58
|
+
--kendo-border-radius-#{$key}: #{$value};
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
}
|
package/scss/index.import.scss
CHANGED
|
@@ -4,4 +4,7 @@
|
|
|
4
4
|
@import "./module-system/index.import.scss";
|
|
5
5
|
@import "./styles/index.import.scss";
|
|
6
6
|
@import "./elevation/index.import.scss";
|
|
7
|
+
@import "./typography/index.import.scss";
|
|
8
|
+
@import "./spacing/index.import.scss";
|
|
9
|
+
@import "./border-radii/index.import.scss";
|
|
7
10
|
@import "./_variables.scss";
|
|
@@ -0,0 +1,101 @@
|
|
|
1
|
+
@import "../functions/index.import.scss";
|
|
2
|
+
|
|
3
|
+
$_default-spacing: (
|
|
4
|
+
0: 0px,
|
|
5
|
+
1px: 1px,
|
|
6
|
+
0.5: .125rem,
|
|
7
|
+
1: .25rem,
|
|
8
|
+
1.5: .375rem,
|
|
9
|
+
2: .5rem,
|
|
10
|
+
2.5: .625rem,
|
|
11
|
+
3: .75rem,
|
|
12
|
+
3.5: .875rem,
|
|
13
|
+
4: 1rem,
|
|
14
|
+
4.5: 1.125rem,
|
|
15
|
+
5: 1.25rem,
|
|
16
|
+
5.5: 1.375rem,
|
|
17
|
+
6: 1.5rem,
|
|
18
|
+
6.5: 1.625rem,
|
|
19
|
+
7: 1.75rem,
|
|
20
|
+
7.5: 1.875rem,
|
|
21
|
+
8: 2rem,
|
|
22
|
+
9: 2.25rem,
|
|
23
|
+
10: 2.5rem,
|
|
24
|
+
11: 2.75rem,
|
|
25
|
+
12: 3rem,
|
|
26
|
+
13: 3.25rem,
|
|
27
|
+
14: 3.5rem,
|
|
28
|
+
15: 3.75rem,
|
|
29
|
+
16: 4rem,
|
|
30
|
+
17: 4.25rem,
|
|
31
|
+
18: 4.5rem,
|
|
32
|
+
19: 4.75rem,
|
|
33
|
+
20: 5rem,
|
|
34
|
+
21: 5.25rem,
|
|
35
|
+
22: 5.5rem,
|
|
36
|
+
23: 5.75rem,
|
|
37
|
+
24: 6rem,
|
|
38
|
+
25: 7rem,
|
|
39
|
+
26: 8rem,
|
|
40
|
+
27: 9rem,
|
|
41
|
+
28: 10rem,
|
|
42
|
+
29: 11rem,
|
|
43
|
+
30: 12rem
|
|
44
|
+
) !default;
|
|
45
|
+
|
|
46
|
+
/// The global default Spacing map.
|
|
47
|
+
/// @group spacing
|
|
48
|
+
$kendo-spacing: $_default-spacing !default;
|
|
49
|
+
|
|
50
|
+
$kendo-spacing: k-map-merge($_default-spacing, $kendo-spacing);
|
|
51
|
+
|
|
52
|
+
|
|
53
|
+
@function k-spacing($step) {
|
|
54
|
+
$spacing: k-map-get($kendo-spacing, $step);
|
|
55
|
+
$_step: k-escape-class-name( $step );
|
|
56
|
+
@return var(--kendo-spacing-#{$_step}, #{$spacing});
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
// Generate a CSS variable for each value in the Spacing map
|
|
60
|
+
@mixin kendo-spacing--styles() {
|
|
61
|
+
:root {
|
|
62
|
+
@each $step, $spacing in $kendo-spacing {
|
|
63
|
+
$_step: k-escape-class-name( $step );
|
|
64
|
+
--kendo-spacing-#{$_step}: #{$spacing};
|
|
65
|
+
}
|
|
66
|
+
}
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
$kendo-sizing: k-map-merge( $kendo-spacing, (
|
|
70
|
+
"auto": auto,
|
|
71
|
+
"1/2": 50%,
|
|
72
|
+
"1/3": 33.333333%,
|
|
73
|
+
"2/3": 66.666667%,
|
|
74
|
+
"1/4": 25%,
|
|
75
|
+
"2/4": 50%,
|
|
76
|
+
"3/4": 75%,
|
|
77
|
+
"1/5": 20%,
|
|
78
|
+
"2/5": 40%,
|
|
79
|
+
"3/5": 60%,
|
|
80
|
+
"4/5": 80%,
|
|
81
|
+
"1/6": 16.666667%,
|
|
82
|
+
"2/6": 33.333333%,
|
|
83
|
+
"3/6": 50%,
|
|
84
|
+
"4/6": 66.666667%,
|
|
85
|
+
"5/6": 83.333333%,
|
|
86
|
+
"1/12": 8.333333%,
|
|
87
|
+
"2/12": 16.666667%,
|
|
88
|
+
"3/12": 25%,
|
|
89
|
+
"4/12": 33.333333%,
|
|
90
|
+
"5/12": 41.666667%,
|
|
91
|
+
"6/12": 50%,
|
|
92
|
+
"7/12": 58.333333%,
|
|
93
|
+
"8/12": 66.666667%,
|
|
94
|
+
"9/12": 75%,
|
|
95
|
+
"10/12": 83.333333%,
|
|
96
|
+
"11/12": 91.666667%,
|
|
97
|
+
"full": 100%,
|
|
98
|
+
"min": min-content,
|
|
99
|
+
"max": max-content,
|
|
100
|
+
"fit": fit-content
|
|
101
|
+
)) !default;
|
package/scss/styles/_base.scss
CHANGED
|
@@ -16,7 +16,7 @@
|
|
|
16
16
|
|
|
17
17
|
// Horizontal line
|
|
18
18
|
.k-hr {
|
|
19
|
-
margin-block: k-
|
|
19
|
+
margin-block: k-spacing(4);
|
|
20
20
|
padding: 0;
|
|
21
21
|
height: 0;
|
|
22
22
|
border-width: 1px 0 0;
|
|
@@ -130,4 +130,4 @@
|
|
|
130
130
|
inset-block-start: 0;
|
|
131
131
|
inset-inline-end: 0;
|
|
132
132
|
}
|
|
133
|
-
}
|
|
133
|
+
}
|
package/scss/styles/_layout.scss
CHANGED
|
@@ -1,19 +1,4 @@
|
|
|
1
1
|
@mixin kendo-core--styles--layout() {
|
|
2
|
-
.k-body {
|
|
3
|
-
@include typography(
|
|
4
|
-
var( --kendo-font-size, inherit ),
|
|
5
|
-
var( --kendo-font-family, inherit ),
|
|
6
|
-
var( --kendo-line-height, normal ),
|
|
7
|
-
var( --kendo-font-weight, normal ),
|
|
8
|
-
var( --kendo-letter-spacing, normal ),
|
|
9
|
-
);
|
|
10
|
-
@include fill(
|
|
11
|
-
var( --kendo-body-text, initial ),
|
|
12
|
-
var( --kendo-body-bg, initial )
|
|
13
|
-
);
|
|
14
|
-
margin: 0;
|
|
15
|
-
}
|
|
16
|
-
|
|
17
2
|
// Basic layout
|
|
18
3
|
.k-hstack {
|
|
19
4
|
display: flex;
|