@progress/kendo-theme-default 5.12.1-dev.1 → 5.12.1-dev.3
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 +11342 -11738
- package/dist/all.scss +11297 -11990
- package/dist/default-blue.scss +27 -29
- package/dist/default-dataviz-v4.scss +6 -7
- package/dist/default-green.scss +27 -29
- package/dist/default-main-dark.scss +27 -30
- package/dist/default-main.scss +27 -29
- package/dist/default-nordic.scss +27 -29
- package/dist/default-ocean-blue-a11y.scss +42 -0
- package/dist/default-ocean-blue.scss +29 -35
- package/dist/default-orange.scss +27 -29
- package/dist/default-purple.scss +27 -29
- package/dist/default-turquoise.scss +27 -29
- package/dist/default-urban.scss +27 -29
- package/lib/swatches/default-blue.json +32 -41
- package/lib/swatches/default-dataviz-v4.json +8 -7
- package/lib/swatches/default-green.json +33 -41
- package/lib/swatches/default-main-dark.json +31 -49
- package/lib/swatches/default-main.json +33 -41
- package/lib/swatches/default-nordic.json +33 -41
- package/lib/swatches/default-ocean-blue-a11y.json +258 -0
- package/lib/swatches/default-ocean-blue.json +35 -64
- package/lib/swatches/default-orange.json +33 -41
- package/lib/swatches/default-purple.json +33 -41
- package/lib/swatches/default-turquoise.json +33 -41
- package/lib/swatches/default-urban.json +33 -41
- package/package.json +5 -5
- package/scss/_variables.scss +96 -42
- package/scss/action-buttons/_layout.scss +4 -4
- package/scss/action-buttons/_theme.scss +4 -4
- package/scss/action-buttons/_variables.scss +9 -9
- package/scss/action-sheet/_layout.scss +41 -41
- package/scss/action-sheet/_theme.scss +27 -27
- package/scss/action-sheet/_variables.scss +64 -63
- package/scss/adaptive/_layout.scss +11 -15
- package/scss/adaptive/_theme.scss +12 -12
- package/scss/adaptive/_variables.scss +18 -18
- package/scss/appbar/_variables.scss +3 -3
- package/scss/avatar/_variables.scss +3 -3
- package/scss/badge/_index.scss +1 -1
- package/scss/badge/_variables.scss +32 -32
- package/scss/bottom-navigation/_index.scss +1 -1
- package/scss/bottom-navigation/_layout.scss +17 -17
- package/scss/bottom-navigation/_theme.scss +4 -4
- package/scss/bottom-navigation/_variables.scss +23 -23
- package/scss/breadcrumb/_layout.scss +16 -16
- package/scss/breadcrumb/_theme.scss +42 -24
- package/scss/breadcrumb/_variables.scss +46 -41
- package/scss/button/_index.scss +0 -1
- package/scss/button/_layout.scss +2 -2
- package/scss/button/_theme.scss +7 -7
- package/scss/button/_variables.scss +37 -34
- package/scss/calendar/_layout.scss +49 -53
- package/scss/calendar/_theme.scss +52 -52
- package/scss/calendar/_variables.scss +104 -103
- package/scss/captcha/_index.scss +1 -1
- package/scss/captcha/_layout.scss +10 -10
- package/scss/captcha/_theme.scss +3 -3
- package/scss/captcha/_variables.scss +14 -14
- package/scss/card/_index.scss +2 -2
- package/scss/card/_layout.scss +45 -45
- package/scss/card/_theme.scss +15 -15
- package/scss/card/_variables.scss +55 -55
- package/scss/chat/_layout.scss +59 -59
- package/scss/chat/_theme.scss +28 -28
- package/scss/chat/_variables.scss +57 -57
- package/scss/checkbox/_index.scss +0 -2
- package/scss/checkbox/_theme.scss +2 -2
- package/scss/checkbox/_variables.scss +4 -1
- package/scss/chip/_index.scss +0 -1
- package/scss/chip/_layout.scss +1 -1
- package/scss/chip/_theme.scss +13 -13
- package/scss/chip/_variables.scss +32 -29
- package/scss/color-preview/_layout.scss +6 -6
- package/scss/color-preview/_theme.scss +4 -4
- package/scss/color-preview/_variables.scss +11 -11
- package/scss/coloreditor/_layout.scss +18 -18
- package/scss/coloreditor/_theme.scss +6 -6
- package/scss/coloreditor/_variables.scss +24 -24
- package/scss/colorgradient/_index.scss +2 -2
- package/scss/colorgradient/_layout.scss +39 -39
- package/scss/colorgradient/_theme.scss +13 -13
- package/scss/colorgradient/_variables.scss +50 -50
- package/scss/colorpalette/_index.scss +1 -1
- package/scss/colorpalette/_layout.scss +5 -5
- package/scss/colorpalette/_theme.scss +3 -3
- package/scss/colorpalette/_variables.scss +8 -8
- package/scss/common/_base.scss +1 -1
- package/scss/common/_dragdrop.scss +13 -13
- package/scss/common/_index.scss +0 -2
- package/scss/dataviz/_index.scss +0 -1
- package/scss/dataviz/_layout.scss +75 -75
- package/scss/dataviz/_theme.scss +20 -18
- package/scss/dataviz/_variables.scss +101 -97
- package/scss/datetimepicker/_layout.scss +3 -3
- package/scss/datetimepicker/_variables.scss +1 -1
- package/scss/dialog/_variables.scss +3 -3
- package/scss/draggable/_layout.scss +23 -23
- package/scss/draggable/_theme.scss +5 -5
- package/scss/draggable/_variables.scss +20 -20
- package/scss/drawer/_theme.scss +1 -1
- package/scss/drawer/_variables.scss +5 -5
- package/scss/dropdowngrid/_index.scss +4 -7
- package/scss/dropdowngrid/_variables.scss +1 -0
- package/scss/dropdowntree/_layout.scss +2 -2
- package/scss/dropdowntree/_variables.scss +2 -2
- package/scss/dropzone/_layout.scss +12 -12
- package/scss/dropzone/_theme.scss +7 -7
- package/scss/dropzone/_variables.scss +21 -20
- package/scss/editor/_layout.scss +3 -3
- package/scss/editor/_variables.scss +3 -3
- package/scss/expansion-panel/_index.scss +2 -2
- package/scss/expansion-panel/_layout.scss +9 -9
- package/scss/expansion-panel/_theme.scss +12 -12
- package/scss/expansion-panel/_variables.scss +22 -22
- package/scss/fab/_index.scss +1 -1
- package/scss/fab/_layout.scss +4 -4
- package/scss/fab/_theme.scss +14 -6
- package/scss/fab/_variables.scss +10 -10
- package/scss/filemanager/_layout.scss +26 -26
- package/scss/filemanager/_theme.scss +31 -31
- package/scss/filemanager/_variables.scss +59 -59
- package/scss/filter/_layout.scss +15 -15
- package/scss/filter/_theme.scss +3 -3
- package/scss/filter/_variables.scss +8 -8
- package/scss/floating-label/_layout.scss +19 -19
- package/scss/floating-label/_theme.scss +4 -4
- package/scss/floating-label/_variables.scss +14 -14
- package/scss/forms/_index.scss +0 -4
- package/scss/forms/_layout.scss +15 -11
- package/scss/forms/_variables.scss +19 -12
- package/scss/gantt/_index.scss +1 -1
- package/scss/gantt/_layout.scss +49 -44
- package/scss/gantt/_theme.scss +60 -60
- package/scss/gantt/_variables.scss +96 -92
- package/scss/grid/_index.scss +2 -2
- package/scss/grid/_layout.scss +19 -19
- package/scss/grid/_theme.scss +8 -8
- package/scss/grid/_variables.scss +80 -80
- package/scss/icons/_layout.scss +6 -1093
- package/scss/imageeditor/_layout.scss +19 -19
- package/scss/imageeditor/_theme.scss +13 -13
- package/scss/imageeditor/_variables.scss +31 -31
- package/scss/input/_layout.scss +1 -1
- package/scss/input/_theme.scss +24 -24
- package/scss/input/_variables.scss +36 -36
- package/scss/list/_layout.scss +2 -2
- package/scss/list/_theme.scss +1 -1
- package/scss/list/_variables.scss +66 -72
- package/scss/listbox/_variables.scss +3 -3
- package/scss/listgroup/_layout.scss +15 -15
- package/scss/listgroup/_theme.scss +3 -3
- package/scss/listgroup/_variables.scss +10 -10
- package/scss/listview/_index.scss +2 -2
- package/scss/listview/_theme.scss +1 -1
- package/scss/listview/_variables.scss +3 -3
- package/scss/loader/_layout.scss +40 -40
- package/scss/loader/_variables.scss +31 -30
- package/scss/map/_index.scss +1 -1
- package/scss/map/_layout.scss +16 -16
- package/scss/map/_theme.scss +5 -5
- package/scss/map/_variables.scss +21 -21
- package/scss/mediaplayer/_layout.scss +5 -5
- package/scss/mediaplayer/_theme.scss +6 -6
- package/scss/mediaplayer/_variables.scss +13 -13
- package/scss/menu/_layout.scss +39 -39
- package/scss/menu/_theme.scss +26 -26
- package/scss/menu/_variables.scss +67 -66
- package/scss/messagebox/_layout.scss +7 -7
- package/scss/messagebox/_theme.scss +3 -3
- package/scss/messagebox/_variables.scss +11 -11
- package/scss/multiselect/_index.scss +0 -1
- package/scss/notification/_variables.scss +5 -5
- package/scss/orgchart/_index.scss +1 -1
- package/scss/orgchart/_layout.scss +26 -26
- package/scss/orgchart/_theme.scss +13 -13
- package/scss/orgchart/_variables.scss +56 -56
- package/scss/overlay/_layout.scss +1 -1
- package/scss/overlay/_theme.scss +2 -2
- package/scss/overlay/_variables.scss +3 -3
- package/scss/pager/_index.scss +0 -2
- package/scss/pager/_layout.scss +1 -1
- package/scss/pager/_theme.scss +6 -6
- package/scss/pager/_variables.scss +38 -34
- package/scss/panelbar/_layout.scss +17 -17
- package/scss/panelbar/_theme.scss +70 -70
- package/scss/panelbar/_variables.scss +104 -103
- package/scss/pdf-viewer/_index.scss +1 -2
- package/scss/pdf-viewer/_layout.scss +13 -13
- package/scss/pdf-viewer/_theme.scss +21 -21
- package/scss/pdf-viewer/_variables.scss +45 -44
- package/scss/pivotgrid/_index.scss +5 -5
- package/scss/pivotgrid/_layout.scss +45 -45
- package/scss/pivotgrid/_theme.scss +52 -52
- package/scss/pivotgrid/_variables.scss +89 -86
- package/scss/popover/_layout.scss +19 -17
- package/scss/popover/_theme.scss +7 -7
- package/scss/popover/_variables.scss +26 -26
- package/scss/popup/_layout.scss +7 -7
- package/scss/popup/_theme.scss +4 -4
- package/scss/popup/_variables.scss +12 -12
- package/scss/progressbar/_layout.scss +1 -1
- package/scss/progressbar/_variables.scss +2 -2
- package/scss/radio/_index.scss +0 -3
- package/scss/radio/_theme.scss +2 -2
- package/scss/radio/_variables.scss +5 -1
- package/scss/rating/_layout.scss +11 -11
- package/scss/rating/_theme.scss +6 -6
- package/scss/rating/_variables.scss +17 -16
- package/scss/scheduler/_layout.scss +36 -55
- package/scss/scheduler/_theme.scss +51 -51
- package/scss/scheduler/_variables.scss +93 -93
- package/scss/scrollview/_layout.scss +16 -16
- package/scss/scrollview/_theme.scss +23 -23
- package/scss/scrollview/_variables.scss +32 -32
- package/scss/signature/_variables.scss +18 -18
- package/scss/skeleton/_layout.scss +4 -4
- package/scss/skeleton/_theme.scss +2 -2
- package/scss/skeleton/_variables.scss +6 -6
- package/scss/slider/_layout.scss +26 -26
- package/scss/slider/_theme.scss +21 -21
- package/scss/slider/_variables.scss +44 -44
- package/scss/split-button/_layout.scss +3 -4
- package/scss/split-button/_theme.scss +1 -1
- package/scss/split-button/_variables.scss +6 -6
- package/scss/splitter/_layout.scss +15 -15
- package/scss/splitter/_theme.scss +10 -10
- package/scss/splitter/_variables.scss +18 -18
- package/scss/spreadsheet/_layout.scss +30 -30
- package/scss/spreadsheet/_theme.scss +20 -20
- package/scss/spreadsheet/_variables.scss +29 -29
- package/scss/stepper/_layout.scss +36 -37
- package/scss/stepper/_theme.scss +44 -45
- package/scss/stepper/_variables.scss +86 -86
- package/scss/switch/_index.scss +1 -1
- package/scss/switch/_theme.scss +10 -2
- package/scss/switch/_variables.scss +7 -7
- package/scss/table/_index.scss +0 -8
- package/scss/table/_theme.scss +1 -1
- package/scss/table/_variables.scss +21 -18
- package/scss/tabstrip/_layout.scss +31 -31
- package/scss/tabstrip/_theme.scss +26 -26
- package/scss/tabstrip/_variables.scss +42 -41
- package/scss/taskboard/_index.scss +1 -1
- package/scss/taskboard/_layout.scss +34 -34
- package/scss/taskboard/_theme.scss +32 -32
- package/scss/taskboard/_variables.scss +93 -93
- package/scss/tilelayout/_layout.scss +4 -4
- package/scss/tilelayout/_theme.scss +4 -4
- package/scss/tilelayout/_variables.scss +8 -8
- package/scss/timedurationpicker/_index.scss +1 -1
- package/scss/timeline/_layout.scss +55 -55
- package/scss/timeline/_theme.scss +15 -15
- package/scss/timeline/_variables.scss +50 -50
- package/scss/timeselector/_layout.scss +18 -18
- package/scss/timeselector/_theme.scss +13 -11
- package/scss/timeselector/_variables.scss +37 -36
- package/scss/toolbar/_layout.scss +11 -11
- package/scss/toolbar/_theme.scss +2 -2
- package/scss/toolbar/_variables.scss +24 -24
- package/scss/tooltip/_layout.scss +22 -22
- package/scss/tooltip/_theme.scss +25 -25
- package/scss/tooltip/_variables.scss +29 -29
- package/scss/treelist/_index.scss +1 -1
- package/scss/treeview/_layout.scss +6 -6
- package/scss/treeview/_theme.scss +2 -2
- package/scss/treeview/_variables.scss +30 -30
- package/scss/typography/_index.scss +0 -1
- package/scss/typography/_layout.scss +77 -77
- package/scss/typography/_theme.scss +3 -3
- package/scss/typography/_variables.scss +84 -128
- package/scss/upload/_index.scss +0 -1
- package/scss/upload/_layout.scss +1 -1
- package/scss/upload/_theme.scss +5 -1
- package/scss/upload/_variables.scss +6 -5
- package/scss/utils/_index.scss +0 -22
- package/scss/validator/_layout.scss +1 -1
- package/scss/window/_theme.scss +1 -1
- package/scss/window/_variables.scss +9 -5
- package/scss/wizard/_layout.scss +11 -11
- package/scss/wizard/_theme.scss +1 -1
- package/scss/wizard/_variables.scss +10 -10
- package/scss/icons/font/WebComponentsIcons.scss +0 -3
- package/scss/icons/font/WebComponentsIcons.ttf +0 -0
- package/scss/utils/_aspect-ratio.scss +0 -32
- package/scss/utils/_border.scss +0 -109
- package/scss/utils/_display.scss +0 -41
- package/scss/utils/_flex.scss +0 -189
- package/scss/utils/_float.scss +0 -85
- package/scss/utils/_grid.scss +0 -45
- package/scss/utils/_order.scss +0 -54
- package/scss/utils/_overflow.scss +0 -87
- package/scss/utils/_pointer-events.scss +0 -30
- package/scss/utils/_position.scss +0 -209
- package/scss/utils/_resize.scss +0 -47
- package/scss/utils/_spacer.scss +0 -16
- package/scss/utils/_spacing.scss +0 -162
- package/scss/utils/_table-layout.scss +0 -17
- package/scss/utils/_text.scss +0 -154
- package/scss/utils/_theme-colors.scss +0 -47
- package/scss/utils/_touch-action.scss +0 -30
- package/scss/utils/_transform.scss +0 -105
- package/scss/utils/_user-select.scss +0 -51
|
@@ -3,8 +3,8 @@
|
|
|
3
3
|
|
|
4
4
|
// Dependencies
|
|
5
5
|
@import "../common/_index.scss";
|
|
6
|
-
@import "../utils/_flex.scss";
|
|
7
|
-
@import "../utils/_spacer.scss";
|
|
6
|
+
// @import "../utils/_flex.scss";
|
|
7
|
+
// @import "../utils/_spacer.scss";
|
|
8
8
|
@import "../icons/_index.scss";
|
|
9
9
|
@import "../button/_index.scss";
|
|
10
10
|
@import "../slider/_index.scss";
|
|
@@ -2,20 +2,20 @@
|
|
|
2
2
|
|
|
3
3
|
// ColorGradient
|
|
4
4
|
.k-colorgradient {
|
|
5
|
-
@include border-radius( $
|
|
6
|
-
width: $
|
|
7
|
-
padding: $
|
|
5
|
+
@include border-radius( $kendo-color-gradient-border-radius );
|
|
6
|
+
width: $kendo-color-gradient-width;
|
|
7
|
+
padding: $kendo-color-gradient-padding-y $kendo-color-gradient-padding-x;
|
|
8
8
|
border-style: solid;
|
|
9
|
-
border-width: $
|
|
9
|
+
border-width: $kendo-color-gradient-border-width;
|
|
10
10
|
box-sizing: border-box;
|
|
11
11
|
outline: 0;
|
|
12
|
-
font-size: $
|
|
13
|
-
font-family: $
|
|
14
|
-
line-height: $
|
|
12
|
+
font-size: $kendo-color-gradient-font-size;
|
|
13
|
+
font-family: $kendo-color-gradient-font-family;
|
|
14
|
+
line-height: $kendo-color-gradient-line-height;
|
|
15
15
|
display: flex;
|
|
16
16
|
flex-direction: column;
|
|
17
17
|
align-items: stretch;
|
|
18
|
-
gap: $
|
|
18
|
+
gap: $kendo-color-gradient-gap;
|
|
19
19
|
-webkit-touch-callout: none;
|
|
20
20
|
-webkit-tap-highlight-color: $kendo-color-rgba-transparent;
|
|
21
21
|
|
|
@@ -28,23 +28,23 @@
|
|
|
28
28
|
|
|
29
29
|
// Canvas
|
|
30
30
|
.k-colorgradient-canvas {
|
|
31
|
-
gap: $
|
|
31
|
+
gap: $kendo-color-gradient-canvas-gap;
|
|
32
32
|
|
|
33
33
|
.k-hsv-rectangle {
|
|
34
|
-
@include border-radius( $
|
|
34
|
+
@include border-radius( $kendo-color-gradient-canvas-border-radius );
|
|
35
35
|
position: relative;
|
|
36
36
|
flex: 1 1 auto;
|
|
37
37
|
user-select: none;
|
|
38
38
|
}
|
|
39
39
|
|
|
40
40
|
.k-hsv-gradient {
|
|
41
|
-
@include border-radius( $
|
|
42
|
-
height: $
|
|
41
|
+
@include border-radius( $kendo-color-gradient-canvas-border-radius );
|
|
42
|
+
height: $kendo-color-gradient-canvas-rectangle-height;
|
|
43
43
|
}
|
|
44
44
|
|
|
45
45
|
.k-hsv-draghandle {
|
|
46
|
-
margin-top: $
|
|
47
|
-
margin-left: $
|
|
46
|
+
margin-top: $kendo-color-gradient-canvas-draghandle-margin-y;
|
|
47
|
+
margin-left: $kendo-color-gradient-canvas-draghandle-margin-x;
|
|
48
48
|
position: absolute;
|
|
49
49
|
top: 50%;
|
|
50
50
|
left: 50%;
|
|
@@ -55,16 +55,16 @@
|
|
|
55
55
|
.k-hsv-controls {
|
|
56
56
|
position: relative;
|
|
57
57
|
flex-shrink: 0;
|
|
58
|
-
gap: $
|
|
58
|
+
gap: $kendo-color-gradient-canvas-gap;
|
|
59
59
|
}
|
|
60
60
|
}
|
|
61
61
|
|
|
62
62
|
// DragHandle
|
|
63
63
|
.k-colorgradient .k-draghandle {
|
|
64
|
-
@include border-radius( $
|
|
65
|
-
width: $
|
|
66
|
-
height: $
|
|
67
|
-
border-width: $
|
|
64
|
+
@include border-radius( $kendo-color-gradient-draghandle-border-radius );
|
|
65
|
+
width: $kendo-color-gradient-draghandle-width;
|
|
66
|
+
height: $kendo-color-gradient-draghandle-height;
|
|
67
|
+
border-width: $kendo-color-gradient-draghandle-border-width;
|
|
68
68
|
border-style: solid;
|
|
69
69
|
box-sizing: border-box;
|
|
70
70
|
}
|
|
@@ -73,25 +73,25 @@
|
|
|
73
73
|
.k-colorgradient-slider {
|
|
74
74
|
|
|
75
75
|
&.k-slider-vertical {
|
|
76
|
-
width: $
|
|
77
|
-
height: $
|
|
78
|
-
flex: 0 0 $
|
|
76
|
+
width: $kendo-color-gradient-slider-track-size;
|
|
77
|
+
height: $kendo-color-gradient-slider-vertical-size;
|
|
78
|
+
flex: 0 0 $kendo-color-gradient-slider-track-size;
|
|
79
79
|
}
|
|
80
80
|
&.k-slider-vertical .k-slider-track {
|
|
81
|
-
width: $
|
|
82
|
-
border-radius: $
|
|
83
|
-
margin-left: - k-math-div( $
|
|
81
|
+
width: $kendo-color-gradient-slider-track-size;
|
|
82
|
+
border-radius: $kendo-color-gradient-slider-border-radius;
|
|
83
|
+
margin-left: - k-math-div( $kendo-color-gradient-slider-track-size, 2 );
|
|
84
84
|
}
|
|
85
85
|
|
|
86
86
|
&.k-slider-horizontal {
|
|
87
|
-
width: $
|
|
88
|
-
height: $
|
|
89
|
-
flex: 0 0 $
|
|
87
|
+
width: $kendo-color-gradient-slider-horizontal-size;
|
|
88
|
+
height: $kendo-color-gradient-slider-track-size;
|
|
89
|
+
flex: 0 0 $kendo-color-gradient-slider-track-size;
|
|
90
90
|
}
|
|
91
91
|
&.k-slider-horizontal .k-slider-track {
|
|
92
|
-
height: $
|
|
93
|
-
border-radius: $
|
|
94
|
-
margin-top: - k-math-div( $
|
|
92
|
+
height: $kendo-color-gradient-slider-track-size;
|
|
93
|
+
border-radius: $kendo-color-gradient-slider-border-radius;
|
|
94
|
+
margin-top: - k-math-div( $kendo-color-gradient-slider-track-size, 2 );
|
|
95
95
|
}
|
|
96
96
|
|
|
97
97
|
&.k-alpha-slider .k-slider-track::before {
|
|
@@ -114,24 +114,24 @@
|
|
|
114
114
|
}
|
|
115
115
|
|
|
116
116
|
.k-draghandle {
|
|
117
|
-
border-width: $
|
|
117
|
+
border-width: $kendo-color-gradient-slider-draghandle-border-width;
|
|
118
118
|
}
|
|
119
119
|
}
|
|
120
120
|
|
|
121
121
|
// Inputs
|
|
122
122
|
.k-colorgradient-inputs {
|
|
123
|
-
gap: $
|
|
123
|
+
gap: $kendo-color-gradient-input-gap;
|
|
124
124
|
|
|
125
125
|
.k-colorgradient-input-label {
|
|
126
126
|
text-transform: uppercase;
|
|
127
127
|
}
|
|
128
128
|
|
|
129
129
|
> .k-vstack {
|
|
130
|
-
gap: $
|
|
130
|
+
gap: $kendo-color-gradient-input-label-gap;
|
|
131
131
|
}
|
|
132
132
|
|
|
133
133
|
.k-numerictextbox {
|
|
134
|
-
width: $
|
|
134
|
+
width: $kendo-color-gradient-input-width;
|
|
135
135
|
}
|
|
136
136
|
|
|
137
137
|
.k-input-inner {
|
|
@@ -148,21 +148,21 @@
|
|
|
148
148
|
> div {
|
|
149
149
|
display: flex;
|
|
150
150
|
flex-flow: row nowrap;
|
|
151
|
-
gap: $
|
|
151
|
+
gap: $kendo-color-gradient-contrast-spacer;
|
|
152
152
|
}
|
|
153
153
|
|
|
154
154
|
.k-contrast-ratio {
|
|
155
|
-
margin-bottom: $
|
|
155
|
+
margin-bottom: $kendo-color-gradient-contrast-spacer;
|
|
156
156
|
}
|
|
157
157
|
|
|
158
158
|
.k-contrast-ratio-text {
|
|
159
|
-
font-weight: $
|
|
159
|
+
font-weight: $kendo-color-gradient-contrast-ratio-font-weight;
|
|
160
160
|
}
|
|
161
161
|
|
|
162
162
|
.k-contrast-validation {
|
|
163
163
|
display: inline-flex;
|
|
164
164
|
align-items: center;
|
|
165
|
-
gap: k-math-div( $
|
|
165
|
+
gap: k-math-div( $kendo-color-gradient-contrast-spacer, 2 );
|
|
166
166
|
|
|
167
167
|
.k-icon {
|
|
168
168
|
vertical-align: middle;
|
|
@@ -3,16 +3,16 @@
|
|
|
3
3
|
// ColorGradient
|
|
4
4
|
.k-colorgradient {
|
|
5
5
|
@include fill(
|
|
6
|
-
$
|
|
7
|
-
$
|
|
8
|
-
$
|
|
6
|
+
$kendo-color-gradient-text,
|
|
7
|
+
$kendo-color-gradient-bg,
|
|
8
|
+
$kendo-color-gradient-border
|
|
9
9
|
);
|
|
10
10
|
}
|
|
11
11
|
|
|
12
12
|
.k-colorgradient:focus,
|
|
13
13
|
.k-colorgradient.k-focus {
|
|
14
|
-
@include fill( $border: $
|
|
15
|
-
@include
|
|
14
|
+
@include fill( $border: $kendo-color-gradient-focus-border );
|
|
15
|
+
@include focus-indicator( $kendo-color-gradient-focus-shadow );
|
|
16
16
|
}
|
|
17
17
|
|
|
18
18
|
// Canvas
|
|
@@ -23,16 +23,16 @@
|
|
|
23
23
|
// DragHandle
|
|
24
24
|
.k-colorgradient .k-draghandle {
|
|
25
25
|
@include fill(
|
|
26
|
-
$
|
|
27
|
-
$
|
|
28
|
-
$
|
|
26
|
+
$kendo-color-gradient-draghandle-text,
|
|
27
|
+
$kendo-color-gradient-draghandle-bg,
|
|
28
|
+
$kendo-color-gradient-draghandle-border
|
|
29
29
|
);
|
|
30
|
-
@include box-shadow( $
|
|
30
|
+
@include box-shadow( $kendo-color-gradient-draghandle-shadow );
|
|
31
31
|
|
|
32
32
|
&:focus,
|
|
33
33
|
&.k-focus {
|
|
34
34
|
@include fill( $bg: transparent, $border: $kendo-color-white );
|
|
35
|
-
@include
|
|
35
|
+
@include focus-indicator( $kendo-color-gradient-draghandle-focus-shadow );
|
|
36
36
|
}
|
|
37
37
|
|
|
38
38
|
&:hover,
|
|
@@ -40,7 +40,7 @@
|
|
|
40
40
|
&.k-active,
|
|
41
41
|
&:active {
|
|
42
42
|
@include fill( $bg: transparent, $border: $kendo-color-white );
|
|
43
|
-
@include box-shadow( $
|
|
43
|
+
@include box-shadow( $kendo-color-gradient-draghandle-hover-shadow );
|
|
44
44
|
}
|
|
45
45
|
}
|
|
46
46
|
|
|
@@ -56,12 +56,12 @@
|
|
|
56
56
|
}
|
|
57
57
|
|
|
58
58
|
.k-colorgradient-slider.k-alpha-slider .k-slider-track::before {
|
|
59
|
-
background: url(k-map-get($data-uris, "alpha-slider-bgr.png")) center repeat;
|
|
59
|
+
background: url(k-map-get($_kendo-data-uris, "alpha-slider-bgr.png")) center repeat;
|
|
60
60
|
}
|
|
61
61
|
|
|
62
62
|
// Inputs
|
|
63
63
|
.k-colorgradient-input-label {
|
|
64
|
-
@include fill( $color: $
|
|
64
|
+
@include fill( $color: $kendo-color-gradient-input-label-text );
|
|
65
65
|
}
|
|
66
66
|
|
|
67
67
|
}
|
|
@@ -1,51 +1,51 @@
|
|
|
1
1
|
// ColorGradient
|
|
2
|
-
$
|
|
3
|
-
|
|
4
|
-
$
|
|
5
|
-
$
|
|
6
|
-
$
|
|
7
|
-
$
|
|
8
|
-
$
|
|
9
|
-
$
|
|
10
|
-
$
|
|
11
|
-
$
|
|
12
|
-
$
|
|
13
|
-
$
|
|
14
|
-
$
|
|
15
|
-
$
|
|
16
|
-
|
|
17
|
-
$
|
|
18
|
-
$
|
|
19
|
-
|
|
20
|
-
$
|
|
21
|
-
$
|
|
22
|
-
$
|
|
23
|
-
|
|
24
|
-
$
|
|
25
|
-
$
|
|
26
|
-
$
|
|
27
|
-
|
|
28
|
-
$
|
|
29
|
-
$
|
|
30
|
-
|
|
31
|
-
$
|
|
32
|
-
$
|
|
33
|
-
$
|
|
34
|
-
$
|
|
35
|
-
$
|
|
36
|
-
$
|
|
37
|
-
$
|
|
38
|
-
$
|
|
39
|
-
$
|
|
40
|
-
$
|
|
41
|
-
|
|
42
|
-
$
|
|
43
|
-
$
|
|
44
|
-
|
|
45
|
-
$
|
|
46
|
-
$
|
|
47
|
-
$
|
|
48
|
-
$
|
|
49
|
-
|
|
50
|
-
$
|
|
51
|
-
$
|
|
2
|
+
$kendo-color-gradient-spacer: k-map-get( $kendo-spacing, 3 ) !default;
|
|
3
|
+
|
|
4
|
+
$kendo-color-gradient-width: 272px !default;
|
|
5
|
+
$kendo-color-gradient-border-width: 1px !default;
|
|
6
|
+
$kendo-color-gradient-border-radius: $kendo-border-radius-md !default;
|
|
7
|
+
$kendo-color-gradient-padding-y: $kendo-color-gradient-spacer !default;
|
|
8
|
+
$kendo-color-gradient-padding-x: $kendo-color-gradient-padding-y !default;
|
|
9
|
+
$kendo-color-gradient-gap: $kendo-color-gradient-spacer !default;
|
|
10
|
+
$kendo-color-gradient-font-family: $kendo-font-family !default;
|
|
11
|
+
$kendo-color-gradient-font-size: $kendo-font-size-md !default;
|
|
12
|
+
$kendo-color-gradient-line-height: $kendo-line-height-md !default;
|
|
13
|
+
$kendo-color-gradient-bg: $kendo-component-bg !default;
|
|
14
|
+
$kendo-color-gradient-text: $kendo-component-text !default;
|
|
15
|
+
$kendo-color-gradient-border: $kendo-component-border !default;
|
|
16
|
+
|
|
17
|
+
$kendo-color-gradient-focus-border: null !default;
|
|
18
|
+
$kendo-color-gradient-focus-shadow: 1px 1px 7px 1px rgba(0, 0, 0, .3) !default;
|
|
19
|
+
|
|
20
|
+
$kendo-color-gradient-canvas-border-radius: $kendo-border-radius-md !default;
|
|
21
|
+
$kendo-color-gradient-canvas-gap: $kendo-color-gradient-spacer !default;
|
|
22
|
+
$kendo-color-gradient-canvas-rectangle-height: 180px !default;
|
|
23
|
+
|
|
24
|
+
$kendo-color-gradient-slider-track-size: 10px !default;
|
|
25
|
+
$kendo-color-gradient-slider-border-radius: 10px !default;
|
|
26
|
+
$kendo-color-gradient-slider-draghandle-border-width: 3px !default;
|
|
27
|
+
|
|
28
|
+
$kendo-color-gradient-slider-vertical-size: 180px !default;
|
|
29
|
+
$kendo-color-gradient-slider-horizontal-size: 100% !default;
|
|
30
|
+
|
|
31
|
+
$kendo-color-gradient-draghandle-width: 14px !default;
|
|
32
|
+
$kendo-color-gradient-draghandle-height: 14px !default;
|
|
33
|
+
$kendo-color-gradient-draghandle-border-width: 1px !default;
|
|
34
|
+
$kendo-color-gradient-draghandle-border-radius: 50% !default;
|
|
35
|
+
$kendo-color-gradient-draghandle-bg: transparent !default;
|
|
36
|
+
$kendo-color-gradient-draghandle-text: null !default;
|
|
37
|
+
$kendo-color-gradient-draghandle-border: rgba( $kendo-color-white, .8) !default;
|
|
38
|
+
$kendo-color-gradient-draghandle-shadow: 0 1px 4px rgba(0, 0, 0, .5) !default;
|
|
39
|
+
$kendo-color-gradient-draghandle-focus-shadow: 0 1px 4px black !default;
|
|
40
|
+
$kendo-color-gradient-draghandle-hover-shadow: $kendo-color-gradient-draghandle-focus-shadow !default;
|
|
41
|
+
|
|
42
|
+
$kendo-color-gradient-canvas-draghandle-margin-y: - k-math-div( $kendo-color-gradient-draghandle-height, 2 ) !default;
|
|
43
|
+
$kendo-color-gradient-canvas-draghandle-margin-x: - k-math-div( $kendo-color-gradient-draghandle-width, 2 ) !default;
|
|
44
|
+
|
|
45
|
+
$kendo-color-gradient-input-width: 46px !default;
|
|
46
|
+
$kendo-color-gradient-input-gap: k-math-div( $kendo-color-gradient-spacer, 1.5 ) !default;
|
|
47
|
+
$kendo-color-gradient-input-label-gap: k-math-div( $kendo-color-gradient-spacer, 3 ) !default;
|
|
48
|
+
$kendo-color-gradient-input-label-text: $kendo-subtle-text !default;
|
|
49
|
+
|
|
50
|
+
$kendo-color-gradient-contrast-ratio-font-weight: $kendo-font-weight-bold !default;
|
|
51
|
+
$kendo-color-gradient-contrast-spacer: k-math-div( $kendo-color-gradient-spacer, 1.5 ) !default;
|
|
@@ -5,9 +5,9 @@
|
|
|
5
5
|
border-width: 0;
|
|
6
6
|
box-sizing: border-box;
|
|
7
7
|
outline: 0;
|
|
8
|
-
font-size: $
|
|
9
|
-
font-family: $
|
|
10
|
-
line-height: $
|
|
8
|
+
font-size: $kendo-color-palette-font-size;
|
|
9
|
+
font-family: $kendo-color-palette-font-family;
|
|
10
|
+
line-height: $kendo-color-palette-line-height;
|
|
11
11
|
display: inline-flex;
|
|
12
12
|
position: relative;
|
|
13
13
|
-webkit-touch-callout: none;
|
|
@@ -30,8 +30,8 @@
|
|
|
30
30
|
|
|
31
31
|
// Tile
|
|
32
32
|
.k-colorpalette-tile {
|
|
33
|
-
width: $
|
|
34
|
-
height: $
|
|
33
|
+
width: $kendo-color-palette-tile-width;
|
|
34
|
+
height: $kendo-color-palette-tile-height;
|
|
35
35
|
box-sizing: border-box;
|
|
36
36
|
overflow: hidden;
|
|
37
37
|
cursor: pointer;
|
|
@@ -5,17 +5,17 @@
|
|
|
5
5
|
|
|
6
6
|
&:focus,
|
|
7
7
|
&.k-focus {
|
|
8
|
-
@include
|
|
8
|
+
@include focus-indicator( $kendo-color-palette-tile-focus-shadow );
|
|
9
9
|
}
|
|
10
10
|
|
|
11
11
|
&:hover,
|
|
12
12
|
&.k-hover {
|
|
13
|
-
@include box-shadow( $
|
|
13
|
+
@include box-shadow( $kendo-color-palette-tile-hover-shadow );
|
|
14
14
|
}
|
|
15
15
|
|
|
16
16
|
&.k-selected,
|
|
17
17
|
&.k-selected:hover {
|
|
18
|
-
@include box-shadow( $
|
|
18
|
+
@include box-shadow( $kendo-color-palette-tile-selected-shadow );
|
|
19
19
|
}
|
|
20
20
|
|
|
21
21
|
}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
// Colorpalette
|
|
2
|
-
$
|
|
3
|
-
$
|
|
4
|
-
$
|
|
2
|
+
$kendo-color-palette-font-family: $kendo-font-family !default;
|
|
3
|
+
$kendo-color-palette-font-size: $kendo-font-size-md !default;
|
|
4
|
+
$kendo-color-palette-line-height: 0 !default;
|
|
5
5
|
|
|
6
|
-
$
|
|
7
|
-
$
|
|
8
|
-
$
|
|
9
|
-
$
|
|
10
|
-
$
|
|
6
|
+
$kendo-color-palette-tile-width: k-map-get( $kendo-spacing, 6 ) !default;
|
|
7
|
+
$kendo-color-palette-tile-height: $kendo-color-palette-tile-width !default;
|
|
8
|
+
$kendo-color-palette-tile-focus-shadow: 0 0 3px 1px rgba( black, .3 ), inset 0 0 0 1px rgba( white, .5 ) !default;
|
|
9
|
+
$kendo-color-palette-tile-hover-shadow: 0 0 3px 1px rgba( black, .3 ), inset 0 0 0 1px rgba( white, .8 ) !default;
|
|
10
|
+
$kendo-color-palette-tile-selected-shadow: 0 1px 3px 1px rgba( black, .3 ), inset 0 0 0 1px rgba( white, 1 ) !default;
|
package/scss/common/_base.scss
CHANGED
|
@@ -2,20 +2,20 @@
|
|
|
2
2
|
|
|
3
3
|
// Layout
|
|
4
4
|
.k-drag-clue {
|
|
5
|
-
@include border-radius( $drag-
|
|
6
|
-
padding: $drag-
|
|
7
|
-
border-width: $drag-
|
|
8
|
-
border-style: if( $drag-
|
|
5
|
+
@include border-radius( $kendo-drag-hint-border-radius );
|
|
6
|
+
padding: $kendo-drag-hint-padding-y $kendo-drag-hint-padding-x;
|
|
7
|
+
border-width: $kendo-drag-hint-border-width;
|
|
8
|
+
border-style: if( $kendo-drag-hint-border-width == null, null, solid );
|
|
9
9
|
box-sizing: border-box;
|
|
10
|
-
font-size: $drag-
|
|
11
|
-
font-family: $drag-
|
|
12
|
-
line-height: $drag-
|
|
10
|
+
font-size: $kendo-drag-hint-font-size;
|
|
11
|
+
font-family: $kendo-drag-hint-font-family;
|
|
12
|
+
line-height: $kendo-drag-hint-line-height;
|
|
13
13
|
display: inline-flex;
|
|
14
14
|
flex-flow: row nowrap;
|
|
15
15
|
align-items: center;
|
|
16
16
|
align-content: center;
|
|
17
17
|
white-space: nowrap;
|
|
18
|
-
opacity: $drag-
|
|
18
|
+
opacity: $kendo-drag-hint-opacity;
|
|
19
19
|
overflow: hidden;
|
|
20
20
|
position: absolute;
|
|
21
21
|
z-index: 20000;
|
|
@@ -31,12 +31,12 @@
|
|
|
31
31
|
// Theme
|
|
32
32
|
.k-drag-clue {
|
|
33
33
|
@include fill(
|
|
34
|
-
$drag-
|
|
35
|
-
$drag-
|
|
36
|
-
$drag-
|
|
37
|
-
$drag-
|
|
34
|
+
$kendo-drag-hint-text,
|
|
35
|
+
$kendo-drag-hint-bg,
|
|
36
|
+
$kendo-drag-hint-border,
|
|
37
|
+
$kendo-drag-hint-gradient
|
|
38
38
|
);
|
|
39
|
-
@include box-shadow( $drag-
|
|
39
|
+
@include box-shadow( $kendo-drag-hint-shadow );
|
|
40
40
|
}
|
|
41
41
|
|
|
42
42
|
}
|
package/scss/common/_index.scss
CHANGED