@syncfusion/ej2-dropdowns 19.4.56 → 20.1.51
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/CHANGELOG.md +4 -20
- package/dist/ej2-dropdowns.umd.min.js +2 -2
- package/dist/ej2-dropdowns.umd.min.js.map +1 -1
- package/dist/es6/ej2-dropdowns.es2015.js +32 -6
- package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
- package/dist/es6/ej2-dropdowns.es5.js +31 -5
- package/dist/es6/ej2-dropdowns.es5.js.map +1 -1
- package/dist/global/ej2-dropdowns.min.js +2 -2
- package/dist/global/ej2-dropdowns.min.js.map +1 -1
- package/dist/global/index.d.ts +1 -1
- package/package.json +11 -11
- package/src/common/incremental-search.d.ts +1 -0
- package/src/common/incremental-search.js +4 -0
- package/src/drop-down-base/drop-down-base.js +1 -0
- package/src/drop-down-tree/drop-down-tree.js +4 -0
- package/src/list-box/list-box.js +20 -3
- package/src/multi-select/multi-select.js +1 -1
- package/styles/auto-complete/_fluent-dark-definition.scss +1 -0
- package/styles/auto-complete/bootstrap5-dark.css +7 -0
- package/styles/auto-complete/bootstrap5.css +7 -0
- package/styles/auto-complete/fluent-dark.css +132 -0
- package/styles/auto-complete/fluent-dark.scss +4 -0
- package/styles/auto-complete/fluent.css +132 -0
- package/styles/auto-complete/fluent.scss +4 -0
- package/styles/auto-complete/tailwind-dark.css +1 -57
- package/styles/auto-complete/tailwind.css +1 -57
- package/styles/bootstrap-dark.css +56 -30
- package/styles/bootstrap.css +56 -30
- package/styles/bootstrap4.css +56 -30
- package/styles/bootstrap5-dark.css +116 -40
- package/styles/bootstrap5.css +116 -40
- package/styles/combo-box/_fluent-dark-definition.scss +1 -0
- package/styles/combo-box/bootstrap5-dark.css +7 -0
- package/styles/combo-box/bootstrap5.css +7 -0
- package/styles/combo-box/fluent-dark.css +132 -0
- package/styles/combo-box/fluent-dark.scss +4 -0
- package/styles/combo-box/fluent.css +132 -0
- package/styles/combo-box/fluent.scss +4 -0
- package/styles/combo-box/tailwind-dark.css +1 -57
- package/styles/combo-box/tailwind.css +1 -57
- package/styles/drop-down-base/_bootstrap-dark-definition.scss +2 -0
- package/styles/drop-down-base/_bootstrap-definition.scss +2 -0
- package/styles/drop-down-base/_bootstrap4-definition.scss +2 -0
- package/styles/drop-down-base/_bootstrap5-definition.scss +2 -0
- package/styles/drop-down-base/_fabric-dark-definition.scss +2 -0
- package/styles/drop-down-base/_fabric-definition.scss +2 -0
- package/styles/drop-down-base/_fluent-dark-definition.scss +1 -0
- package/styles/drop-down-base/_fluent-definition.scss +12 -7
- package/styles/drop-down-base/_highcontrast-definition.scss +2 -0
- package/styles/drop-down-base/_highcontrast-light-definition.scss +2 -0
- package/styles/drop-down-base/_layout.scss +40 -4
- package/styles/drop-down-base/_material-dark-definition.scss +2 -0
- package/styles/drop-down-base/_material-definition.scss +2 -0
- package/styles/drop-down-base/_tailwind-definition.scss +17 -8
- package/styles/drop-down-base/_theme.scss +82 -3
- package/styles/drop-down-base/bootstrap-dark.css +7 -2
- package/styles/drop-down-base/bootstrap.css +7 -2
- package/styles/drop-down-base/bootstrap4.css +7 -2
- package/styles/drop-down-base/bootstrap5-dark.css +12 -3
- package/styles/drop-down-base/bootstrap5.css +12 -3
- package/styles/drop-down-base/fabric-dark.css +7 -2
- package/styles/drop-down-base/fabric.css +7 -2
- package/styles/drop-down-base/fluent-dark.css +397 -0
- package/styles/drop-down-base/fluent-dark.scss +3 -0
- package/styles/drop-down-base/fluent.css +397 -0
- package/styles/drop-down-base/fluent.scss +3 -0
- package/styles/drop-down-base/highcontrast-light.css +7 -2
- package/styles/drop-down-base/highcontrast.css +7 -2
- package/styles/drop-down-base/material-dark.css +7 -2
- package/styles/drop-down-base/material.css +7 -2
- package/styles/drop-down-base/tailwind-dark.css +103 -14
- package/styles/drop-down-base/tailwind.css +103 -14
- package/styles/drop-down-list/_bootstrap-dark-definition.scss +1 -1
- package/styles/drop-down-list/_bootstrap-definition.scss +1 -1
- package/styles/drop-down-list/_bootstrap4-definition.scss +1 -1
- package/styles/drop-down-list/_bootstrap5-definition.scss +10 -2
- package/styles/drop-down-list/_fabric-dark-definition.scss +1 -1
- package/styles/drop-down-list/_fabric-definition.scss +1 -1
- package/styles/drop-down-list/_fluent-dark-definition.scss +1 -0
- package/styles/drop-down-list/_fluent-definition.scss +10 -19
- package/styles/drop-down-list/_highcontrast-definition.scss +1 -1
- package/styles/drop-down-list/_highcontrast-light-definition.scss +1 -1
- package/styles/drop-down-list/_layout.scss +52 -15
- package/styles/drop-down-list/_material-dark-definition.scss +1 -1
- package/styles/drop-down-list/_material-definition.scss +1 -1
- package/styles/drop-down-list/_tailwind-definition.scss +6 -61
- package/styles/drop-down-list/bootstrap-dark.css +28 -6
- package/styles/drop-down-list/bootstrap.css +28 -6
- package/styles/drop-down-list/bootstrap4.css +28 -6
- package/styles/drop-down-list/bootstrap5-dark.css +35 -6
- package/styles/drop-down-list/bootstrap5.css +35 -6
- package/styles/drop-down-list/fabric-dark.css +28 -6
- package/styles/drop-down-list/fabric.css +28 -6
- package/styles/drop-down-list/fluent-dark.css +447 -0
- package/styles/drop-down-list/fluent-dark.scss +8 -0
- package/styles/drop-down-list/fluent.css +447 -0
- package/styles/drop-down-list/fluent.scss +8 -0
- package/styles/drop-down-list/highcontrast-light.css +28 -6
- package/styles/drop-down-list/highcontrast.css +28 -6
- package/styles/drop-down-list/icons/_fluent-dark.scss +1 -0
- package/styles/drop-down-list/icons/_fluent.scss +1 -1
- package/styles/drop-down-list/icons/_tailwind.scss +3 -4
- package/styles/drop-down-list/material-dark.css +28 -6
- package/styles/drop-down-list/material.css +28 -6
- package/styles/drop-down-list/tailwind-dark.css +20 -95
- package/styles/drop-down-list/tailwind.css +20 -95
- package/styles/drop-down-tree/_bootstrap5-definition.scss +1 -1
- package/styles/drop-down-tree/_fluent-dark-definition.scss +1 -0
- package/styles/drop-down-tree/_fluent-definition.scss +25 -30
- package/styles/drop-down-tree/_layout.scss +94 -27
- package/styles/drop-down-tree/_tailwind-definition.scss +2 -1
- package/styles/drop-down-tree/_theme.scss +9 -4
- package/styles/drop-down-tree/bootstrap5-dark.css +6 -2
- package/styles/drop-down-tree/bootstrap5.css +6 -2
- package/styles/drop-down-tree/fluent-dark.css +599 -0
- package/styles/drop-down-tree/fluent-dark.scss +9 -0
- package/styles/drop-down-tree/fluent.css +599 -0
- package/styles/drop-down-tree/fluent.scss +9 -0
- package/styles/drop-down-tree/icons/_fluent-dark.scss +1 -0
- package/styles/drop-down-tree/icons/_fluent.scss +1 -1
- package/styles/drop-down-tree/icons/_tailwind-dark.scss +2 -2
- package/styles/drop-down-tree/icons/_tailwind.scss +2 -2
- package/styles/drop-down-tree/tailwind-dark.css +15 -6
- package/styles/drop-down-tree/tailwind.css +15 -6
- package/styles/fabric-dark.css +56 -30
- package/styles/fabric.css +56 -30
- package/styles/fluent-dark.css +3602 -0
- package/styles/fluent-dark.scss +7 -0
- package/styles/fluent.css +3602 -0
- package/styles/fluent.scss +7 -0
- package/styles/highcontrast-light.css +58 -31
- package/styles/highcontrast.css +58 -31
- package/styles/list-box/_bootstrap-dark-definition.scss +98 -102
- package/styles/list-box/_bootstrap-definition.scss +94 -98
- package/styles/list-box/_bootstrap4-definition.scss +98 -102
- package/styles/list-box/_bootstrap5-definition.scss +94 -99
- package/styles/list-box/_fabric-dark-definition.scss +98 -102
- package/styles/list-box/_fabric-definition.scss +94 -98
- package/styles/list-box/_fluent-dark-definition.scss +1 -0
- package/styles/list-box/_fluent-definition.scss +95 -100
- package/styles/list-box/_highcontrast-definition.scss +94 -98
- package/styles/list-box/_highcontrast-light-definition.scss +98 -102
- package/styles/list-box/_layout.scss +37 -37
- package/styles/list-box/_material-dark-definition.scss +98 -102
- package/styles/list-box/_material-definition.scss +94 -98
- package/styles/list-box/_tailwind-definition.scss +95 -99
- package/styles/list-box/_theme.scss +77 -85
- package/styles/list-box/bootstrap-dark.css +2 -12
- package/styles/list-box/bootstrap.css +2 -12
- package/styles/list-box/bootstrap4.css +2 -12
- package/styles/list-box/bootstrap5-dark.css +5 -15
- package/styles/list-box/bootstrap5.css +5 -15
- package/styles/list-box/fabric-dark.css +2 -12
- package/styles/list-box/fabric.css +2 -12
- package/styles/list-box/fluent-dark.css +895 -0
- package/styles/list-box/fluent-dark.scss +5 -0
- package/styles/list-box/fluent.css +895 -0
- package/styles/list-box/fluent.scss +5 -0
- package/styles/list-box/highcontrast-light.css +2 -12
- package/styles/list-box/highcontrast.css +2 -12
- package/styles/list-box/icons/_fluent-dark.scss +1 -0
- package/styles/list-box/icons/_tailwind-dark.scss +7 -7
- package/styles/list-box/icons/_tailwind.scss +7 -7
- package/styles/list-box/material-dark.css +4 -14
- package/styles/list-box/material.css +4 -14
- package/styles/list-box/tailwind-dark.css +17 -24
- package/styles/list-box/tailwind.css +17 -24
- package/styles/material-dark.css +58 -32
- package/styles/material.css +58 -32
- package/styles/multi-select/_bootstrap5-definition.scss +8 -4
- package/styles/multi-select/_fluent-dark-definition.scss +1 -0
- package/styles/multi-select/_fluent-definition.scss +30 -16
- package/styles/multi-select/_layout.scss +276 -25
- package/styles/multi-select/_tailwind-definition.scss +61 -43
- package/styles/multi-select/_theme.scss +79 -15
- package/styles/multi-select/bootstrap-dark.css +19 -10
- package/styles/multi-select/bootstrap.css +19 -10
- package/styles/multi-select/bootstrap4.css +19 -10
- package/styles/multi-select/bootstrap5-dark.css +58 -14
- package/styles/multi-select/bootstrap5.css +58 -14
- package/styles/multi-select/fabric-dark.css +19 -10
- package/styles/multi-select/fabric.css +19 -10
- package/styles/multi-select/fluent-dark.css +1416 -0
- package/styles/multi-select/fluent-dark.scss +9 -0
- package/styles/multi-select/fluent.css +1416 -0
- package/styles/multi-select/fluent.scss +9 -0
- package/styles/multi-select/highcontrast-light.css +21 -11
- package/styles/multi-select/highcontrast.css +21 -11
- package/styles/multi-select/icons/_fluent-dark.scss +1 -0
- package/styles/multi-select/icons/_fluent.scss +32 -3
- package/styles/multi-select/icons/_tailwind.scss +3 -3
- package/styles/multi-select/material-dark.css +19 -10
- package/styles/multi-select/material.css +19 -10
- package/styles/multi-select/tailwind-dark.css +166 -126
- package/styles/multi-select/tailwind.css +166 -126
- package/styles/tailwind-dark.css +297 -253
- package/styles/tailwind.css +297 -253
|
@@ -1,111 +1,110 @@
|
|
|
1
1
|
//default
|
|
2
2
|
$skin-name: 'highcontrast' !default;
|
|
3
|
-
$
|
|
4
|
-
$
|
|
5
|
-
$
|
|
6
|
-
$
|
|
7
|
-
$
|
|
8
|
-
$
|
|
9
|
-
$
|
|
10
|
-
$
|
|
11
|
-
$
|
|
12
|
-
$
|
|
13
|
-
$
|
|
14
|
-
$
|
|
15
|
-
$
|
|
16
|
-
$
|
|
17
|
-
$
|
|
18
|
-
$
|
|
19
|
-
$
|
|
3
|
+
$listbox-font-family: $font-family !default;
|
|
4
|
+
$listbox-text-color: $content-font !default;
|
|
5
|
+
$listbox-text-disabled: rgba($disable, .54) !default;
|
|
6
|
+
$listbox-icon-color: $content-font !default;
|
|
7
|
+
$listbox-icon-disabled: rgba($disable, .54) !default;
|
|
8
|
+
$listbox-icon-margin-right: 16px !default;
|
|
9
|
+
$listbox-icon-back-margin: 2px !default;
|
|
10
|
+
$listbox-rtl-icon-back-margin: 1px !default;
|
|
11
|
+
$listbox-icon-line-height: 28px !default;
|
|
12
|
+
$listbox-icon-collapsible: '\e85c' !default;
|
|
13
|
+
$listbox-icon-collapsible-rtl: '\e98f' !default;
|
|
14
|
+
$listbox-icon-back-rtl: '\e830' !default;
|
|
15
|
+
$listbox-back-icon: '\e85b' !default;
|
|
16
|
+
$listbox-background: $default-bg-color !default;
|
|
17
|
+
$listbox-line-color: $default-bg-color !default;
|
|
18
|
+
$listbox-item-hover-bg: $hover-bg !default;
|
|
19
|
+
$listbox-item-height: 36px !default;
|
|
20
20
|
$listbox-item-line-height: 1 !default;
|
|
21
|
-
$listview-item-padding: 0 12px !default;
|
|
22
21
|
$listbox-item-padding: 9px 16px !default;
|
|
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
|
-
$
|
|
22
|
+
$listbox-bigger-item-padding: 12px 16px !default;
|
|
23
|
+
$listbox-text-hover-color: $hover-font !default;
|
|
24
|
+
$listbox-item-active-bg: $selection-bg !default;
|
|
25
|
+
$listbox-text-active-color: $selection-font !default;
|
|
26
|
+
$listbox-header-text-color: $header-font-color !default;
|
|
27
|
+
$listbox-header-text-padding: 16px !default;
|
|
28
|
+
$listbox-header-text-disabled: $disable !default;
|
|
29
|
+
$listbox-header-bg: $header-bg-color !default;
|
|
30
|
+
$listbox-header-icon-color: $header-icon-color !default;
|
|
31
|
+
$listbox-header-icon-disabled: $disable !default;
|
|
32
|
+
$listbox-header-border: $border-default !default;
|
|
33
|
+
$listbox-header-font-size: 14px !default;
|
|
34
|
+
$listbox-header-height: 36px !default;
|
|
35
|
+
$listbox-header-font-weight: 600 !default;
|
|
36
|
+
$listbox-header-line-height: 0 !default;
|
|
37
|
+
$listbox-header-padding-bottom: 0 !default;
|
|
38
|
+
$listbox-group-first-border-bottom: 0 !default;
|
|
39
|
+
$listbox-group-border-top: 1px !default;
|
|
40
|
+
$listbox-group-border-bottom: 0 !default;
|
|
41
|
+
$listbox-groupheader-text-color: $header-font !default;
|
|
42
|
+
$listbox-groupheader-bg: $header-bg-color !default;
|
|
43
|
+
$listbox-groupheader-border: $header-bg-color !default;
|
|
44
|
+
$listbox-groupheader-icon: $header-icon-color !default;
|
|
45
|
+
$listbox-groupheader-item-height: 36px !default;
|
|
46
|
+
$listbox-groupheader-item-line-height: 30px !default;
|
|
47
|
+
$listbox-groupheader-font-size: 14px !default;
|
|
48
|
+
$listbox-border-size: 0 !default;
|
|
49
|
+
$listbox-font-size: 13px !default;
|
|
51
50
|
$checkmark-bgcolor: $bg-base-0 !default;
|
|
52
51
|
$checkmark-border-color: $bg-base-0 !default;
|
|
53
52
|
$checkmark-color: $header-font !default;
|
|
54
|
-
$
|
|
55
|
-
$
|
|
56
|
-
$
|
|
57
|
-
$
|
|
58
|
-
$
|
|
59
|
-
$
|
|
60
|
-
$
|
|
61
|
-
$
|
|
62
|
-
$
|
|
63
|
-
$
|
|
64
|
-
$
|
|
65
|
-
$
|
|
66
|
-
$
|
|
53
|
+
$listbox-border-bottom: 2px !default;
|
|
54
|
+
$listbox-border-top: 2px !default;
|
|
55
|
+
$listbox-border-left: 2px !default;
|
|
56
|
+
$listbox-border-right: 2px !default;
|
|
57
|
+
$listbox-hover-border-color: $hover-border !default;
|
|
58
|
+
$listbox-border-bottom-color: transparent !default;
|
|
59
|
+
$listbox-border-top-color: transparent !default;
|
|
60
|
+
$listbox-border-right-color: transparent !default;
|
|
61
|
+
$listbox-border-left-color: transparent !default;
|
|
62
|
+
$listbox-back-padding-right: 20px !default;
|
|
63
|
+
$listbox-back-icon-height: 0 !default;
|
|
64
|
+
$listbox-back-icon-font-size: 18px !default;
|
|
65
|
+
$listbox-touch-item-height: 45px !default;
|
|
67
66
|
$listbox-touch-item-line-height: 1.6 !default;
|
|
68
|
-
$
|
|
69
|
-
$
|
|
70
|
-
$
|
|
71
|
-
$
|
|
72
|
-
$
|
|
73
|
-
$
|
|
74
|
-
$
|
|
75
|
-
$
|
|
76
|
-
$
|
|
77
|
-
$
|
|
78
|
-
$
|
|
79
|
-
$
|
|
80
|
-
$
|
|
67
|
+
$listbox-touch-item-font-size: 15px !default;
|
|
68
|
+
$listbox-touch-back-icon-padding: 0 !default;
|
|
69
|
+
$listbox-touch-groupheader-height: 45px !default;
|
|
70
|
+
$listbox-touch-groupheader-line-height: 45px !default;
|
|
71
|
+
$listbox-touch-header-height: 45px !default;
|
|
72
|
+
$listbox-touch-header-font-weight: 600 !default;
|
|
73
|
+
$listbox-touch-header-font-size: 15px !default;
|
|
74
|
+
$listbox-touch-header-line-height: 11px !default;
|
|
75
|
+
$listbox-touch-header-icon-margin-top: 0 !default;
|
|
76
|
+
$listbox-checkbox-right-margin: -2px 0 0 10px !default;
|
|
77
|
+
$listbox-checkbox-left-margin: -2px 10px 0 0 !default;
|
|
78
|
+
$listbox-rtl-checkbox-left-margin: -2px 0 0 10px !default;
|
|
79
|
+
$listbox-rtl-checkbox-right-margin: -2px 10px 0 0 !default;
|
|
81
80
|
//ListView In-built template variables
|
|
82
|
-
$
|
|
83
|
-
$
|
|
84
|
-
$
|
|
85
|
-
$
|
|
86
|
-
$
|
|
87
|
-
$
|
|
88
|
-
$
|
|
89
|
-
$
|
|
90
|
-
$
|
|
91
|
-
$
|
|
92
|
-
$
|
|
93
|
-
$
|
|
94
|
-
$
|
|
95
|
-
$
|
|
96
|
-
$
|
|
97
|
-
$
|
|
98
|
-
$
|
|
99
|
-
$
|
|
100
|
-
$
|
|
101
|
-
$
|
|
102
|
-
$
|
|
103
|
-
$
|
|
104
|
-
$
|
|
105
|
-
$
|
|
106
|
-
$
|
|
107
|
-
$
|
|
108
|
-
$
|
|
81
|
+
$listbox-template-padding: .6153em .923em !default;
|
|
82
|
+
$listbox-template-avatar-padding-right: .923em !default;
|
|
83
|
+
$listbox-template-avatar-padding-left: 4.923em !default;
|
|
84
|
+
$listbox-template-avatar-rightposition-padding-right: 4.923em !default;
|
|
85
|
+
$listbox-template-avatar-rightposition-padding-left: .923em !default;
|
|
86
|
+
$listbox-template-avatar-size: 3.0769em !default;
|
|
87
|
+
$listbox-template-avatar-top: .6153em !default;
|
|
88
|
+
$listbox-template-avatar-left: .923em !default;
|
|
89
|
+
$listbox-template-avatar-rightposition-right: .923em !default;
|
|
90
|
+
$listbox-template-badge-height: 1.5384em !default;
|
|
91
|
+
$listbox-template-badge-width: 1.5384em !default;
|
|
92
|
+
$listbox-template-badge-line-height: 1.3384em !default;
|
|
93
|
+
$listbox-template-badge-font-size: 13px !default;
|
|
94
|
+
$listbox-template-badge-right: .923em !default;
|
|
95
|
+
$listbox-template-avatar-badge-padding-right: 3.3846em !default;
|
|
96
|
+
$listbox-template-avatar-badge-padding-left: 4.923em !default;
|
|
97
|
+
$listbox-template-badgewithoutavatar-padding-right: 3.3846em !default;
|
|
98
|
+
$listbox-template-badgewithoutavatar-padding-left: .923em !default;
|
|
99
|
+
$listbox-template-item-padding: .867em 0 !default;
|
|
100
|
+
$listbox-template-multiline-header-color: $content-font !default;
|
|
101
|
+
$listbox-template-multiline-content-color: $content-font !default;
|
|
102
|
+
$listbox-template-multiline-header-padding: .093em 0 !default;
|
|
103
|
+
$listbox-template-multiline-content-padding: .093em 0 !default;
|
|
104
|
+
$listbox-template-multiline-header-font-size: 13px !default;
|
|
105
|
+
$listbox-template-multiline-padding: .6153em .923em !default;;
|
|
106
|
+
$listbox-template-multiline-content-font-size: 13px !default;
|
|
107
|
+
$listbox-template-multiline-avatar-top: .6153em !default;
|
|
109
108
|
//enddefault
|
|
110
109
|
|
|
111
110
|
$listbox-border-color: $border-default;
|
|
@@ -118,6 +117,3 @@ $listbox-filter-height: calc(100% - 51px) !default;
|
|
|
118
117
|
$listbox-filter-small-height: calc(100% - 45px) !default;
|
|
119
118
|
$listbox-filter-bigger-small-height: calc(100% - 55px) !default;
|
|
120
119
|
$listbox-filter-bigger-height: calc(100% - 59px) !default;
|
|
121
|
-
|
|
122
|
-
$listbox-select-all-height: calc(100% - 36px) !default;
|
|
123
|
-
$listbox-filter-select-all-height: calc(100% - 87px) !default;
|
|
@@ -34,7 +34,7 @@
|
|
|
34
34
|
height: $listbox-item-height;
|
|
35
35
|
}
|
|
36
36
|
@else {
|
|
37
|
-
height: $
|
|
37
|
+
height: $listbox-item-height;
|
|
38
38
|
}
|
|
39
39
|
line-height: $listbox-item-line-height;
|
|
40
40
|
padding: $listbox-item-padding;
|
|
@@ -47,11 +47,11 @@
|
|
|
47
47
|
|
|
48
48
|
.e-list-parent {
|
|
49
49
|
height: 100%;
|
|
50
|
-
min-height: $
|
|
50
|
+
min-height: $listbox-item-height;
|
|
51
51
|
}
|
|
52
52
|
|
|
53
53
|
& .e-list-item {
|
|
54
|
-
border-bottom: $
|
|
54
|
+
border-bottom: $listbox-border-size solid;
|
|
55
55
|
outline: none;
|
|
56
56
|
|
|
57
57
|
&.e-disabled {
|
|
@@ -73,7 +73,7 @@
|
|
|
73
73
|
}
|
|
74
74
|
|
|
75
75
|
& .e-icon-back {
|
|
76
|
-
margin-top: $
|
|
76
|
+
margin-top: $listbox-icon-back-margin;
|
|
77
77
|
}
|
|
78
78
|
|
|
79
79
|
& .e-list-header .e-headertemplate-text.nested-header {
|
|
@@ -84,9 +84,9 @@
|
|
|
84
84
|
align-items: center;
|
|
85
85
|
border-bottom: 1px solid;
|
|
86
86
|
display: flex;
|
|
87
|
-
font-weight: $
|
|
88
|
-
height: $
|
|
89
|
-
padding: 0 $
|
|
87
|
+
font-weight: $listbox-header-font-weight;
|
|
88
|
+
height: $listbox-header-height;
|
|
89
|
+
padding: 0 $listbox-header-text-padding;
|
|
90
90
|
}
|
|
91
91
|
|
|
92
92
|
& .e-has-header > .e-view {
|
|
@@ -95,21 +95,21 @@
|
|
|
95
95
|
|
|
96
96
|
& .e-but-back {
|
|
97
97
|
cursor: pointer;
|
|
98
|
-
padding-right: $
|
|
98
|
+
padding-right: $listbox-back-padding-right;
|
|
99
99
|
}
|
|
100
100
|
|
|
101
101
|
& .e-list-group-item:first-child {
|
|
102
102
|
border: 0;
|
|
103
|
-
border-bottom: $
|
|
103
|
+
border-bottom: $listbox-group-first-border-bottom solid $listbox-border-bottom-color;
|
|
104
104
|
}
|
|
105
105
|
|
|
106
106
|
& .e-list-group-item {
|
|
107
|
-
border-bottom: $
|
|
108
|
-
border-top: $
|
|
107
|
+
border-bottom: $listbox-group-border-bottom solid $listbox-border-bottom-color;
|
|
108
|
+
border-top: $listbox-group-border-top solid;
|
|
109
109
|
font-weight: 600;
|
|
110
|
-
height: $
|
|
111
|
-
line-height: $
|
|
112
|
-
padding: $
|
|
110
|
+
height: $listbox-groupheader-item-height;
|
|
111
|
+
line-height: $listbox-groupheader-item-line-height;
|
|
112
|
+
padding: $listbox-item-padding;
|
|
113
113
|
}
|
|
114
114
|
|
|
115
115
|
& .e-icon-collapsible {
|
|
@@ -153,11 +153,11 @@
|
|
|
153
153
|
}
|
|
154
154
|
|
|
155
155
|
& .e-checkbox .e-checkbox-left {
|
|
156
|
-
margin: $
|
|
156
|
+
margin: $listbox-checkbox-left-margin;
|
|
157
157
|
}
|
|
158
158
|
|
|
159
159
|
& .e-checkbox .e-checkbox-right {
|
|
160
|
-
margin: $
|
|
160
|
+
margin: $listbox-checkbox-right-margin;
|
|
161
161
|
}
|
|
162
162
|
|
|
163
163
|
& .e-list-text {
|
|
@@ -184,7 +184,7 @@
|
|
|
184
184
|
|
|
185
185
|
& .e-list-icon {
|
|
186
186
|
height: 30px;
|
|
187
|
-
margin-right: $
|
|
187
|
+
margin-right: $listbox-icon-margin-right;
|
|
188
188
|
width: 30px;
|
|
189
189
|
}
|
|
190
190
|
|
|
@@ -200,7 +200,7 @@
|
|
|
200
200
|
|
|
201
201
|
& .e-text .e-headertext {
|
|
202
202
|
display: inline-block;
|
|
203
|
-
line-height: $
|
|
203
|
+
line-height: $listbox-header-line-height;
|
|
204
204
|
}
|
|
205
205
|
|
|
206
206
|
&.e-rtl {
|
|
@@ -227,24 +227,24 @@
|
|
|
227
227
|
}
|
|
228
228
|
|
|
229
229
|
& .e-icon-back {
|
|
230
|
-
margin-top: $
|
|
230
|
+
margin-top: $listbox-rtl-icon-back-margin;
|
|
231
231
|
}
|
|
232
232
|
|
|
233
233
|
& .e-checkbox .e-checkbox-left {
|
|
234
|
-
margin: $
|
|
234
|
+
margin: $listbox-rtl-checkbox-left-margin;
|
|
235
235
|
}
|
|
236
236
|
|
|
237
237
|
& .e-checkbox .e-checkbox-right {
|
|
238
|
-
margin: $
|
|
238
|
+
margin: $listbox-rtl-checkbox-right-margin;
|
|
239
239
|
}
|
|
240
240
|
|
|
241
241
|
.e-checkbox-wrapper {
|
|
242
|
-
margin: $
|
|
242
|
+
margin: $listbox-rtl-checkbox-left-margin;
|
|
243
243
|
}
|
|
244
244
|
}
|
|
245
245
|
|
|
246
246
|
.e-checkbox-wrapper {
|
|
247
|
-
margin: $
|
|
247
|
+
margin: $listbox-checkbox-left-margin;
|
|
248
248
|
text-indent: 0;
|
|
249
249
|
vertical-align: middle;
|
|
250
250
|
}
|
|
@@ -292,7 +292,7 @@
|
|
|
292
292
|
&.e-filter-list {
|
|
293
293
|
overflow: inherit;
|
|
294
294
|
|
|
295
|
-
|
|
295
|
+
& .e-list-parent {
|
|
296
296
|
overflow: auto;
|
|
297
297
|
}
|
|
298
298
|
}
|
|
@@ -399,22 +399,22 @@
|
|
|
399
399
|
}
|
|
400
400
|
|
|
401
401
|
.e-list-item {
|
|
402
|
-
border-bottom: $
|
|
403
|
-
border-left: $
|
|
404
|
-
border-right: $
|
|
405
|
-
border-top: $
|
|
402
|
+
border-bottom: $listbox-border-bottom solid $listbox-border-bottom-color;
|
|
403
|
+
border-left: $listbox-border-left solid $listbox-border-left-color;
|
|
404
|
+
border-right: $listbox-border-right solid $listbox-border-right-color;
|
|
405
|
+
border-top: $listbox-border-top solid $listbox-border-top-color;
|
|
406
406
|
}
|
|
407
407
|
|
|
408
408
|
&:not(.e-list-template) .e-list-item,
|
|
409
409
|
.e-selectall-parent,
|
|
410
410
|
.e-list-group-item,
|
|
411
411
|
.e-list-header {
|
|
412
|
-
padding: $
|
|
412
|
+
padding: $listbox-bigger-item-padding;
|
|
413
413
|
}
|
|
414
414
|
|
|
415
415
|
&:not(.e-list-template) .e-list-item,
|
|
416
416
|
.e-selectall-parent {
|
|
417
|
-
height: $
|
|
417
|
+
height: $listbox-touch-item-height;
|
|
418
418
|
line-height: $listbox-touch-item-line-height;
|
|
419
419
|
position: relative;
|
|
420
420
|
@if ($skin-name == 'bootstrap4') {
|
|
@@ -423,16 +423,16 @@
|
|
|
423
423
|
}
|
|
424
424
|
|
|
425
425
|
.e-list-parent {
|
|
426
|
-
min-height: $
|
|
426
|
+
min-height: $listbox-touch-item-height;
|
|
427
427
|
}
|
|
428
428
|
|
|
429
429
|
.e-text-content {
|
|
430
|
-
font-size: $
|
|
430
|
+
font-size: $listbox-touch-item-font-size;
|
|
431
431
|
}
|
|
432
432
|
|
|
433
433
|
.e-list-group-item {
|
|
434
|
-
height: $
|
|
435
|
-
line-height: $
|
|
434
|
+
height: $listbox-touch-groupheader-height;
|
|
435
|
+
line-height: $listbox-touch-groupheader-line-height;
|
|
436
436
|
@if ($skin-name == 'bootstrap4') {
|
|
437
437
|
font-size: 16px;
|
|
438
438
|
padding: 12px 20px;
|
|
@@ -442,8 +442,8 @@
|
|
|
442
442
|
.e-list-header {
|
|
443
443
|
align-items: center;
|
|
444
444
|
display: flex;
|
|
445
|
-
font-weight: $
|
|
446
|
-
height: $
|
|
445
|
+
font-weight: $listbox-touch-header-font-weight;
|
|
446
|
+
height: $listbox-touch-header-height;
|
|
447
447
|
@if ($skin-name == 'bootstrap4') {
|
|
448
448
|
font-size: 20px;
|
|
449
449
|
line-height: 1.2;
|
|
@@ -460,7 +460,7 @@
|
|
|
460
460
|
}
|
|
461
461
|
|
|
462
462
|
.e-list-header .e-text {
|
|
463
|
-
font-size: $
|
|
463
|
+
font-size: $listbox-touch-header-font-size;
|
|
464
464
|
}
|
|
465
465
|
|
|
466
466
|
.e-but-back {
|
|
@@ -1,111 +1,110 @@
|
|
|
1
1
|
//default
|
|
2
2
|
$skin-name: 'material' !default;
|
|
3
|
-
$
|
|
4
|
-
$
|
|
5
|
-
$
|
|
6
|
-
$
|
|
7
|
-
$
|
|
8
|
-
$
|
|
9
|
-
$
|
|
10
|
-
$
|
|
11
|
-
$
|
|
12
|
-
$
|
|
13
|
-
$
|
|
14
|
-
$
|
|
15
|
-
$
|
|
16
|
-
$
|
|
17
|
-
$
|
|
18
|
-
$
|
|
19
|
-
$
|
|
20
|
-
$listview-item-padding: 0 16px !default;
|
|
3
|
+
$listbox-font-family: $font-family !default;
|
|
4
|
+
$listbox-text-color: $grey-dark-font !default;
|
|
5
|
+
$listbox-text-disabled: $grey-dark-font !default;
|
|
6
|
+
$listbox-icon-color: $grey-dark-font !default;
|
|
7
|
+
$listbox-icon-disabled: $grey-dark-font !default;
|
|
8
|
+
$listbox-icon-margin-right: 16px !default;
|
|
9
|
+
$listbox-icon-back-margin: 2px !default;
|
|
10
|
+
$listbox-rtl-icon-back-margin: -2px !default;
|
|
11
|
+
$listbox-icon-line-height: 34px !default;
|
|
12
|
+
$listbox-icon-collapsible: '\e844' !default;
|
|
13
|
+
$listbox-icon-collapsible-rtl: '\e839' !default;
|
|
14
|
+
$listbox-icon-back-rtl: '\e860' !default;
|
|
15
|
+
$listbox-back-icon: '\e85b' !default;
|
|
16
|
+
$listbox-background: $grey-dark !default;
|
|
17
|
+
$listbox-line-color: $grey-white !default;
|
|
18
|
+
$listbox-item-hover-bg: $grey-800 !default;
|
|
19
|
+
$listbox-item-height: 36px !default;
|
|
21
20
|
$listbox-item-line-height: 1 !default;
|
|
22
21
|
$listbox-item-padding: 11px 16px !default;
|
|
23
|
-
$
|
|
24
|
-
$
|
|
25
|
-
$
|
|
26
|
-
$
|
|
27
|
-
$
|
|
28
|
-
$
|
|
29
|
-
$
|
|
30
|
-
$
|
|
31
|
-
$
|
|
32
|
-
$
|
|
33
|
-
$
|
|
34
|
-
$
|
|
35
|
-
$
|
|
36
|
-
$
|
|
37
|
-
$
|
|
38
|
-
$
|
|
39
|
-
$
|
|
22
|
+
$listbox-bigger-item-padding: 12px 16px !default;
|
|
23
|
+
$listbox-text-hover-color: $grey-dark-font !default;
|
|
24
|
+
$listbox-item-active-bg: $grey-700 !default;
|
|
25
|
+
$listbox-text-active-color: $grey-dark-font !default;
|
|
26
|
+
$listbox-header-text-color: rgba($grey-dark-font, .7) !default;
|
|
27
|
+
$listbox-header-text-padding: 16px !default;
|
|
28
|
+
$listbox-header-text-disabled: $grey-dark-font !default;
|
|
29
|
+
$listbox-header-bg: $grey-800 !default;
|
|
30
|
+
$listbox-header-icon-color: $grey-dark-font !default;
|
|
31
|
+
$listbox-header-icon-disabled: $grey-dark-font !default;
|
|
32
|
+
$listbox-header-border: rgba($grey-black, .12) !default;
|
|
33
|
+
$listbox-header-font-size: 20px !default;
|
|
34
|
+
$listbox-header-height: 48px !default;
|
|
35
|
+
$listbox-header-font-weight: bold !default;
|
|
36
|
+
$listbox-header-line-height: 15px !default;
|
|
37
|
+
$listbox-header-padding-bottom: 0 !default;
|
|
38
|
+
$listbox-touch-back-icon-padding: 0 !default;
|
|
40
39
|
$checkmark-bgcolor: $accent !default;
|
|
41
40
|
$checkmark-border-color: transparent !default;
|
|
42
41
|
$checkmark-color: $accent-font !default;
|
|
43
|
-
$
|
|
44
|
-
$
|
|
45
|
-
$
|
|
46
|
-
$
|
|
47
|
-
$
|
|
48
|
-
$
|
|
49
|
-
$
|
|
50
|
-
$
|
|
51
|
-
$
|
|
52
|
-
$
|
|
53
|
-
$
|
|
54
|
-
$
|
|
55
|
-
$
|
|
56
|
-
$
|
|
57
|
-
$
|
|
58
|
-
$
|
|
59
|
-
$
|
|
60
|
-
$
|
|
61
|
-
$
|
|
62
|
-
$
|
|
63
|
-
$
|
|
64
|
-
$
|
|
65
|
-
$
|
|
66
|
-
$
|
|
67
|
-
$
|
|
42
|
+
$listbox-border-bottom: 0 !default;
|
|
43
|
+
$listbox-border-top: 0 !default;
|
|
44
|
+
$listbox-border-left: 0 !default;
|
|
45
|
+
$listbox-border-right: 0 !default;
|
|
46
|
+
$listbox-hover-border-color: transparent !default;
|
|
47
|
+
$listbox-border-bottom-color: transparent !default;
|
|
48
|
+
$listbox-border-top-color: transparent !default;
|
|
49
|
+
$listbox-border-right-color: transparent !default;
|
|
50
|
+
$listbox-border-left-color: transparent !default;
|
|
51
|
+
$listbox-group-first-border-bottom: 0 !default;
|
|
52
|
+
$listbox-group-border-top: 1px !default;
|
|
53
|
+
$listbox-group-border-bottom: 0 !default;
|
|
54
|
+
$listbox-groupheader-text-color: rgba($grey-dark-font, .7) !default;
|
|
55
|
+
$listbox-groupheader-bg: $grey-800 !default;
|
|
56
|
+
$listbox-groupheader-border: $grey-white !default;
|
|
57
|
+
$listbox-groupheader-icon: $grey-dark-font !default;
|
|
58
|
+
$listbox-groupheader-item-height: 36px !default;
|
|
59
|
+
$listbox-groupheader-item-line-height: 16px !default;
|
|
60
|
+
$listbox-groupheader-font-size: 15px !default;
|
|
61
|
+
$listbox-border-size: 0 !default;
|
|
62
|
+
$listbox-font-size: 15px !default;
|
|
63
|
+
$listbox-back-padding-right: 30px !default;
|
|
64
|
+
$listbox-back-icon-height: 1px !default;
|
|
65
|
+
$listbox-back-icon-font-size: auto !default;
|
|
66
|
+
$listbox-touch-item-height: 48px !default;
|
|
68
67
|
$listbox-touch-item-line-height: 1.6 !default;
|
|
69
|
-
$
|
|
70
|
-
$
|
|
71
|
-
$
|
|
72
|
-
$
|
|
73
|
-
$
|
|
74
|
-
$
|
|
75
|
-
$
|
|
76
|
-
$
|
|
77
|
-
$
|
|
78
|
-
$
|
|
79
|
-
$
|
|
80
|
-
$
|
|
68
|
+
$listbox-touch-item-font-size: 15px !default;
|
|
69
|
+
$listbox-touch-groupheader-height: 48px !default;
|
|
70
|
+
$listbox-touch-groupheader-line-height: 25px !default;
|
|
71
|
+
$listbox-touch-header-height: 64px !default;
|
|
72
|
+
$listbox-touch-header-font-weight: bold !default;
|
|
73
|
+
$listbox-touch-header-font-size: 20px !default;
|
|
74
|
+
$listbox-touch-header-line-height: 30px !default;
|
|
75
|
+
$listbox-touch-header-icon-margin-top: 2px !default;
|
|
76
|
+
$listbox-checkbox-right-margin: -2px 0 0 10px !default;
|
|
77
|
+
$listbox-checkbox-left-margin: -2px 10px 0 0 !default;
|
|
78
|
+
$listbox-rtl-checkbox-left-margin: -2px 0 0 10px !default;
|
|
79
|
+
$listbox-rtl-checkbox-right-margin: -2px 10px 0 0 !default;
|
|
81
80
|
//ListView In-built template variables
|
|
82
|
-
$
|
|
83
|
-
$
|
|
84
|
-
$
|
|
85
|
-
$
|
|
86
|
-
$
|
|
87
|
-
$
|
|
88
|
-
$
|
|
89
|
-
$
|
|
90
|
-
$
|
|
91
|
-
$
|
|
92
|
-
$
|
|
93
|
-
$
|
|
94
|
-
$
|
|
95
|
-
$
|
|
96
|
-
$
|
|
97
|
-
$
|
|
98
|
-
$
|
|
99
|
-
$
|
|
100
|
-
$
|
|
101
|
-
$
|
|
102
|
-
$
|
|
103
|
-
$
|
|
104
|
-
$
|
|
105
|
-
$
|
|
106
|
-
$
|
|
107
|
-
$
|
|
108
|
-
$
|
|
81
|
+
$listbox-template-padding: .2667em 1.0666em !default;
|
|
82
|
+
$listbox-template-avatar-padding-right: 1.0666em !default;
|
|
83
|
+
$listbox-template-avatar-padding-left: 4.8em !default;
|
|
84
|
+
$listbox-template-avatar-rightposition-padding-right: 4.8em !default;
|
|
85
|
+
$listbox-template-avatar-rightposition-padding-left: 1.0666em !default;
|
|
86
|
+
$listbox-template-avatar-size: 2.6667em !default;
|
|
87
|
+
$listbox-template-avatar-top: .2666em !default;
|
|
88
|
+
$listbox-template-avatar-left: 1.0667em !default;
|
|
89
|
+
$listbox-template-avatar-rightposition-right: 1.0667em !default;
|
|
90
|
+
$listbox-template-badge-height: 1.6666em !default;
|
|
91
|
+
$listbox-template-badge-width: 2.5em !default;
|
|
92
|
+
$listbox-template-badge-line-height: 1.8666em !default;
|
|
93
|
+
$listbox-template-badge-font-size: 12px !default;
|
|
94
|
+
$listbox-template-badge-right: 1.33em !default;
|
|
95
|
+
$listbox-template-avatar-badge-padding-right: 4.1333em !default;
|
|
96
|
+
$listbox-template-avatar-badge-padding-left: 4.8em !default;
|
|
97
|
+
$listbox-template-badgewithoutavatar-padding-right: 4.1333em !default;
|
|
98
|
+
$listbox-template-badgewithoutavatar-padding-left: 1.0666em !default;
|
|
99
|
+
$listbox-template-item-padding: .72em 0 !default;
|
|
100
|
+
$listbox-template-multiline-header-color: rgba($grey-light-font, .87) !default;
|
|
101
|
+
$listbox-template-multiline-content-color: rgba($grey-light-font, .54) !default;
|
|
102
|
+
$listbox-template-multiline-header-padding: .115em 0 !default;
|
|
103
|
+
$listbox-template-multiline-content-padding: .115em 0 !default;
|
|
104
|
+
$listbox-template-multiline-header-font-size: 15px !default;
|
|
105
|
+
$listbox-template-multiline-padding: 1.0666em !default;
|
|
106
|
+
$listbox-template-multiline-content-font-size: 13px !default;
|
|
107
|
+
$listbox-template-multiline-avatar-top: 1.0666em !default;
|
|
109
108
|
//enddefault
|
|
110
109
|
|
|
111
110
|
$listbox-border-color: $grey-700;
|
|
@@ -118,6 +117,3 @@ $listbox-filter-height: calc(100% - 47px) !default;
|
|
|
118
117
|
$listbox-filter-small-height: calc(100% - 45px) !default;
|
|
119
118
|
$listbox-filter-bigger-small-height: calc(100% - 45px) !default;
|
|
120
119
|
$listbox-filter-bigger-height: calc(100% - 55px) !default;
|
|
121
|
-
|
|
122
|
-
$listbox-select-all-height: calc(100% - 36px) !default;
|
|
123
|
-
$listbox-filter-select-all-height: calc(100% - 79px) !default;
|