@progress/kendo-theme-fluent 13.2.0-dev.2 → 13.2.0-dev.4
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 -1
- package/dist/fluent-1-dark.css +1 -1
- package/dist/fluent-1-dark.scss +0 -20
- package/dist/fluent-1.css +1 -1
- package/dist/fluent-1.scss +0 -20
- package/dist/fluent-main-dark.css +1 -1
- package/dist/fluent-main-dark.scss +0 -20
- package/dist/fluent-main.css +1 -1
- package/dist/meta/sassdoc-data.json +976 -1968
- package/dist/meta/sassdoc-raw-data.json +447 -866
- package/dist/meta/variables.json +48 -167
- package/lib/swatches/all.json +1 -1
- package/lib/swatches/fluent-1-dark.json +1 -101
- package/lib/swatches/fluent-1.json +1 -101
- package/lib/swatches/fluent-main-dark.json +1 -101
- package/lib/swatches/fluent-main.json +1 -1
- package/package.json +4 -4
- package/scss/adaptive/_variables.scss +3 -3
- package/scss/appbar/_variables.scss +1 -19
- package/scss/bottom-navigation/_theme.scss +1 -1
- package/scss/button/_theme.scss +0 -16
- package/scss/card/_variables.scss +0 -6
- package/scss/chat/_variables.scss +1 -1
- package/scss/checkbox/_variables.scss +2 -2
- package/scss/column-menu/_variables.scss +1 -1
- package/scss/core/color-system/_swatch.scss +0 -56
- package/scss/dialog/_variables.scss +0 -6
- package/scss/dock-manager/_variables.scss +1 -1
- package/scss/editor/_variables.scss +1 -1
- package/scss/fab/_theme.scss +2 -3
- package/scss/filter/_variables.scss +1 -1
- package/scss/gantt/_variables.scss +1 -1
- package/scss/grid/_theme.scss +4 -25
- package/scss/icons/_variables.scss +5 -1
- package/scss/messagebox/_variables.scss +2 -2
- package/scss/notification/_variables.scss +1 -1
- package/scss/overlay/_variables.scss +4 -8
- package/scss/radio/_variables.scss +2 -2
- package/scss/scrollview/_theme.scss +0 -16
- package/scss/scrollview/_variables.scss +2 -0
- package/scss/searchbox/_variables.scss +1 -1
- package/scss/spreadsheet/_variables.scss +1 -1
- package/scss/switch/_variables.scss +4 -4
- package/scss/tooltip/_functions.scss +1 -1
- package/scss/tooltip/_variables.scss +1 -1
- package/scss/treeview/_variables.scss +2 -2
- package/scss/window/_variables.scss +0 -6
package/lib/swatches/all.json
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
"name": "Fluent 1 Dark",
|
|
4
4
|
"product": "kendo",
|
|
5
5
|
"base": "@progress/kendo-theme-fluent",
|
|
6
|
-
"version": "13.2.0-dev.
|
|
6
|
+
"version": "13.2.0-dev.4",
|
|
7
7
|
"previewColors": [
|
|
8
8
|
"oklch(21.85% 0.0025 67.57deg)",
|
|
9
9
|
"oklch(24.42% 0.0024 67.57deg)",
|
|
@@ -451,106 +451,6 @@
|
|
|
451
451
|
"type": "color",
|
|
452
452
|
"value": "oklch(79.73% 0.1074 15.39deg)"
|
|
453
453
|
},
|
|
454
|
-
"light-subtle": {
|
|
455
|
-
"name": "Light Subtle",
|
|
456
|
-
"type": "color",
|
|
457
|
-
"value": "oklch(89.19% 0.0016 66.99deg)"
|
|
458
|
-
},
|
|
459
|
-
"light-subtle-hover": {
|
|
460
|
-
"name": "Light Subtle Hover",
|
|
461
|
-
"type": "color",
|
|
462
|
-
"value": "oklch(82.87% 0.0036 38.40deg)"
|
|
463
|
-
},
|
|
464
|
-
"light-subtle-active": {
|
|
465
|
-
"name": "Light Subtle Active",
|
|
466
|
-
"type": "color",
|
|
467
|
-
"value": "oklch(76.49% 0.0026 47.63deg)"
|
|
468
|
-
},
|
|
469
|
-
"light": {
|
|
470
|
-
"name": "Light",
|
|
471
|
-
"type": "color",
|
|
472
|
-
"value": "oklch(98.26% 0.0016 66.88deg)"
|
|
473
|
-
},
|
|
474
|
-
"light-hover": {
|
|
475
|
-
"name": "Light Hover",
|
|
476
|
-
"type": "color",
|
|
477
|
-
"value": "oklch(96.16% 0.0016 66.90deg)"
|
|
478
|
-
},
|
|
479
|
-
"light-active": {
|
|
480
|
-
"name": "Light Active",
|
|
481
|
-
"type": "color",
|
|
482
|
-
"value": "oklch(89.19% 0.0016 66.99deg)"
|
|
483
|
-
},
|
|
484
|
-
"light-emphasis": {
|
|
485
|
-
"name": "Light Emphasis",
|
|
486
|
-
"type": "color",
|
|
487
|
-
"value": "oklch(96.16% 0.0016 66.90deg)"
|
|
488
|
-
},
|
|
489
|
-
"light-on-subtle": {
|
|
490
|
-
"name": "Light On Subtle",
|
|
491
|
-
"type": "color",
|
|
492
|
-
"value": "oklch(21.85% 0.0025 67.57deg)"
|
|
493
|
-
},
|
|
494
|
-
"on-light": {
|
|
495
|
-
"name": "On Light",
|
|
496
|
-
"type": "color",
|
|
497
|
-
"value": "oklch(21.85% 0.0025 67.57deg)"
|
|
498
|
-
},
|
|
499
|
-
"light-on-surface": {
|
|
500
|
-
"name": "Light On Surface",
|
|
501
|
-
"type": "color",
|
|
502
|
-
"value": "oklch(96.16% 0.0016 66.90deg)"
|
|
503
|
-
},
|
|
504
|
-
"dark-subtle": {
|
|
505
|
-
"name": "Dark Subtle",
|
|
506
|
-
"type": "color",
|
|
507
|
-
"value": "oklch(24.42% 0.0024 67.57deg)"
|
|
508
|
-
},
|
|
509
|
-
"dark-subtle-hover": {
|
|
510
|
-
"name": "Dark Subtle Hover",
|
|
511
|
-
"type": "color",
|
|
512
|
-
"value": "oklch(26.10% 0.0023 67.56deg)"
|
|
513
|
-
},
|
|
514
|
-
"dark-subtle-active": {
|
|
515
|
-
"name": "Dark Subtle Active",
|
|
516
|
-
"type": "color",
|
|
517
|
-
"value": "oklch(27.75% 0.0023 67.56deg)"
|
|
518
|
-
},
|
|
519
|
-
"dark": {
|
|
520
|
-
"name": "Dark",
|
|
521
|
-
"type": "color",
|
|
522
|
-
"value": "oklch(34.91% 0.0022 67.52deg)"
|
|
523
|
-
},
|
|
524
|
-
"dark-hover": {
|
|
525
|
-
"name": "Dark Hover",
|
|
526
|
-
"type": "color",
|
|
527
|
-
"value": "oklch(41.81% 0.0031 48.16deg)"
|
|
528
|
-
},
|
|
529
|
-
"dark-active": {
|
|
530
|
-
"name": "Dark Active",
|
|
531
|
-
"type": "color",
|
|
532
|
-
"value": "oklch(50.09% 0.0040 67.55deg)"
|
|
533
|
-
},
|
|
534
|
-
"dark-emphasis": {
|
|
535
|
-
"name": "Dark Emphasis",
|
|
536
|
-
"type": "color",
|
|
537
|
-
"value": "oklch(30.98% 0.0022 67.54deg)"
|
|
538
|
-
},
|
|
539
|
-
"dark-on-subtle": {
|
|
540
|
-
"name": "Dark On Subtle",
|
|
541
|
-
"type": "color",
|
|
542
|
-
"value": "oklch(76.49% 0.0026 47.63deg)"
|
|
543
|
-
},
|
|
544
|
-
"on-dark": {
|
|
545
|
-
"name": "On Dark",
|
|
546
|
-
"type": "color",
|
|
547
|
-
"value": "oklch(96.16% 0.0016 66.90deg)"
|
|
548
|
-
},
|
|
549
|
-
"dark-on-surface": {
|
|
550
|
-
"name": "Dark On Surface",
|
|
551
|
-
"type": "color",
|
|
552
|
-
"value": "oklch(50.09% 0.0040 67.55deg)"
|
|
553
|
-
},
|
|
554
454
|
"inverse-subtle": {
|
|
555
455
|
"name": "Inverse Subtle",
|
|
556
456
|
"type": "color",
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
"name": "Fluent 1",
|
|
4
4
|
"product": "kendo",
|
|
5
5
|
"base": "@progress/kendo-theme-fluent",
|
|
6
|
-
"version": "13.2.0-dev.
|
|
6
|
+
"version": "13.2.0-dev.4",
|
|
7
7
|
"previewColors": [
|
|
8
8
|
"oklch(100.00% 0.0001 0deg)",
|
|
9
9
|
"oklch(98.26% 0.0016 66.88deg)",
|
|
@@ -451,106 +451,6 @@
|
|
|
451
451
|
"type": "color",
|
|
452
452
|
"value": "oklch(47.54% 0.1618 23.65deg)"
|
|
453
453
|
},
|
|
454
|
-
"light-subtle": {
|
|
455
|
-
"name": "Light Subtle",
|
|
456
|
-
"type": "color",
|
|
457
|
-
"value": "oklch(98.26% 0.0016 66.88deg)"
|
|
458
|
-
},
|
|
459
|
-
"light-subtle-hover": {
|
|
460
|
-
"name": "Light Subtle Hover",
|
|
461
|
-
"type": "color",
|
|
462
|
-
"value": "oklch(96.16% 0.0016 66.90deg)"
|
|
463
|
-
},
|
|
464
|
-
"light-subtle-active": {
|
|
465
|
-
"name": "Light Subtle Active",
|
|
466
|
-
"type": "color",
|
|
467
|
-
"value": "oklch(94.11% 0.0033 67.36deg)"
|
|
468
|
-
},
|
|
469
|
-
"light": {
|
|
470
|
-
"name": "Light",
|
|
471
|
-
"type": "color",
|
|
472
|
-
"value": "oklch(85.86% 0.0034 67.41deg)"
|
|
473
|
-
},
|
|
474
|
-
"light-hover": {
|
|
475
|
-
"name": "Light Hover",
|
|
476
|
-
"type": "color",
|
|
477
|
-
"value": "oklch(82.76% 0.0035 67.42deg)"
|
|
478
|
-
},
|
|
479
|
-
"light-active": {
|
|
480
|
-
"name": "Light Active",
|
|
481
|
-
"type": "color",
|
|
482
|
-
"value": "oklch(70.36% 0.0036 67.48deg)"
|
|
483
|
-
},
|
|
484
|
-
"light-emphasis": {
|
|
485
|
-
"name": "Light Emphasis",
|
|
486
|
-
"type": "color",
|
|
487
|
-
"value": "oklch(90.46% 0.0034 67.38deg)"
|
|
488
|
-
},
|
|
489
|
-
"light-on-subtle": {
|
|
490
|
-
"name": "Light On Subtle",
|
|
491
|
-
"type": "color",
|
|
492
|
-
"value": "oklch(31.38% 0.0022 67.54deg)"
|
|
493
|
-
},
|
|
494
|
-
"on-light": {
|
|
495
|
-
"name": "On Light",
|
|
496
|
-
"type": "color",
|
|
497
|
-
"value": "oklch(31.38% 0.0022 67.54deg)"
|
|
498
|
-
},
|
|
499
|
-
"light-on-surface": {
|
|
500
|
-
"name": "Light On Surface",
|
|
501
|
-
"type": "color",
|
|
502
|
-
"value": "oklch(85.86% 0.0034 67.41deg)"
|
|
503
|
-
},
|
|
504
|
-
"dark-subtle": {
|
|
505
|
-
"name": "Dark Subtle",
|
|
506
|
-
"type": "color",
|
|
507
|
-
"value": "oklch(70.36% 0.0036 67.48deg)"
|
|
508
|
-
},
|
|
509
|
-
"dark-subtle-hover": {
|
|
510
|
-
"name": "Dark Subtle Hover",
|
|
511
|
-
"type": "color",
|
|
512
|
-
"value": "oklch(67.09% 0.0037 67.49deg)"
|
|
513
|
-
},
|
|
514
|
-
"dark-subtle-active": {
|
|
515
|
-
"name": "Dark Subtle Active",
|
|
516
|
-
"type": "color",
|
|
517
|
-
"value": "oklch(62.78% 0.0037 67.51deg)"
|
|
518
|
-
},
|
|
519
|
-
"dark": {
|
|
520
|
-
"name": "Dark",
|
|
521
|
-
"type": "color",
|
|
522
|
-
"value": "oklch(31.38% 0.0022 67.54deg)"
|
|
523
|
-
},
|
|
524
|
-
"dark-hover": {
|
|
525
|
-
"name": "Dark Hover",
|
|
526
|
-
"type": "color",
|
|
527
|
-
"value": "oklch(24.00% 0.0024 67.57deg)"
|
|
528
|
-
},
|
|
529
|
-
"dark-active": {
|
|
530
|
-
"name": "Dark Active",
|
|
531
|
-
"type": "color",
|
|
532
|
-
"value": "oklch(0.00% 0.0000 0deg)"
|
|
533
|
-
},
|
|
534
|
-
"dark-emphasis": {
|
|
535
|
-
"name": "Dark Emphasis",
|
|
536
|
-
"type": "color",
|
|
537
|
-
"value": "oklch(57.04% 0.0038 67.53deg)"
|
|
538
|
-
},
|
|
539
|
-
"dark-on-subtle": {
|
|
540
|
-
"name": "Dark On Subtle",
|
|
541
|
-
"type": "color",
|
|
542
|
-
"value": "oklch(24.00% 0.0024 67.57deg)"
|
|
543
|
-
},
|
|
544
|
-
"on-dark": {
|
|
545
|
-
"name": "On Dark",
|
|
546
|
-
"type": "color",
|
|
547
|
-
"value": "oklch(100.00% 0.0001 0deg)"
|
|
548
|
-
},
|
|
549
|
-
"dark-on-surface": {
|
|
550
|
-
"name": "Dark On Surface",
|
|
551
|
-
"type": "color",
|
|
552
|
-
"value": "oklch(31.38% 0.0022 67.54deg)"
|
|
553
|
-
},
|
|
554
454
|
"inverse-subtle": {
|
|
555
455
|
"name": "Inverse Subtle",
|
|
556
456
|
"type": "color",
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
"name": "Fluent Main Dark",
|
|
4
4
|
"product": "kendo",
|
|
5
5
|
"base": "@progress/kendo-theme-fluent",
|
|
6
|
-
"version": "13.2.0-dev.
|
|
6
|
+
"version": "13.2.0-dev.4",
|
|
7
7
|
"previewColors": [
|
|
8
8
|
"oklch(23.93% 0.0000 0deg)",
|
|
9
9
|
"oklch(28.09% 0.0000 0deg)",
|
|
@@ -451,106 +451,6 @@
|
|
|
451
451
|
"type": "color",
|
|
452
452
|
"value": "oklch(80.80% 0.0779 12.85deg)"
|
|
453
453
|
},
|
|
454
|
-
"light-subtle": {
|
|
455
|
-
"name": "Light Subtle",
|
|
456
|
-
"type": "color",
|
|
457
|
-
"value": "oklch(74.76% 0.0001 0deg)"
|
|
458
|
-
},
|
|
459
|
-
"light-subtle-hover": {
|
|
460
|
-
"name": "Light Subtle Hover",
|
|
461
|
-
"type": "color",
|
|
462
|
-
"value": "oklch(68.30% 0.0001 0deg)"
|
|
463
|
-
},
|
|
464
|
-
"light-subtle-active": {
|
|
465
|
-
"name": "Light Subtle Active",
|
|
466
|
-
"type": "color",
|
|
467
|
-
"value": "oklch(56.24% 0.0001 0deg)"
|
|
468
|
-
},
|
|
469
|
-
"light": {
|
|
470
|
-
"name": "Light",
|
|
471
|
-
"type": "color",
|
|
472
|
-
"value": "oklch(87.61% 0.0001 0deg)"
|
|
473
|
-
},
|
|
474
|
-
"light-hover": {
|
|
475
|
-
"name": "Light Hover",
|
|
476
|
-
"type": "color",
|
|
477
|
-
"value": "oklch(74.76% 0.0001 0deg)"
|
|
478
|
-
},
|
|
479
|
-
"light-active": {
|
|
480
|
-
"name": "Light Active",
|
|
481
|
-
"type": "color",
|
|
482
|
-
"value": "oklch(68.30% 0.0001 0deg)"
|
|
483
|
-
},
|
|
484
|
-
"light-emphasis": {
|
|
485
|
-
"name": "Light Emphasis",
|
|
486
|
-
"type": "color",
|
|
487
|
-
"value": "oklch(43.86% 0.0001 0deg)"
|
|
488
|
-
},
|
|
489
|
-
"light-on-subtle": {
|
|
490
|
-
"name": "Light On Subtle",
|
|
491
|
-
"type": "color",
|
|
492
|
-
"value": "oklch(28.09% 0.0000 0deg)"
|
|
493
|
-
},
|
|
494
|
-
"on-light": {
|
|
495
|
-
"name": "On Light",
|
|
496
|
-
"type": "color",
|
|
497
|
-
"value": "oklch(28.09% 0.0000 0deg)"
|
|
498
|
-
},
|
|
499
|
-
"light-on-surface": {
|
|
500
|
-
"name": "Light On Surface",
|
|
501
|
-
"type": "color",
|
|
502
|
-
"value": "oklch(74.76% 0.0001 0deg)"
|
|
503
|
-
},
|
|
504
|
-
"dark-subtle": {
|
|
505
|
-
"name": "Dark Subtle",
|
|
506
|
-
"type": "color",
|
|
507
|
-
"value": "oklch(16.84% 0.0000 0deg)"
|
|
508
|
-
},
|
|
509
|
-
"dark-subtle-hover": {
|
|
510
|
-
"name": "Dark Subtle Hover",
|
|
511
|
-
"type": "color",
|
|
512
|
-
"value": "oklch(21.78% 0.0000 0deg)"
|
|
513
|
-
},
|
|
514
|
-
"dark-subtle-active": {
|
|
515
|
-
"name": "Dark Subtle Active",
|
|
516
|
-
"type": "color",
|
|
517
|
-
"value": "oklch(26.03% 0.0000 0deg)"
|
|
518
|
-
},
|
|
519
|
-
"dark": {
|
|
520
|
-
"name": "Dark",
|
|
521
|
-
"type": "color",
|
|
522
|
-
"value": "oklch(28.09% 0.0000 0deg)"
|
|
523
|
-
},
|
|
524
|
-
"dark-hover": {
|
|
525
|
-
"name": "Dark Hover",
|
|
526
|
-
"type": "color",
|
|
527
|
-
"value": "oklch(36.00% 0.0000 0deg)"
|
|
528
|
-
},
|
|
529
|
-
"dark-active": {
|
|
530
|
-
"name": "Dark Active",
|
|
531
|
-
"type": "color",
|
|
532
|
-
"value": "oklch(34.07% 0.0000 0deg)"
|
|
533
|
-
},
|
|
534
|
-
"dark-emphasis": {
|
|
535
|
-
"name": "Dark Emphasis",
|
|
536
|
-
"type": "color",
|
|
537
|
-
"value": "oklch(43.86% 0.0001 0deg)"
|
|
538
|
-
},
|
|
539
|
-
"dark-on-subtle": {
|
|
540
|
-
"name": "Dark On Subtle",
|
|
541
|
-
"type": "color",
|
|
542
|
-
"value": "oklch(74.76% 0.0001 0deg)"
|
|
543
|
-
},
|
|
544
|
-
"on-dark": {
|
|
545
|
-
"name": "On Dark",
|
|
546
|
-
"type": "color",
|
|
547
|
-
"value": "oklch(100.00% 0.0001 0deg)"
|
|
548
|
-
},
|
|
549
|
-
"dark-on-surface": {
|
|
550
|
-
"name": "Dark On Surface",
|
|
551
|
-
"type": "color",
|
|
552
|
-
"value": "oklch(28.09% 0.0000 0deg)"
|
|
553
|
-
},
|
|
554
454
|
"inverse-subtle": {
|
|
555
455
|
"name": "Inverse Subtle",
|
|
556
456
|
"type": "color",
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@progress/kendo-theme-fluent",
|
|
3
3
|
"description": "A css variables based theme for Kendo UI that follows the Fluent design system guidelines.",
|
|
4
|
-
"version": "13.2.0-dev.
|
|
4
|
+
"version": "13.2.0-dev.4",
|
|
5
5
|
"author": "Progress",
|
|
6
6
|
"license": "Apache-2.0",
|
|
7
7
|
"keywords": [
|
|
@@ -55,12 +55,12 @@
|
|
|
55
55
|
},
|
|
56
56
|
"dependencies": {
|
|
57
57
|
"@progress/kendo-svg-icons": "^4.8.0",
|
|
58
|
-
"@progress/kendo-theme-core": "13.2.0-dev.
|
|
59
|
-
"@progress/kendo-theme-utils": "13.2.0-dev.
|
|
58
|
+
"@progress/kendo-theme-core": "13.2.0-dev.4",
|
|
59
|
+
"@progress/kendo-theme-utils": "13.2.0-dev.4"
|
|
60
60
|
},
|
|
61
61
|
"directories": {
|
|
62
62
|
"doc": "docs",
|
|
63
63
|
"lib": "lib"
|
|
64
64
|
},
|
|
65
|
-
"gitHead": "
|
|
65
|
+
"gitHead": "7368a47b22d3a917d55b6f022728aee002b3125a"
|
|
66
66
|
}
|
|
@@ -28,7 +28,7 @@ $kendo-adaptive-menu-text: var( --kendo-adaptive-menu-text, #{k-color(app-surfac
|
|
|
28
28
|
|
|
29
29
|
/// The text color of the Adaptive menu clear button.
|
|
30
30
|
/// @group adaptive
|
|
31
|
-
$kendo-adaptive-menu-clear-text: var( --kendo-adaptive-menu-clear-text, #{k-color(primary)} ) !default;
|
|
31
|
+
$kendo-adaptive-menu-clear-text: var( --kendo-adaptive-menu-clear-text, #{k-color(primary-on-surface)} ) !default;
|
|
32
32
|
|
|
33
33
|
/// The border color of the Adaptive menu item.
|
|
34
34
|
/// @group adaptive
|
|
@@ -54,13 +54,13 @@ $kendo-adaptive-line-height: var( --kendo-adaptive-line-height, var(--kendo-line
|
|
|
54
54
|
// Adaptive Grid
|
|
55
55
|
/// The text color of the Adaptive Grid sort indicator.
|
|
56
56
|
/// @group adaptive
|
|
57
|
-
$kendo-adaptive-grid-sort-text: var( --kendo-adaptive-grid-sort-text, #{k-color(primary)} ) !default;
|
|
57
|
+
$kendo-adaptive-grid-sort-text: var( --kendo-adaptive-grid-sort-text, #{k-color(primary-on-surface)} ) !default;
|
|
58
58
|
|
|
59
59
|
|
|
60
60
|
// Adaptive Scheduler
|
|
61
61
|
/// The text color of the current date in the Adaptive Scheduler.
|
|
62
62
|
/// @group adaptive
|
|
63
|
-
$kendo-adaptive-scheduler-current-text: var( --kendo-adaptive-scheduler-current-text, #{k-color(primary)} ) !default;
|
|
63
|
+
$kendo-adaptive-scheduler-current-text: var( --kendo-adaptive-scheduler-current-text, #{k-color(primary-on-surface)} ) !default;
|
|
64
64
|
/// The base text color of the Adaptive Scheduler.
|
|
65
65
|
/// @group adaptive
|
|
66
66
|
$kendo-adaptive-scheduler-base-text: var( --kendo-adaptive-scheduler-base-text, inherit ) !default;
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
/// The default theme color of the AppBar.
|
|
6
6
|
/// @group appbar
|
|
7
7
|
/// @role default
|
|
8
|
-
$kendo-appbar-default-theme-color: "
|
|
8
|
+
$kendo-appbar-default-theme-color: "base" !default;
|
|
9
9
|
|
|
10
10
|
/// The horizontal margin of the AppBar.
|
|
11
11
|
/// @group appbar
|
|
@@ -49,20 +49,6 @@ $kendo-appbar-bg: var( --kendo-appbar-bg, k-color(surface) ) !default;
|
|
|
49
49
|
/// @group appbar
|
|
50
50
|
$kendo-appbar-border: var( --kendo-appbar-border, color-mix(in srgb, k-color(border) 26%, transparent) ) !default;
|
|
51
51
|
|
|
52
|
-
/// The background color of the AppBar based on light theme color.
|
|
53
|
-
/// @group appbar
|
|
54
|
-
$kendo-appbar-light-bg: k-color(light) !default;
|
|
55
|
-
/// The text color of the AppBar based on light theme color.
|
|
56
|
-
/// @group appbar
|
|
57
|
-
$kendo-appbar-light-text: k-color(on-light) !default;
|
|
58
|
-
|
|
59
|
-
/// The background color of the AppBar based on dark theme color.
|
|
60
|
-
/// @group appbar
|
|
61
|
-
$kendo-appbar-dark-bg: k-color(dark) !default;
|
|
62
|
-
/// The text color of the AppBar based on dark theme color.
|
|
63
|
-
/// @group appbar
|
|
64
|
-
$kendo-appbar-dark-text: k-color(on-dark) !default;
|
|
65
|
-
|
|
66
52
|
@forward "@progress/kendo-theme-core/scss/components/appbar/_variables.scss" with (
|
|
67
53
|
$kendo-appbar-margin-x: $kendo-appbar-margin-x,
|
|
68
54
|
$kendo-appbar-margin-y: $kendo-appbar-margin-y,
|
|
@@ -74,9 +60,5 @@ $kendo-appbar-dark-text: k-color(on-dark) !default;
|
|
|
74
60
|
$kendo-appbar-font-size: $kendo-appbar-font-size,
|
|
75
61
|
$kendo-appbar-line-height: $kendo-appbar-line-height,
|
|
76
62
|
$kendo-appbar-gap: $kendo-appbar-spacing,
|
|
77
|
-
$kendo-appbar-light-bg: $kendo-appbar-light-bg,
|
|
78
|
-
$kendo-appbar-dark-bg: $kendo-appbar-dark-bg,
|
|
79
|
-
$kendo-appbar-light-text: $kendo-appbar-light-text,
|
|
80
|
-
$kendo-appbar-dark-text: $kendo-appbar-dark-text,
|
|
81
63
|
$kendo-appbar-default-theme-color: $kendo-appbar-default-theme-color
|
|
82
64
|
);
|
|
@@ -60,7 +60,7 @@
|
|
|
60
60
|
background-color: k-color(app-surface);
|
|
61
61
|
border-color: color-mix(in srgb, k-color(border) 16%, transparent);
|
|
62
62
|
|
|
63
|
-
@if ($name == "warning" or $name == "
|
|
63
|
+
@if ($name == "warning" or $name == "inverse") {
|
|
64
64
|
border-color: k-color(#{$name});
|
|
65
65
|
}
|
|
66
66
|
|
package/scss/button/_theme.scss
CHANGED
|
@@ -169,22 +169,6 @@
|
|
|
169
169
|
}
|
|
170
170
|
}
|
|
171
171
|
}
|
|
172
|
-
|
|
173
|
-
@if($theme-color == "light") {
|
|
174
|
-
#{k-when-default($kendo-button-default-fill-mode, ("outline", "flat", "clear", "link"))}
|
|
175
|
-
&.k-button-outline,
|
|
176
|
-
&.k-button-flat,
|
|
177
|
-
&.k-button-clear,
|
|
178
|
-
&.k-button-link {
|
|
179
|
-
#{k-when-default($kendo-button-default-theme-color, $theme-color)}
|
|
180
|
-
&.k-button-#{$theme-color} {
|
|
181
|
-
&:focus,
|
|
182
|
-
&.k-focus {
|
|
183
|
-
outline-color: k-color(light-on-surface);
|
|
184
|
-
}
|
|
185
|
-
}
|
|
186
|
-
}
|
|
187
|
-
}
|
|
188
172
|
}
|
|
189
173
|
}
|
|
190
174
|
|
|
@@ -2,11 +2,6 @@
|
|
|
2
2
|
@use "../core/_index.scss" as *;
|
|
3
3
|
@use "../button/_variables.scss" as *;
|
|
4
4
|
|
|
5
|
-
/// The default theme color of the Card.
|
|
6
|
-
/// @role default
|
|
7
|
-
/// @group card
|
|
8
|
-
$kendo-card-default-theme-color: null !default;
|
|
9
|
-
|
|
10
5
|
/// The horizontal padding of the Card.
|
|
11
6
|
/// @group card
|
|
12
7
|
$kendo-card-padding-x: var( --kendo-card-padding-x, k-spacing(3) ) !default;
|
|
@@ -179,7 +174,6 @@ $kendo-card-deck-scroll-button-offset: calc( -1 * #{$kendo-button-border-width}
|
|
|
179
174
|
$kendo-card-callout-size: 20px !default;
|
|
180
175
|
|
|
181
176
|
@forward "@progress/kendo-theme-core/scss/components/card/_variables.scss" with (
|
|
182
|
-
$kendo-card-default-theme-color: $kendo-card-default-theme-color,
|
|
183
177
|
$kendo-card-padding-x: $kendo-card-padding-x,
|
|
184
178
|
$kendo-card-padding-y: $kendo-card-padding-y,
|
|
185
179
|
$kendo-card-border-width: $kendo-card-border-width,
|
|
@@ -136,7 +136,7 @@ $kendo-chat-border: var( --kendo-chat-border, #{color-mix(in srgb, k-color(borde
|
|
|
136
136
|
$kendo-chat-alt-bubble-bg: var( --kendo-chat-alt-bubble-bg, #{k-color(primary)} ) !default;
|
|
137
137
|
/// The text color of the Chat alt bubble.
|
|
138
138
|
/// @group chat
|
|
139
|
-
$kendo-chat-alt-bubble-text: var( --kendo-chat-alt-bubble-text, #{k-color(
|
|
139
|
+
$kendo-chat-alt-bubble-text: var( --kendo-chat-alt-bubble-text, #{k-color(on-primary)} ) !default;
|
|
140
140
|
/// The border color of the Chat alt bubble.
|
|
141
141
|
/// @group chat
|
|
142
142
|
$kendo-chat-alt-bubble-border: var( --kendo-chat-alt-bubble-border, $kendo-chat-alt-bubble-bg ) !default;
|
|
@@ -91,7 +91,7 @@ $kendo-checkbox-hover-border: var( --kendo-checkbox-hover-border, $kendo-checkbo
|
|
|
91
91
|
$kendo-checkbox-checked-bg: var( --kendo-checkbox-checked-bg, k-color(primary) ) !default;
|
|
92
92
|
/// The text color of the checked CheckBox.
|
|
93
93
|
/// @group checkbox
|
|
94
|
-
$kendo-checkbox-checked-text: var( --kendo-checkbox-checked-text, k-color(
|
|
94
|
+
$kendo-checkbox-checked-text: var( --kendo-checkbox-checked-text, k-color(on-primary) ) !default;
|
|
95
95
|
/// The border color of the checked CheckBox.
|
|
96
96
|
/// @group checkbox
|
|
97
97
|
$kendo-checkbox-checked-border: var( --kendo-checkbox-checked-border, $kendo-checkbox-checked-bg ) !default;
|
|
@@ -157,7 +157,7 @@ $kendo-checkbox-invalid-border: var( --kendo-checkbox-invalid-border, k-color(er
|
|
|
157
157
|
$kendo-checkbox-hover-checked-bg: var( --kendo-checkbox-hover-checked-bg, k-color(primary-hover) ) !default;
|
|
158
158
|
/// The text color of the hovered and checked CheckBox.
|
|
159
159
|
/// @group checkbox
|
|
160
|
-
$kendo-checkbox-hover-checked-text: var( --kendo-checkbox-hover-checked-text, k-color(
|
|
160
|
+
$kendo-checkbox-hover-checked-text: var( --kendo-checkbox-hover-checked-text, k-color(on-primary) ) !default;
|
|
161
161
|
/// The border color of the hovered and checked CheckBox.
|
|
162
162
|
/// @group checkbox
|
|
163
163
|
$kendo-checkbox-hover-checked-border: var( --kendo-checkbox-hover-checked-border, $kendo-checkbox-hover-checked-bg ) !default;
|
|
@@ -59,7 +59,7 @@ $kendo-group-menu-item-action-hover-bg: var( --kendo-group-menu-item-action-hove
|
|
|
59
59
|
$kendo-group-menu-item-action-selected-bg: var( --kendo-group-menu-item-action-selected-bg, color-mix(in srgb, currentColor 8%, transparent) ) !default;
|
|
60
60
|
/// The text color of the ColumnMenu item.
|
|
61
61
|
/// @group column-menu
|
|
62
|
-
$kendo-group-menu-item-add-action-text: var( --kendo-group-menu-item-add-action-text, k-color(primary) ) !default;
|
|
62
|
+
$kendo-group-menu-item-add-action-text: var( --kendo-group-menu-item-add-action-text, #{k-color(primary-on-surface)} ) !default;
|
|
63
63
|
/// The border color of the ColumnMenu item.
|
|
64
64
|
/// @group column-menu
|
|
65
65
|
$kendo-group-menu-item-border: var( --kendo-group-menu-item-border, color-mix(in srgb, k-color(border) 16%, transparent) ) !default;
|
|
@@ -107,30 +107,6 @@ $_default-colors: (
|
|
|
107
107
|
on-error: #{"oklch(from var(--kendo-color-error) clamp(0, (0.6 - l) * 99999, 1) 0 h)"},
|
|
108
108
|
error-on-surface: #{"oklch(from var(--kendo-color-error) l c h)"},
|
|
109
109
|
|
|
110
|
-
// Light
|
|
111
|
-
light-subtle: #{"oklch(from var(--kendo-color-light) calc(l + 0.060) c h)"},
|
|
112
|
-
light-subtle-hover: #{"oklch(from var(--kendo-color-light) calc(l + 0.030) c h)"},
|
|
113
|
-
light-subtle-active: #{"oklch(from var(--kendo-color-light) l c h)"},
|
|
114
|
-
light: oklch(94.01% 0 0deg),
|
|
115
|
-
light-hover: #{"oklch(from var(--kendo-color-light) calc(l + 0.030) c h)"},
|
|
116
|
-
light-active: #{"oklch(from var(--kendo-color-light) calc(l + 0.015) c h)"},
|
|
117
|
-
light-emphasis: #{"oklch(from var(--kendo-color-light) calc(l - 0.033) c h)"},
|
|
118
|
-
light-on-subtle: oklch(49.26% 0 0deg),
|
|
119
|
-
on-light: oklch(26.03% 0 0deg),
|
|
120
|
-
light-on-surface: oklch(100% 0 0deg),
|
|
121
|
-
|
|
122
|
-
// Dark
|
|
123
|
-
dark-subtle: oklch(0% 0 0deg),
|
|
124
|
-
dark-subtle-hover: #{"oklch(from var(--kendo-color-dark) l c h)"},
|
|
125
|
-
dark-subtle-active: #{"oklch(from var(--kendo-color-dark) calc(l + 0.061) c h)"},
|
|
126
|
-
dark: oklch(26.03% 0 0deg),
|
|
127
|
-
dark-hover: #{"oklch(from var(--kendo-color-dark) calc(l + 0.119) c h)"},
|
|
128
|
-
dark-active: #{"oklch(from var(--kendo-color-dark) calc(l + 0.061) c h)"},
|
|
129
|
-
dark-emphasis: #{"oklch(from var(--kendo-color-dark) calc(l + 0.232) c h)"},
|
|
130
|
-
dark-on-subtle: oklch(100% 0 0deg),
|
|
131
|
-
on-dark: oklch(100% 0 0deg),
|
|
132
|
-
dark-on-surface: oklch(49.26% 0 0deg),
|
|
133
|
-
|
|
134
110
|
// Inverse
|
|
135
111
|
inverse-subtle: #{"oklch(from var(--kendo-color-inverse) calc(l + 0.232) c h)"},
|
|
136
112
|
inverse-subtle-hover: #{"oklch(from var(--kendo-color-inverse) calc(l + 0.373) c h)"},
|
|
@@ -327,38 +303,6 @@ $_default-colors: (
|
|
|
327
303
|
/// @prop {Color} on-error - The text color variable for content on error.
|
|
328
304
|
/// @prop {Color} error-on-surface - The text color variable for content on surface.
|
|
329
305
|
///
|
|
330
|
-
/// @subgroup {light}
|
|
331
|
-
/// [light-subtle, light-subtle-hover, light-subtle-active,
|
|
332
|
-
/// light, light-hover, light-active, light-emphasis,
|
|
333
|
-
/// light-on-subtle, on-light, light-on-surface]
|
|
334
|
-
/// The Light variable group.
|
|
335
|
-
/// @prop {Color} light-subtle - The light subtle background color variable.
|
|
336
|
-
/// @prop {Color} light-subtle-hover - The light subtle background color variable for the hover state.
|
|
337
|
-
/// @prop {Color} light-subtle-active - The light subtle background color variable for the active state.
|
|
338
|
-
/// @prop {Color} light - The light background color variable.
|
|
339
|
-
/// @prop {Color} light-hover - The light background color variable for the hover state.
|
|
340
|
-
/// @prop {Color} light-active - The light background color variable for the active state.
|
|
341
|
-
/// @prop {Color} light-emphasis - The emphasized light color variable.
|
|
342
|
-
/// @prop {Color} light-on-subtle - The text color variable for content on light subtle.
|
|
343
|
-
/// @prop {Color} on-light - The text color variable for content on light.
|
|
344
|
-
/// @prop {Color} light-on-surface - The text color variable for content on surface.
|
|
345
|
-
///
|
|
346
|
-
/// @subgroup {dark}
|
|
347
|
-
/// [dark-subtle, dark-subtle-hover, dark-subtle-active,
|
|
348
|
-
/// dark, dark-hover, dark-active, dark-emphasis,
|
|
349
|
-
/// dark-on-subtle, on-dark, dark-on-surface]
|
|
350
|
-
/// The Dark variable group.
|
|
351
|
-
/// @prop {Color} dark-subtle - The dark subtle background color variable.
|
|
352
|
-
/// @prop {Color} dark-subtle-hover - The dark subtle background color variable for the hover state.
|
|
353
|
-
/// @prop {Color} dark-subtle-active - The dark subtle background color variable for the active state.
|
|
354
|
-
/// @prop {Color} dark - The dark background color variable.
|
|
355
|
-
/// @prop {Color} dark-hover - The dark background color variable for the hover state.
|
|
356
|
-
/// @prop {Color} dark-active - The dark background color variable for the active state.
|
|
357
|
-
/// @prop {Color} dark-emphasis - The emphasized dark color variable.
|
|
358
|
-
/// @prop {Color} dark-on-subtle - The text color variable for content on dark subtle.
|
|
359
|
-
/// @prop {Color} on-dark - The text color variable for content on dark.
|
|
360
|
-
/// @prop {Color} dark-on-surface - The text color variable for content on surface.
|
|
361
|
-
///
|
|
362
306
|
/// @subgroup {inverse}
|
|
363
307
|
/// [inverse-subtle, inverse-subtle-hover, inverse-subtle-active,
|
|
364
308
|
/// inverse, inverse-hover, inverse-active, inverse-emphasis,
|
|
@@ -1,11 +1,6 @@
|
|
|
1
1
|
@use "sass:map";
|
|
2
2
|
@use "../core/_index.scss" as *;
|
|
3
3
|
|
|
4
|
-
/// The default theme color of the Dialog.
|
|
5
|
-
/// @group dialog
|
|
6
|
-
/// @role default
|
|
7
|
-
$kendo-dialog-default-theme-color: null !default;
|
|
8
|
-
|
|
9
4
|
/// The background color of the Dialog titlebar.
|
|
10
5
|
/// @group dialog
|
|
11
6
|
$kendo-dialog-titlebar-bg: var( --kendo-dialog-titlebar-bg, k-color(surface-alt) ) !default;
|
|
@@ -38,7 +33,6 @@ $kendo-dialog-bg: var( --kendo-dialog-bg, k-color(surface-alt) ) !default;
|
|
|
38
33
|
$kendo-dialog-shadow: var( --kendo-dialog-shadow, var( --kendo-elevation-5, none ) ) !default;
|
|
39
34
|
|
|
40
35
|
@forward "@progress/kendo-theme-core/scss/components/dialog/_variables.scss" with (
|
|
41
|
-
$kendo-dialog-default-theme-color: $kendo-dialog-default-theme-color,
|
|
42
36
|
$kendo-dialog-titlebar-bg: $kendo-dialog-titlebar-bg,
|
|
43
37
|
$kendo-dialog-titlebar-text: $kendo-dialog-titlebar-text,
|
|
44
38
|
$kendo-dialog-titlebar-border: $kendo-dialog-titlebar-border,
|
|
@@ -100,7 +100,7 @@ $kendo-dock-indicator-shadow: var( --kendo-dock-indicator-shadow, k-elevation(4)
|
|
|
100
100
|
$kendo-dock-indicator-hover-bg: var( --kendo-dock-indicator-hover-bg, k-color(primary-hover) ) !default;
|
|
101
101
|
/// The text color of the hovered dock indicator in the DockManager component.
|
|
102
102
|
/// @group dock-manager
|
|
103
|
-
$kendo-dock-indicator-hover-text: var( --kendo-dock-indicator-hover-text, k-color(
|
|
103
|
+
$kendo-dock-indicator-hover-text: var( --kendo-dock-indicator-hover-text, k-color(on-primary) ) !default;
|
|
104
104
|
|
|
105
105
|
/// The width of the border around the dropping area in the DockManager component.
|
|
106
106
|
/// @group dock-manager
|