@progress/kendo-theme-core 6.1.1-dev.25 → 6.1.1-dev.38
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.scss
CHANGED
|
@@ -581,12 +581,17 @@ $wcag-light: white !default;
|
|
|
581
581
|
|
|
582
582
|
// #endregion
|
|
583
583
|
// #region @import "./_color-manipulation.import.scss"; -> scss/functions/_color-manipulation.import.scss
|
|
584
|
+
$kendo-light-color-level-step: 8% !default;
|
|
585
|
+
$kendo-dark-color-level-step: 16% !default;
|
|
586
|
+
|
|
584
587
|
/// Set a specific jump point for requesting color jumps
|
|
585
588
|
/// @group color-system
|
|
586
589
|
/// @access private
|
|
587
590
|
$kendo-color-level-step: 8% !default;
|
|
588
591
|
|
|
589
592
|
@function k-color-level( $color, $level: 0 ) {
|
|
593
|
+
$_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );
|
|
594
|
+
$_color-level-step: if( $_dark-theme, $kendo-dark-color-level-step, $kendo-light-color-level-step );
|
|
590
595
|
|
|
591
596
|
@if ( $level == 0 ) or ( $level == 0% ) {
|
|
592
597
|
@return $color;
|
|
@@ -600,7 +605,7 @@ $kendo-color-level-step: 8% !default;
|
|
|
600
605
|
@return k-color-mix( $base, $color, $level );
|
|
601
606
|
}
|
|
602
607
|
|
|
603
|
-
@return k-color-mix( $base, $color, $level * $
|
|
608
|
+
@return k-color-mix( $base, $color, k-math-clamp( $level * $_color-level-step, 0%, 100% ) );
|
|
604
609
|
}
|
|
605
610
|
|
|
606
611
|
/// Makes a color lighter by mixing it with white
|
|
@@ -734,16 +734,16 @@
|
|
|
734
734
|
{
|
|
735
735
|
"description": "Makes a color lighter by mixing it with white\n",
|
|
736
736
|
"commentRange": {
|
|
737
|
-
"start":
|
|
738
|
-
"end":
|
|
737
|
+
"start": 28,
|
|
738
|
+
"end": 36
|
|
739
739
|
},
|
|
740
740
|
"context": {
|
|
741
741
|
"type": "function",
|
|
742
742
|
"name": "k-color-tint",
|
|
743
743
|
"code": "\n @return k-color-level( $color, -$level );\n",
|
|
744
744
|
"line": {
|
|
745
|
-
"start":
|
|
746
|
-
"end":
|
|
745
|
+
"start": 37,
|
|
746
|
+
"end": 39
|
|
747
747
|
},
|
|
748
748
|
"signature": "k-color-tint($color, $level)"
|
|
749
749
|
},
|
|
@@ -768,8 +768,8 @@
|
|
|
768
768
|
"name": "k-try-shade",
|
|
769
769
|
"code": "\n $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );\n\n @if $_dark-theme {\n @return k-color-tint( $color, $level );\n }\n\n @return k-color-shade( $color, $level );\n",
|
|
770
770
|
"line": {
|
|
771
|
-
"start":
|
|
772
|
-
"end":
|
|
771
|
+
"start": 60,
|
|
772
|
+
"end": 68
|
|
773
773
|
},
|
|
774
774
|
"signature": "k-try-shade($color, $level)"
|
|
775
775
|
}
|
|
@@ -781,8 +781,8 @@
|
|
|
781
781
|
"name": "k-try-tint",
|
|
782
782
|
"code": "\n $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );\n\n @if $_dark-theme {\n @return k-color-shade( $color, $level );\n }\n\n @return k-color-tint( $color, $level );\n",
|
|
783
783
|
"line": {
|
|
784
|
-
"start":
|
|
785
|
-
"end":
|
|
784
|
+
"start": 76,
|
|
785
|
+
"end": 84
|
|
786
786
|
},
|
|
787
787
|
"signature": "k-try-tint($color, $level)"
|
|
788
788
|
}
|
|
@@ -811,16 +811,16 @@
|
|
|
811
811
|
{
|
|
812
812
|
"description": "Makes a color darker by mixing it with black\n",
|
|
813
813
|
"commentRange": {
|
|
814
|
-
"start":
|
|
815
|
-
"end":
|
|
814
|
+
"start": 41,
|
|
815
|
+
"end": 49
|
|
816
816
|
},
|
|
817
817
|
"context": {
|
|
818
818
|
"type": "function",
|
|
819
819
|
"name": "k-color-shade",
|
|
820
820
|
"code": "\n @return k-color-level( $color, $level );\n",
|
|
821
821
|
"line": {
|
|
822
|
-
"start":
|
|
823
|
-
"end":
|
|
822
|
+
"start": 50,
|
|
823
|
+
"end": 52
|
|
824
824
|
},
|
|
825
825
|
"signature": "k-color-shade($color, $level)"
|
|
826
826
|
},
|
|
@@ -845,8 +845,8 @@
|
|
|
845
845
|
"name": "k-try-shade",
|
|
846
846
|
"code": "\n $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );\n\n @if $_dark-theme {\n @return k-color-tint( $color, $level );\n }\n\n @return k-color-shade( $color, $level );\n",
|
|
847
847
|
"line": {
|
|
848
|
-
"start":
|
|
849
|
-
"end":
|
|
848
|
+
"start": 60,
|
|
849
|
+
"end": 68
|
|
850
850
|
},
|
|
851
851
|
"signature": "k-try-shade($color, $level)"
|
|
852
852
|
}
|
|
@@ -858,8 +858,8 @@
|
|
|
858
858
|
"name": "k-try-tint",
|
|
859
859
|
"code": "\n $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );\n\n @if $_dark-theme {\n @return k-color-shade( $color, $level );\n }\n\n @return k-color-tint( $color, $level );\n",
|
|
860
860
|
"line": {
|
|
861
|
-
"start":
|
|
862
|
-
"end":
|
|
861
|
+
"start": 76,
|
|
862
|
+
"end": 84
|
|
863
863
|
},
|
|
864
864
|
"signature": "k-try-tint($color, $level)"
|
|
865
865
|
}
|
|
@@ -888,16 +888,16 @@
|
|
|
888
888
|
{
|
|
889
889
|
"description": "Shades the color in light themes and tints it in dark themes\n",
|
|
890
890
|
"commentRange": {
|
|
891
|
-
"start":
|
|
892
|
-
"end":
|
|
891
|
+
"start": 54,
|
|
892
|
+
"end": 59
|
|
893
893
|
},
|
|
894
894
|
"context": {
|
|
895
895
|
"type": "function",
|
|
896
896
|
"name": "k-try-shade",
|
|
897
897
|
"code": "\n $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );\n\n @if $_dark-theme {\n @return k-color-tint( $color, $level );\n }\n\n @return k-color-shade( $color, $level );\n",
|
|
898
898
|
"line": {
|
|
899
|
-
"start":
|
|
900
|
-
"end":
|
|
899
|
+
"start": 60,
|
|
900
|
+
"end": 68
|
|
901
901
|
},
|
|
902
902
|
"signature": "k-try-shade($color, $level)"
|
|
903
903
|
},
|
|
@@ -944,16 +944,16 @@
|
|
|
944
944
|
{
|
|
945
945
|
"description": "Tints the color in light themes and shades it in dark themes\n",
|
|
946
946
|
"commentRange": {
|
|
947
|
-
"start":
|
|
948
|
-
"end":
|
|
947
|
+
"start": 70,
|
|
948
|
+
"end": 75
|
|
949
949
|
},
|
|
950
950
|
"context": {
|
|
951
951
|
"type": "function",
|
|
952
952
|
"name": "k-try-tint",
|
|
953
953
|
"code": "\n $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );\n\n @if $_dark-theme {\n @return k-color-shade( $color, $level );\n }\n\n @return k-color-tint( $color, $level );\n",
|
|
954
954
|
"line": {
|
|
955
|
-
"start":
|
|
956
|
-
"end":
|
|
955
|
+
"start": 76,
|
|
956
|
+
"end": 84
|
|
957
957
|
},
|
|
958
958
|
"signature": "k-try-tint($color, $level)"
|
|
959
959
|
},
|
|
@@ -1000,16 +1000,16 @@
|
|
|
1000
1000
|
{
|
|
1001
1001
|
"description": "Darkens the color in light themes and lightens it in dark themes\n",
|
|
1002
1002
|
"commentRange": {
|
|
1003
|
-
"start":
|
|
1004
|
-
"end":
|
|
1003
|
+
"start": 86,
|
|
1004
|
+
"end": 91
|
|
1005
1005
|
},
|
|
1006
1006
|
"context": {
|
|
1007
1007
|
"type": "function",
|
|
1008
1008
|
"name": "k-try-darken",
|
|
1009
1009
|
"code": "\n $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );\n\n @if $_dark-theme {\n @return k-color-lighten( $color, $amount );\n }\n @return k-color-darken( $color, $amount );\n",
|
|
1010
1010
|
"line": {
|
|
1011
|
-
"start":
|
|
1012
|
-
"end":
|
|
1011
|
+
"start": 92,
|
|
1012
|
+
"end": 99
|
|
1013
1013
|
},
|
|
1014
1014
|
"signature": "k-try-darken($color, $level)"
|
|
1015
1015
|
},
|
|
@@ -1056,16 +1056,16 @@
|
|
|
1056
1056
|
{
|
|
1057
1057
|
"description": "Lightens the color in light themes and darkens it in dark themes\n",
|
|
1058
1058
|
"commentRange": {
|
|
1059
|
-
"start":
|
|
1060
|
-
"end":
|
|
1059
|
+
"start": 101,
|
|
1060
|
+
"end": 106
|
|
1061
1061
|
},
|
|
1062
1062
|
"context": {
|
|
1063
1063
|
"type": "function",
|
|
1064
1064
|
"name": "k-try-lighten",
|
|
1065
1065
|
"code": "\n $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );\n\n @if $_dark-theme {\n @return k-color-darken( $color, $amount );\n }\n @return k-color-lighten( $color, $amount );\n",
|
|
1066
1066
|
"line": {
|
|
1067
|
-
"start":
|
|
1068
|
-
"end":
|
|
1067
|
+
"start": 107,
|
|
1068
|
+
"end": 114
|
|
1069
1069
|
},
|
|
1070
1070
|
"signature": "k-try-lighten($color, $level)"
|
|
1071
1071
|
},
|
|
@@ -1112,16 +1112,16 @@
|
|
|
1112
1112
|
{
|
|
1113
1113
|
"description": "Converts a color with alpha to solid color mixed with a background color\n",
|
|
1114
1114
|
"commentRange": {
|
|
1115
|
-
"start":
|
|
1116
|
-
"end":
|
|
1115
|
+
"start": 116,
|
|
1116
|
+
"end": 124
|
|
1117
1117
|
},
|
|
1118
1118
|
"context": {
|
|
1119
1119
|
"type": "function",
|
|
1120
1120
|
"name": "k-rgba-to-mix",
|
|
1121
1121
|
"code": "\n $percent: k-color-alpha( $color ) * 100%;\n\n @return k-color-mix( rgba( $color, 1 ), $bg, $percent );\n",
|
|
1122
1122
|
"line": {
|
|
1123
|
-
"start":
|
|
1124
|
-
"end":
|
|
1123
|
+
"start": 125,
|
|
1124
|
+
"end": 129
|
|
1125
1125
|
},
|
|
1126
1126
|
"signature": "k-rgba-to-mix($color, $bg)"
|
|
1127
1127
|
},
|
|
@@ -1204,8 +1204,8 @@
|
|
|
1204
1204
|
"name": "k-rgba-to-mix",
|
|
1205
1205
|
"code": "\n $percent: k-color-alpha( $color ) * 100%;\n\n @return k-color-mix( rgba( $color, 1 ), $bg, $percent );\n",
|
|
1206
1206
|
"line": {
|
|
1207
|
-
"start":
|
|
1208
|
-
"end":
|
|
1207
|
+
"start": 125,
|
|
1208
|
+
"end": 129
|
|
1209
1209
|
},
|
|
1210
1210
|
"signature": "k-rgba-to-mix($color, $bg)"
|
|
1211
1211
|
}
|
|
@@ -1572,8 +1572,8 @@
|
|
|
1572
1572
|
"name": "k-rgba-to-mix",
|
|
1573
1573
|
"code": "\n $percent: k-color-alpha( $color ) * 100%;\n\n @return k-color-mix( rgba( $color, 1 ), $bg, $percent );\n",
|
|
1574
1574
|
"line": {
|
|
1575
|
-
"start":
|
|
1576
|
-
"end":
|
|
1575
|
+
"start": 125,
|
|
1576
|
+
"end": 129
|
|
1577
1577
|
},
|
|
1578
1578
|
"signature": "k-rgba-to-mix($color, $bg)"
|
|
1579
1579
|
}
|
|
@@ -1641,8 +1641,8 @@
|
|
|
1641
1641
|
"name": "k-try-darken",
|
|
1642
1642
|
"code": "\n $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );\n\n @if $_dark-theme {\n @return k-color-lighten( $color, $amount );\n }\n @return k-color-darken( $color, $amount );\n",
|
|
1643
1643
|
"line": {
|
|
1644
|
-
"start":
|
|
1645
|
-
"end":
|
|
1644
|
+
"start": 92,
|
|
1645
|
+
"end": 99
|
|
1646
1646
|
},
|
|
1647
1647
|
"signature": "k-try-darken($color, $level)"
|
|
1648
1648
|
}
|
|
@@ -1654,8 +1654,8 @@
|
|
|
1654
1654
|
"name": "k-try-lighten",
|
|
1655
1655
|
"code": "\n $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );\n\n @if $_dark-theme {\n @return k-color-darken( $color, $amount );\n }\n @return k-color-lighten( $color, $amount );\n",
|
|
1656
1656
|
"line": {
|
|
1657
|
-
"start":
|
|
1658
|
-
"end":
|
|
1657
|
+
"start": 107,
|
|
1658
|
+
"end": 114
|
|
1659
1659
|
},
|
|
1660
1660
|
"signature": "k-try-lighten($color, $level)"
|
|
1661
1661
|
}
|
|
@@ -1718,8 +1718,8 @@
|
|
|
1718
1718
|
"name": "k-try-darken",
|
|
1719
1719
|
"code": "\n $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );\n\n @if $_dark-theme {\n @return k-color-lighten( $color, $amount );\n }\n @return k-color-darken( $color, $amount );\n",
|
|
1720
1720
|
"line": {
|
|
1721
|
-
"start":
|
|
1722
|
-
"end":
|
|
1721
|
+
"start": 92,
|
|
1722
|
+
"end": 99
|
|
1723
1723
|
},
|
|
1724
1724
|
"signature": "k-try-darken($color, $level)"
|
|
1725
1725
|
}
|
|
@@ -1731,8 +1731,8 @@
|
|
|
1731
1731
|
"name": "k-try-lighten",
|
|
1732
1732
|
"code": "\n $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );\n\n @if $_dark-theme {\n @return k-color-darken( $color, $amount );\n }\n @return k-color-lighten( $color, $amount );\n",
|
|
1733
1733
|
"line": {
|
|
1734
|
-
"start":
|
|
1735
|
-
"end":
|
|
1734
|
+
"start": 107,
|
|
1735
|
+
"end": 114
|
|
1736
1736
|
},
|
|
1737
1737
|
"signature": "k-try-lighten($color, $level)"
|
|
1738
1738
|
}
|
|
@@ -4720,8 +4720,8 @@
|
|
|
4720
4720
|
"name": "k-try-shade",
|
|
4721
4721
|
"code": "\n $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );\n\n @if $_dark-theme {\n @return k-color-tint( $color, $level );\n }\n\n @return k-color-shade( $color, $level );\n",
|
|
4722
4722
|
"line": {
|
|
4723
|
-
"start":
|
|
4724
|
-
"end":
|
|
4723
|
+
"start": 60,
|
|
4724
|
+
"end": 68
|
|
4725
4725
|
},
|
|
4726
4726
|
"signature": "k-try-shade($color, $level)"
|
|
4727
4727
|
}
|
|
@@ -4733,8 +4733,8 @@
|
|
|
4733
4733
|
"name": "k-try-tint",
|
|
4734
4734
|
"code": "\n $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );\n\n @if $_dark-theme {\n @return k-color-shade( $color, $level );\n }\n\n @return k-color-tint( $color, $level );\n",
|
|
4735
4735
|
"line": {
|
|
4736
|
-
"start":
|
|
4737
|
-
"end":
|
|
4736
|
+
"start": 76,
|
|
4737
|
+
"end": 84
|
|
4738
4738
|
},
|
|
4739
4739
|
"signature": "k-try-tint($color, $level)"
|
|
4740
4740
|
}
|
|
@@ -4746,8 +4746,8 @@
|
|
|
4746
4746
|
"name": "k-try-darken",
|
|
4747
4747
|
"code": "\n $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );\n\n @if $_dark-theme {\n @return k-color-lighten( $color, $amount );\n }\n @return k-color-darken( $color, $amount );\n",
|
|
4748
4748
|
"line": {
|
|
4749
|
-
"start":
|
|
4750
|
-
"end":
|
|
4749
|
+
"start": 92,
|
|
4750
|
+
"end": 99
|
|
4751
4751
|
},
|
|
4752
4752
|
"signature": "k-try-darken($color, $level)"
|
|
4753
4753
|
}
|
|
@@ -4759,8 +4759,8 @@
|
|
|
4759
4759
|
"name": "k-try-lighten",
|
|
4760
4760
|
"code": "\n $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );\n\n @if $_dark-theme {\n @return k-color-darken( $color, $amount );\n }\n @return k-color-lighten( $color, $amount );\n",
|
|
4761
4761
|
"line": {
|
|
4762
|
-
"start":
|
|
4763
|
-
"end":
|
|
4762
|
+
"start": 107,
|
|
4763
|
+
"end": 114
|
|
4764
4764
|
},
|
|
4765
4765
|
"signature": "k-try-lighten($color, $level)"
|
|
4766
4766
|
}
|
|
@@ -991,8 +991,8 @@
|
|
|
991
991
|
{
|
|
992
992
|
"description": "Set a specific jump point for requesting color jumps\n",
|
|
993
993
|
"commentRange": {
|
|
994
|
-
"start":
|
|
995
|
-
"end":
|
|
994
|
+
"start": 4,
|
|
995
|
+
"end": 6
|
|
996
996
|
},
|
|
997
997
|
"context": {
|
|
998
998
|
"type": "variable",
|
|
@@ -1000,8 +1000,8 @@
|
|
|
1000
1000
|
"value": "8%",
|
|
1001
1001
|
"scope": "default",
|
|
1002
1002
|
"line": {
|
|
1003
|
-
"start":
|
|
1004
|
-
"end":
|
|
1003
|
+
"start": 7,
|
|
1004
|
+
"end": 7
|
|
1005
1005
|
}
|
|
1006
1006
|
},
|
|
1007
1007
|
"group": [
|
|
@@ -1016,16 +1016,16 @@
|
|
|
1016
1016
|
{
|
|
1017
1017
|
"description": "Makes a color lighter by mixing it with white\n",
|
|
1018
1018
|
"commentRange": {
|
|
1019
|
-
"start":
|
|
1020
|
-
"end":
|
|
1019
|
+
"start": 28,
|
|
1020
|
+
"end": 36
|
|
1021
1021
|
},
|
|
1022
1022
|
"context": {
|
|
1023
1023
|
"type": "function",
|
|
1024
1024
|
"name": "k-color-tint",
|
|
1025
1025
|
"code": "\n @return k-color-level( $color, -$level );\n",
|
|
1026
1026
|
"line": {
|
|
1027
|
-
"start":
|
|
1028
|
-
"end":
|
|
1027
|
+
"start": 37,
|
|
1028
|
+
"end": 39
|
|
1029
1029
|
}
|
|
1030
1030
|
},
|
|
1031
1031
|
"parameter": [
|
|
@@ -1068,8 +1068,8 @@
|
|
|
1068
1068
|
"name": "k-try-shade",
|
|
1069
1069
|
"code": "\n $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );\n\n @if $_dark-theme {\n @return k-color-tint( $color, $level );\n }\n\n @return k-color-shade( $color, $level );\n",
|
|
1070
1070
|
"line": {
|
|
1071
|
-
"start":
|
|
1072
|
-
"end":
|
|
1071
|
+
"start": 60,
|
|
1072
|
+
"end": 68
|
|
1073
1073
|
}
|
|
1074
1074
|
}
|
|
1075
1075
|
},
|
|
@@ -1080,8 +1080,8 @@
|
|
|
1080
1080
|
"name": "k-try-tint",
|
|
1081
1081
|
"code": "\n $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );\n\n @if $_dark-theme {\n @return k-color-shade( $color, $level );\n }\n\n @return k-color-tint( $color, $level );\n",
|
|
1082
1082
|
"line": {
|
|
1083
|
-
"start":
|
|
1084
|
-
"end":
|
|
1083
|
+
"start": 76,
|
|
1084
|
+
"end": 84
|
|
1085
1085
|
}
|
|
1086
1086
|
}
|
|
1087
1087
|
}
|
|
@@ -1090,16 +1090,16 @@
|
|
|
1090
1090
|
{
|
|
1091
1091
|
"description": "Makes a color darker by mixing it with black\n",
|
|
1092
1092
|
"commentRange": {
|
|
1093
|
-
"start":
|
|
1094
|
-
"end":
|
|
1093
|
+
"start": 41,
|
|
1094
|
+
"end": 49
|
|
1095
1095
|
},
|
|
1096
1096
|
"context": {
|
|
1097
1097
|
"type": "function",
|
|
1098
1098
|
"name": "k-color-shade",
|
|
1099
1099
|
"code": "\n @return k-color-level( $color, $level );\n",
|
|
1100
1100
|
"line": {
|
|
1101
|
-
"start":
|
|
1102
|
-
"end":
|
|
1101
|
+
"start": 50,
|
|
1102
|
+
"end": 52
|
|
1103
1103
|
}
|
|
1104
1104
|
},
|
|
1105
1105
|
"parameter": [
|
|
@@ -1142,8 +1142,8 @@
|
|
|
1142
1142
|
"name": "k-try-shade",
|
|
1143
1143
|
"code": "\n $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );\n\n @if $_dark-theme {\n @return k-color-tint( $color, $level );\n }\n\n @return k-color-shade( $color, $level );\n",
|
|
1144
1144
|
"line": {
|
|
1145
|
-
"start":
|
|
1146
|
-
"end":
|
|
1145
|
+
"start": 60,
|
|
1146
|
+
"end": 68
|
|
1147
1147
|
}
|
|
1148
1148
|
}
|
|
1149
1149
|
},
|
|
@@ -1154,8 +1154,8 @@
|
|
|
1154
1154
|
"name": "k-try-tint",
|
|
1155
1155
|
"code": "\n $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );\n\n @if $_dark-theme {\n @return k-color-shade( $color, $level );\n }\n\n @return k-color-tint( $color, $level );\n",
|
|
1156
1156
|
"line": {
|
|
1157
|
-
"start":
|
|
1158
|
-
"end":
|
|
1157
|
+
"start": 76,
|
|
1158
|
+
"end": 84
|
|
1159
1159
|
}
|
|
1160
1160
|
}
|
|
1161
1161
|
}
|
|
@@ -1164,16 +1164,16 @@
|
|
|
1164
1164
|
{
|
|
1165
1165
|
"description": "Shades the color in light themes and tints it in dark themes\n",
|
|
1166
1166
|
"commentRange": {
|
|
1167
|
-
"start":
|
|
1168
|
-
"end":
|
|
1167
|
+
"start": 54,
|
|
1168
|
+
"end": 59
|
|
1169
1169
|
},
|
|
1170
1170
|
"context": {
|
|
1171
1171
|
"type": "function",
|
|
1172
1172
|
"name": "k-try-shade",
|
|
1173
1173
|
"code": "\n $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );\n\n @if $_dark-theme {\n @return k-color-tint( $color, $level );\n }\n\n @return k-color-shade( $color, $level );\n",
|
|
1174
1174
|
"line": {
|
|
1175
|
-
"start":
|
|
1176
|
-
"end":
|
|
1175
|
+
"start": 60,
|
|
1176
|
+
"end": 68
|
|
1177
1177
|
}
|
|
1178
1178
|
},
|
|
1179
1179
|
"parameter": [
|
|
@@ -1218,16 +1218,16 @@
|
|
|
1218
1218
|
{
|
|
1219
1219
|
"description": "Tints the color in light themes and shades it in dark themes\n",
|
|
1220
1220
|
"commentRange": {
|
|
1221
|
-
"start":
|
|
1222
|
-
"end":
|
|
1221
|
+
"start": 70,
|
|
1222
|
+
"end": 75
|
|
1223
1223
|
},
|
|
1224
1224
|
"context": {
|
|
1225
1225
|
"type": "function",
|
|
1226
1226
|
"name": "k-try-tint",
|
|
1227
1227
|
"code": "\n $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );\n\n @if $_dark-theme {\n @return k-color-shade( $color, $level );\n }\n\n @return k-color-tint( $color, $level );\n",
|
|
1228
1228
|
"line": {
|
|
1229
|
-
"start":
|
|
1230
|
-
"end":
|
|
1229
|
+
"start": 76,
|
|
1230
|
+
"end": 84
|
|
1231
1231
|
}
|
|
1232
1232
|
},
|
|
1233
1233
|
"parameter": [
|
|
@@ -1272,16 +1272,16 @@
|
|
|
1272
1272
|
{
|
|
1273
1273
|
"description": "Darkens the color in light themes and lightens it in dark themes\n",
|
|
1274
1274
|
"commentRange": {
|
|
1275
|
-
"start":
|
|
1276
|
-
"end":
|
|
1275
|
+
"start": 86,
|
|
1276
|
+
"end": 91
|
|
1277
1277
|
},
|
|
1278
1278
|
"context": {
|
|
1279
1279
|
"type": "function",
|
|
1280
1280
|
"name": "k-try-darken",
|
|
1281
1281
|
"code": "\n $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );\n\n @if $_dark-theme {\n @return k-color-lighten( $color, $amount );\n }\n @return k-color-darken( $color, $amount );\n",
|
|
1282
1282
|
"line": {
|
|
1283
|
-
"start":
|
|
1284
|
-
"end":
|
|
1283
|
+
"start": 92,
|
|
1284
|
+
"end": 99
|
|
1285
1285
|
}
|
|
1286
1286
|
},
|
|
1287
1287
|
"parameter": [
|
|
@@ -1326,16 +1326,16 @@
|
|
|
1326
1326
|
{
|
|
1327
1327
|
"description": "Lightens the color in light themes and darkens it in dark themes\n",
|
|
1328
1328
|
"commentRange": {
|
|
1329
|
-
"start":
|
|
1330
|
-
"end":
|
|
1329
|
+
"start": 101,
|
|
1330
|
+
"end": 106
|
|
1331
1331
|
},
|
|
1332
1332
|
"context": {
|
|
1333
1333
|
"type": "function",
|
|
1334
1334
|
"name": "k-try-lighten",
|
|
1335
1335
|
"code": "\n $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );\n\n @if $_dark-theme {\n @return k-color-darken( $color, $amount );\n }\n @return k-color-lighten( $color, $amount );\n",
|
|
1336
1336
|
"line": {
|
|
1337
|
-
"start":
|
|
1338
|
-
"end":
|
|
1337
|
+
"start": 107,
|
|
1338
|
+
"end": 114
|
|
1339
1339
|
}
|
|
1340
1340
|
},
|
|
1341
1341
|
"parameter": [
|
|
@@ -1380,16 +1380,16 @@
|
|
|
1380
1380
|
{
|
|
1381
1381
|
"description": "Converts a color with alpha to solid color mixed with a background color\n",
|
|
1382
1382
|
"commentRange": {
|
|
1383
|
-
"start":
|
|
1384
|
-
"end":
|
|
1383
|
+
"start": 116,
|
|
1384
|
+
"end": 124
|
|
1385
1385
|
},
|
|
1386
1386
|
"context": {
|
|
1387
1387
|
"type": "function",
|
|
1388
1388
|
"name": "k-rgba-to-mix",
|
|
1389
1389
|
"code": "\n $percent: k-color-alpha( $color ) * 100%;\n\n @return k-color-mix( rgba( $color, 1 ), $bg, $percent );\n",
|
|
1390
1390
|
"line": {
|
|
1391
|
-
"start":
|
|
1392
|
-
"end":
|
|
1391
|
+
"start": 125,
|
|
1392
|
+
"end": 129
|
|
1393
1393
|
}
|
|
1394
1394
|
},
|
|
1395
1395
|
"parameter": [
|
|
@@ -1484,8 +1484,8 @@
|
|
|
1484
1484
|
"name": "k-rgba-to-mix",
|
|
1485
1485
|
"code": "\n $percent: k-color-alpha( $color ) * 100%;\n\n @return k-color-mix( rgba( $color, 1 ), $bg, $percent );\n",
|
|
1486
1486
|
"line": {
|
|
1487
|
-
"start":
|
|
1488
|
-
"end":
|
|
1487
|
+
"start": 125,
|
|
1488
|
+
"end": 129
|
|
1489
1489
|
}
|
|
1490
1490
|
}
|
|
1491
1491
|
}
|
|
@@ -1851,8 +1851,8 @@
|
|
|
1851
1851
|
"name": "k-rgba-to-mix",
|
|
1852
1852
|
"code": "\n $percent: k-color-alpha( $color ) * 100%;\n\n @return k-color-mix( rgba( $color, 1 ), $bg, $percent );\n",
|
|
1853
1853
|
"line": {
|
|
1854
|
-
"start":
|
|
1855
|
-
"end":
|
|
1854
|
+
"start": 125,
|
|
1855
|
+
"end": 129
|
|
1856
1856
|
}
|
|
1857
1857
|
}
|
|
1858
1858
|
}
|
|
@@ -1913,8 +1913,8 @@
|
|
|
1913
1913
|
"name": "k-try-darken",
|
|
1914
1914
|
"code": "\n $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );\n\n @if $_dark-theme {\n @return k-color-lighten( $color, $amount );\n }\n @return k-color-darken( $color, $amount );\n",
|
|
1915
1915
|
"line": {
|
|
1916
|
-
"start":
|
|
1917
|
-
"end":
|
|
1916
|
+
"start": 92,
|
|
1917
|
+
"end": 99
|
|
1918
1918
|
}
|
|
1919
1919
|
}
|
|
1920
1920
|
},
|
|
@@ -1925,8 +1925,8 @@
|
|
|
1925
1925
|
"name": "k-try-lighten",
|
|
1926
1926
|
"code": "\n $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );\n\n @if $_dark-theme {\n @return k-color-darken( $color, $amount );\n }\n @return k-color-lighten( $color, $amount );\n",
|
|
1927
1927
|
"line": {
|
|
1928
|
-
"start":
|
|
1929
|
-
"end":
|
|
1928
|
+
"start": 107,
|
|
1929
|
+
"end": 114
|
|
1930
1930
|
}
|
|
1931
1931
|
}
|
|
1932
1932
|
}
|
|
@@ -1987,8 +1987,8 @@
|
|
|
1987
1987
|
"name": "k-try-darken",
|
|
1988
1988
|
"code": "\n $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );\n\n @if $_dark-theme {\n @return k-color-lighten( $color, $amount );\n }\n @return k-color-darken( $color, $amount );\n",
|
|
1989
1989
|
"line": {
|
|
1990
|
-
"start":
|
|
1991
|
-
"end":
|
|
1990
|
+
"start": 92,
|
|
1991
|
+
"end": 99
|
|
1992
1992
|
}
|
|
1993
1993
|
}
|
|
1994
1994
|
},
|
|
@@ -1999,8 +1999,8 @@
|
|
|
1999
1999
|
"name": "k-try-lighten",
|
|
2000
2000
|
"code": "\n $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );\n\n @if $_dark-theme {\n @return k-color-darken( $color, $amount );\n }\n @return k-color-lighten( $color, $amount );\n",
|
|
2001
2001
|
"line": {
|
|
2002
|
-
"start":
|
|
2003
|
-
"end":
|
|
2002
|
+
"start": 107,
|
|
2003
|
+
"end": 114
|
|
2004
2004
|
}
|
|
2005
2005
|
}
|
|
2006
2006
|
}
|
|
@@ -4897,8 +4897,8 @@
|
|
|
4897
4897
|
"name": "k-try-shade",
|
|
4898
4898
|
"code": "\n $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );\n\n @if $_dark-theme {\n @return k-color-tint( $color, $level );\n }\n\n @return k-color-shade( $color, $level );\n",
|
|
4899
4899
|
"line": {
|
|
4900
|
-
"start":
|
|
4901
|
-
"end":
|
|
4900
|
+
"start": 60,
|
|
4901
|
+
"end": 68
|
|
4902
4902
|
}
|
|
4903
4903
|
}
|
|
4904
4904
|
},
|
|
@@ -4909,8 +4909,8 @@
|
|
|
4909
4909
|
"name": "k-try-tint",
|
|
4910
4910
|
"code": "\n $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );\n\n @if $_dark-theme {\n @return k-color-shade( $color, $level );\n }\n\n @return k-color-tint( $color, $level );\n",
|
|
4911
4911
|
"line": {
|
|
4912
|
-
"start":
|
|
4913
|
-
"end":
|
|
4912
|
+
"start": 76,
|
|
4913
|
+
"end": 84
|
|
4914
4914
|
}
|
|
4915
4915
|
}
|
|
4916
4916
|
},
|
|
@@ -4921,8 +4921,8 @@
|
|
|
4921
4921
|
"name": "k-try-darken",
|
|
4922
4922
|
"code": "\n $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );\n\n @if $_dark-theme {\n @return k-color-lighten( $color, $amount );\n }\n @return k-color-darken( $color, $amount );\n",
|
|
4923
4923
|
"line": {
|
|
4924
|
-
"start":
|
|
4925
|
-
"end":
|
|
4924
|
+
"start": 92,
|
|
4925
|
+
"end": 99
|
|
4926
4926
|
}
|
|
4927
4927
|
}
|
|
4928
4928
|
},
|
|
@@ -4933,8 +4933,8 @@
|
|
|
4933
4933
|
"name": "k-try-lighten",
|
|
4934
4934
|
"code": "\n $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );\n\n @if $_dark-theme {\n @return k-color-darken( $color, $amount );\n }\n @return k-color-lighten( $color, $amount );\n",
|
|
4935
4935
|
"line": {
|
|
4936
|
-
"start":
|
|
4937
|
-
"end":
|
|
4936
|
+
"start": 107,
|
|
4937
|
+
"end": 114
|
|
4938
4938
|
}
|
|
4939
4939
|
}
|
|
4940
4940
|
}
|
package/dist/meta/variables.json
CHANGED
|
@@ -19,6 +19,14 @@
|
|
|
19
19
|
"type": "Color",
|
|
20
20
|
"value": "white"
|
|
21
21
|
},
|
|
22
|
+
"kendo-light-color-level-step": {
|
|
23
|
+
"type": "Number",
|
|
24
|
+
"value": "8%"
|
|
25
|
+
},
|
|
26
|
+
"kendo-dark-color-level-step": {
|
|
27
|
+
"type": "Number",
|
|
28
|
+
"value": "16%"
|
|
29
|
+
},
|
|
22
30
|
"kendo-color-level-step": {
|
|
23
31
|
"type": "Number",
|
|
24
32
|
"value": "8%"
|
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": "6.1.1-dev.
|
|
4
|
+
"version": "6.1.1-dev.38+aedcf66cc",
|
|
5
5
|
"author": "Progress",
|
|
6
6
|
"license": "Apache-2.0",
|
|
7
7
|
"keywords": [
|
|
@@ -39,5 +39,5 @@
|
|
|
39
39
|
"prepublishOnly": "node ../../scripts/themes-prepublish.js",
|
|
40
40
|
"postpublish": "echo 'no postpublish for core theme'"
|
|
41
41
|
},
|
|
42
|
-
"gitHead": "
|
|
42
|
+
"gitHead": "aedcf66cc006856d53f3fde47acdeaf627f44a1c"
|
|
43
43
|
}
|
|
@@ -1,9 +1,14 @@
|
|
|
1
|
+
$kendo-light-color-level-step: 8% !default;
|
|
2
|
+
$kendo-dark-color-level-step: 16% !default;
|
|
3
|
+
|
|
1
4
|
/// Set a specific jump point for requesting color jumps
|
|
2
5
|
/// @group color-system
|
|
3
6
|
/// @access private
|
|
4
7
|
$kendo-color-level-step: 8% !default;
|
|
5
8
|
|
|
6
9
|
@function k-color-level( $color, $level: 0 ) {
|
|
10
|
+
$_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );
|
|
11
|
+
$_color-level-step: if( $_dark-theme, $kendo-dark-color-level-step, $kendo-light-color-level-step );
|
|
7
12
|
|
|
8
13
|
@if ( $level == 0 ) or ( $level == 0% ) {
|
|
9
14
|
@return $color;
|
|
@@ -17,7 +22,7 @@ $kendo-color-level-step: 8% !default;
|
|
|
17
22
|
@return k-color-mix( $base, $color, $level );
|
|
18
23
|
}
|
|
19
24
|
|
|
20
|
-
@return k-color-mix( $base, $color, $level * $
|
|
25
|
+
@return k-color-mix( $base, $color, k-math-clamp( $level * $_color-level-step, 0%, 100% ) );
|
|
21
26
|
}
|
|
22
27
|
|
|
23
28
|
/// Makes a color lighter by mixing it with white
|