@syncfusion/ej2-angular-splitbuttons 20.4.50-ngcc → 20.4.50

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.
Files changed (201) hide show
  1. package/esm2020/public_api.mjs +3 -0
  2. package/esm2020/src/drop-down-button/dropdownbutton-all.module.mjs +23 -0
  3. package/esm2020/src/drop-down-button/dropdownbutton.component.mjs +64 -0
  4. package/esm2020/src/drop-down-button/dropdownbutton.module.mjs +34 -0
  5. package/esm2020/src/drop-down-button/items.directive.mjs +46 -0
  6. package/esm2020/src/index.mjs +13 -0
  7. package/esm2020/src/progress-button/progressbutton-all.module.mjs +23 -0
  8. package/esm2020/src/progress-button/progressbutton.component.mjs +59 -0
  9. package/esm2020/src/progress-button/progressbutton.module.mjs +25 -0
  10. package/esm2020/src/split-button/items.directive.mjs +46 -0
  11. package/esm2020/src/split-button/splitbutton-all.module.mjs +23 -0
  12. package/esm2020/src/split-button/splitbutton.component.mjs +64 -0
  13. package/esm2020/src/split-button/splitbutton.module.mjs +34 -0
  14. package/esm2020/syncfusion-ej2-angular-splitbuttons.mjs +5 -0
  15. package/fesm2015/syncfusion-ej2-angular-splitbuttons.mjs +405 -0
  16. package/fesm2015/syncfusion-ej2-angular-splitbuttons.mjs.map +1 -0
  17. package/fesm2020/syncfusion-ej2-angular-splitbuttons.mjs +405 -0
  18. package/fesm2020/syncfusion-ej2-angular-splitbuttons.mjs.map +1 -0
  19. package/package.json +26 -12
  20. package/src/drop-down-button/dropdownbutton-all.module.d.ts +6 -0
  21. package/src/drop-down-button/dropdownbutton.component.d.ts +3 -0
  22. package/src/drop-down-button/dropdownbutton.module.d.ts +7 -0
  23. package/src/drop-down-button/items.directive.d.ts +5 -0
  24. package/src/progress-button/progressbutton-all.module.d.ts +6 -0
  25. package/src/progress-button/progressbutton.component.d.ts +3 -0
  26. package/src/progress-button/progressbutton.module.d.ts +6 -0
  27. package/src/split-button/items.directive.d.ts +5 -0
  28. package/src/split-button/splitbutton-all.module.d.ts +6 -0
  29. package/src/split-button/splitbutton.component.d.ts +3 -0
  30. package/src/split-button/splitbutton.module.d.ts +7 -0
  31. package/styles/button-group/_all.scss +2 -0
  32. package/styles/button-group/_bootstrap-dark-definition.scss +33 -0
  33. package/styles/button-group/_bootstrap-definition.scss +30 -0
  34. package/styles/button-group/_bootstrap4-definition.scss +30 -0
  35. package/styles/button-group/_bootstrap5-dark-definition.scss +1 -0
  36. package/styles/button-group/_bootstrap5-definition.scss +31 -0
  37. package/styles/button-group/_fabric-dark-definition.scss +33 -0
  38. package/styles/button-group/_fabric-definition.scss +30 -0
  39. package/styles/button-group/_fluent-dark-definition.scss +1 -0
  40. package/styles/button-group/_fluent-definition.scss +31 -0
  41. package/styles/button-group/_fusionnew-definition.scss +31 -0
  42. package/styles/button-group/_group-button-mixin.scss +72 -0
  43. package/styles/button-group/_highcontrast-definition.scss +32 -0
  44. package/styles/button-group/_highcontrast-light-definition.scss +35 -0
  45. package/styles/button-group/_layout.scss +288 -0
  46. package/styles/button-group/_material-dark-definition.scss +33 -0
  47. package/styles/button-group/_material-definition.scss +30 -0
  48. package/styles/button-group/_material3-definition.scss +31 -0
  49. package/styles/button-group/_tailwind-dark-definition.scss +1 -0
  50. package/styles/button-group/_tailwind-definition.scss +31 -0
  51. package/styles/button-group/_theme.scss +386 -0
  52. package/styles/button-group/bootstrap-dark.scss +4 -1
  53. package/styles/button-group/bootstrap.scss +4 -1
  54. package/styles/button-group/bootstrap4.scss +4 -1
  55. package/styles/button-group/bootstrap5-dark.scss +4 -1
  56. package/styles/button-group/bootstrap5.scss +4 -1
  57. package/styles/button-group/fabric-dark.scss +4 -1
  58. package/styles/button-group/fabric.scss +4 -1
  59. package/styles/button-group/fluent-dark.scss +4 -1
  60. package/styles/button-group/fluent.scss +4 -1
  61. package/styles/button-group/highcontrast-light.scss +4 -1
  62. package/styles/button-group/highcontrast.scss +4 -1
  63. package/styles/button-group/material-dark.scss +4 -1
  64. package/styles/button-group/material.scss +4 -1
  65. package/styles/button-group/tailwind-dark.scss +4 -1
  66. package/styles/button-group/tailwind.scss +4 -1
  67. package/styles/drop-down-button/_all.scss +2 -0
  68. package/styles/drop-down-button/_bootstrap-dark-definition.scss +51 -0
  69. package/styles/drop-down-button/_bootstrap-definition.scss +48 -0
  70. package/styles/drop-down-button/_bootstrap4-definition.scss +48 -0
  71. package/styles/drop-down-button/_bootstrap5-dark-definition.scss +1 -0
  72. package/styles/drop-down-button/_bootstrap5-definition.scss +50 -0
  73. package/styles/drop-down-button/_fabric-dark-definition.scss +51 -0
  74. package/styles/drop-down-button/_fabric-definition.scss +48 -0
  75. package/styles/drop-down-button/_fluent-dark-definition.scss +1 -0
  76. package/styles/drop-down-button/_fluent-definition.scss +52 -0
  77. package/styles/drop-down-button/_fusionnew-definition.scss +50 -0
  78. package/styles/drop-down-button/_highcontrast-definition.scss +47 -0
  79. package/styles/drop-down-button/_highcontrast-light-definition.scss +50 -0
  80. package/styles/drop-down-button/_layout.scss +221 -0
  81. package/styles/drop-down-button/_material-dark-definition.scss +51 -0
  82. package/styles/drop-down-button/_material-definition.scss +48 -0
  83. package/styles/drop-down-button/_material3-definition.scss +50 -0
  84. package/styles/drop-down-button/_tailwind-dark-definition.scss +1 -0
  85. package/styles/drop-down-button/_tailwind-definition.scss +49 -0
  86. package/styles/drop-down-button/_theme.scss +78 -0
  87. package/styles/drop-down-button/bootstrap-dark.scss +6 -1
  88. package/styles/drop-down-button/bootstrap.scss +6 -1
  89. package/styles/drop-down-button/bootstrap4.scss +6 -1
  90. package/styles/drop-down-button/bootstrap5-dark.scss +6 -1
  91. package/styles/drop-down-button/bootstrap5.scss +6 -1
  92. package/styles/drop-down-button/fabric-dark.scss +6 -1
  93. package/styles/drop-down-button/fabric.scss +6 -1
  94. package/styles/drop-down-button/fluent-dark.scss +6 -1
  95. package/styles/drop-down-button/fluent.scss +6 -1
  96. package/styles/drop-down-button/highcontrast-light.scss +6 -1
  97. package/styles/drop-down-button/highcontrast.scss +6 -1
  98. package/styles/drop-down-button/icons/_bootstrap-dark.scss +10 -0
  99. package/styles/drop-down-button/icons/_bootstrap.scss +10 -0
  100. package/styles/drop-down-button/icons/_bootstrap4.scss +10 -0
  101. package/styles/drop-down-button/icons/_bootstrap5-dark.scss +1 -0
  102. package/styles/drop-down-button/icons/_bootstrap5.scss +10 -0
  103. package/styles/drop-down-button/icons/_fabric-dark.scss +10 -0
  104. package/styles/drop-down-button/icons/_fabric.scss +10 -0
  105. package/styles/drop-down-button/icons/_fluent-dark.scss +1 -0
  106. package/styles/drop-down-button/icons/_fluent.scss +10 -0
  107. package/styles/drop-down-button/icons/_fusionnew.scss +10 -0
  108. package/styles/drop-down-button/icons/_highcontrast-light.scss +10 -0
  109. package/styles/drop-down-button/icons/_highcontrast.scss +10 -0
  110. package/styles/drop-down-button/icons/_material-dark.scss +10 -0
  111. package/styles/drop-down-button/icons/_material.scss +10 -0
  112. package/styles/drop-down-button/icons/_material3.scss +10 -0
  113. package/styles/drop-down-button/icons/_tailwind-dark.scss +10 -0
  114. package/styles/drop-down-button/icons/_tailwind.scss +10 -0
  115. package/styles/drop-down-button/material-dark.scss +6 -1
  116. package/styles/drop-down-button/material.scss +6 -1
  117. package/styles/drop-down-button/tailwind-dark.scss +6 -1
  118. package/styles/drop-down-button/tailwind.scss +6 -1
  119. package/styles/progress-button/_all.scss +2 -0
  120. package/styles/progress-button/_bootstrap-dark-definition.scss +27 -0
  121. package/styles/progress-button/_bootstrap-definition.scss +24 -0
  122. package/styles/progress-button/_bootstrap4-definition.scss +24 -0
  123. package/styles/progress-button/_bootstrap5-dark-definition.scss +1 -0
  124. package/styles/progress-button/_bootstrap5-definition.scss +21 -0
  125. package/styles/progress-button/_fabric-dark-definition.scss +27 -0
  126. package/styles/progress-button/_fabric-definition.scss +24 -0
  127. package/styles/progress-button/_fluent-dark-definition.scss +1 -0
  128. package/styles/progress-button/_fluent-definition.scss +21 -0
  129. package/styles/progress-button/_fusionnew-definition.scss +21 -0
  130. package/styles/progress-button/_highcontrast-definition.scss +24 -0
  131. package/styles/progress-button/_highcontrast-light-definition.scss +24 -0
  132. package/styles/progress-button/_layout.scss +396 -0
  133. package/styles/progress-button/_material-dark-definition.scss +27 -0
  134. package/styles/progress-button/_material-definition.scss +24 -0
  135. package/styles/progress-button/_material3-definition.scss +21 -0
  136. package/styles/progress-button/_tailwind-dark-definition.scss +1 -0
  137. package/styles/progress-button/_tailwind-definition.scss +21 -0
  138. package/styles/progress-button/_theme.scss +457 -0
  139. package/styles/progress-button/bootstrap-dark.scss +5 -1
  140. package/styles/progress-button/bootstrap.scss +5 -1
  141. package/styles/progress-button/bootstrap4.scss +5 -1
  142. package/styles/progress-button/bootstrap5-dark.scss +5 -1
  143. package/styles/progress-button/bootstrap5.scss +5 -1
  144. package/styles/progress-button/fabric-dark.scss +5 -1
  145. package/styles/progress-button/fabric.scss +5 -1
  146. package/styles/progress-button/fluent-dark.scss +5 -1
  147. package/styles/progress-button/fluent.scss +5 -1
  148. package/styles/progress-button/highcontrast-light.scss +5 -1
  149. package/styles/progress-button/highcontrast.scss +5 -1
  150. package/styles/progress-button/material-dark.scss +5 -1
  151. package/styles/progress-button/material.scss +5 -1
  152. package/styles/progress-button/tailwind-dark.scss +5 -1
  153. package/styles/progress-button/tailwind.scss +5 -1
  154. package/styles/split-button/_all.scss +2 -0
  155. package/styles/split-button/_bootstrap-dark-definition.scss +26 -0
  156. package/styles/split-button/_bootstrap-definition.scss +23 -0
  157. package/styles/split-button/_bootstrap4-definition.scss +26 -0
  158. package/styles/split-button/_bootstrap5-dark-definition.scss +1 -0
  159. package/styles/split-button/_bootstrap5-definition.scss +24 -0
  160. package/styles/split-button/_fabric-dark-definition.scss +26 -0
  161. package/styles/split-button/_fabric-definition.scss +23 -0
  162. package/styles/split-button/_fluent-dark-definition.scss +1 -0
  163. package/styles/split-button/_fluent-definition.scss +24 -0
  164. package/styles/split-button/_fusionnew-definition.scss +24 -0
  165. package/styles/split-button/_highcontrast-definition.scss +23 -0
  166. package/styles/split-button/_highcontrast-light-definition.scss +26 -0
  167. package/styles/split-button/_layout.scss +427 -0
  168. package/styles/split-button/_material-dark-definition.scss +26 -0
  169. package/styles/split-button/_material-definition.scss +23 -0
  170. package/styles/split-button/_material3-definition.scss +24 -0
  171. package/styles/split-button/_tailwind-dark-definition.scss +1 -0
  172. package/styles/split-button/_tailwind-definition.scss +24 -0
  173. package/styles/split-button/_theme.scss +167 -0
  174. package/styles/split-button/bootstrap-dark.scss +6 -1
  175. package/styles/split-button/bootstrap.scss +6 -1
  176. package/styles/split-button/bootstrap4.scss +6 -1
  177. package/styles/split-button/bootstrap5-dark.scss +6 -1
  178. package/styles/split-button/bootstrap5.scss +6 -1
  179. package/styles/split-button/fabric-dark.scss +6 -1
  180. package/styles/split-button/fabric.scss +6 -1
  181. package/styles/split-button/fluent-dark.scss +6 -1
  182. package/styles/split-button/fluent.scss +6 -1
  183. package/styles/split-button/highcontrast-light.scss +6 -1
  184. package/styles/split-button/highcontrast.scss +6 -1
  185. package/styles/split-button/material-dark.scss +6 -1
  186. package/styles/split-button/material.scss +6 -1
  187. package/styles/split-button/tailwind-dark.scss +6 -1
  188. package/styles/split-button/tailwind.scss +6 -1
  189. package/syncfusion-ej2-angular-splitbuttons.d.ts +5 -0
  190. package/@syncfusion/ej2-angular-splitbuttons.es5.js +0 -565
  191. package/@syncfusion/ej2-angular-splitbuttons.es5.js.map +0 -1
  192. package/@syncfusion/ej2-angular-splitbuttons.js +0 -516
  193. package/@syncfusion/ej2-angular-splitbuttons.js.map +0 -1
  194. package/CHANGELOG.md +0 -274
  195. package/dist/ej2-angular-splitbuttons.umd.js +0 -603
  196. package/dist/ej2-angular-splitbuttons.umd.js.map +0 -1
  197. package/dist/ej2-angular-splitbuttons.umd.min.js +0 -11
  198. package/dist/ej2-angular-splitbuttons.umd.min.js.map +0 -1
  199. package/ej2-angular-splitbuttons.d.ts +0 -7
  200. package/ej2-angular-splitbuttons.metadata.json +0 -1
  201. package/postinstall/tagchange.js +0 -18
@@ -0,0 +1,386 @@
1
+ @import 'ej2-buttons/styles/button/mixin.scss';
2
+ @import 'group-button-mixin.scss';
3
+ @include export-module('button-group-theme') {
4
+ /* stylelint-disable */
5
+ .e-btn-group,
6
+ .e-css.e-btn-group {
7
+ &:not(.e-outline) {
8
+ box-shadow: $btn-box-shadow;
9
+ }
10
+
11
+ @if $skin-name == 'material' or $skin-name == 'bootstrap4' {
12
+ .e-btn {
13
+ box-shadow: none;
14
+ }
15
+ }
16
+
17
+ .e-btn:hover {
18
+ box-shadow: none;
19
+ }
20
+
21
+ //Focus state for Normal and Outline GroupButton
22
+ .e-btn:focus,
23
+ input:focus+label.e-btn {
24
+ @include button-focus;
25
+ @if $skin-name != 'bootstrap5' and $skin-name != 'tailwind' {
26
+ box-shadow: none;
27
+ }
28
+ @if $skin-name == 'bootstrap5' {
29
+ border-color: $btn-focus-bgcolor;
30
+ }
31
+ outline-color: $btn-grp-outline-focus-color;
32
+ @if $skin-name == 'fabric' {
33
+ outline-offset: -2px;
34
+ }
35
+
36
+ @if $skin-name == 'highcontrast' {
37
+ outline-offset: -4px;
38
+ }
39
+
40
+ &.e-primary {
41
+ @include primary-focus;
42
+ @if $skin-name != 'bootstrap5' and $skin-name != 'tailwind' {
43
+ box-shadow: none;
44
+ }
45
+ @if $skin-name == 'bootstrap5' {
46
+ border-color: $btn-primary-focus-bgcolor;
47
+ }
48
+ outline-color: $btn-grp-outline-focus-primary-color;
49
+ @if $skin-name == 'fabric' {
50
+ border-color: transparent;
51
+ }
52
+ }
53
+
54
+ &.e-success {
55
+ @include success-focus;
56
+ @if $skin-name != 'bootstrap5' and $skin-name != 'tailwind' {
57
+ box-shadow: none;
58
+ }
59
+ @if $skin-name == 'bootstrap5' {
60
+ border-color: $btn-success-focus-bgcolor;
61
+ }
62
+ outline-color: $btn-grp-outline-focus-success-color;
63
+ @if $skin-name == 'fabric' {
64
+ border-color: transparent;
65
+ }
66
+ }
67
+
68
+ &.e-info {
69
+ @include info-focus;
70
+ @if $skin-name != 'bootstrap5' and $skin-name != 'tailwind' {
71
+ box-shadow: none;
72
+ }
73
+ @if $skin-name == 'bootstrap5' {
74
+ border-color: $btn-info-focus-bgcolor;
75
+ }
76
+ outline-color: $btn-grp-outline-focus-info-color;
77
+ @if $skin-name == 'fabric' {
78
+ border-color: transparent;
79
+ }
80
+ }
81
+
82
+ &.e-warning {
83
+ @include warning-focus;
84
+ @if $skin-name != 'bootstrap5' and $skin-name != 'tailwind' {
85
+ box-shadow: none;
86
+ }
87
+ @if $skin-name == 'bootstrap5' {
88
+ border-color: $btn-warning-focus-bgcolor;
89
+ }
90
+ outline-color: $btn-grp-outline-focus-warning-color;
91
+ @if $skin-name == 'fabric' {
92
+ border-color: transparent;
93
+ }
94
+ }
95
+
96
+ &.e-danger {
97
+ @include danger-focus;
98
+ @if $skin-name != 'bootstrap5' and $skin-name != 'tailwind' {
99
+ box-shadow: none;
100
+ }
101
+ @if $skin-name == 'bootstrap5' {
102
+ border-color: $btn-danger-focus-bgcolor;
103
+ }
104
+ outline-color: $btn-grp-outline-focus-danger-color;
105
+ @if $skin-name == 'fabric' {
106
+ border-color: transparent;
107
+ }
108
+ }
109
+
110
+ &.e-link {
111
+ @include link-focus;
112
+ background-color: transparent;
113
+ border-color: transparent;
114
+ box-shadow: none;
115
+ outline: none;
116
+ }
117
+
118
+ &.e-outline {
119
+ @include outline-focus;
120
+ @if $skin-name != 'bootstrap5' and $skin-name != 'tailwind' {
121
+ box-shadow: none;
122
+ }
123
+ @if $skin-name == 'bootstrap5' {
124
+ border-color: $btn-outline-focus-bgcolor;
125
+ }
126
+
127
+ &.e-primary {
128
+ @include outline-primary-focus;
129
+ @if $skin-name != 'bootstrap5' and $skin-name != 'tailwind' {
130
+ box-shadow: none;
131
+ }
132
+ @if $skin-name == 'bootstrap5' {
133
+ border-color: $btn-outline-primary-focus-bgcolor;
134
+ }
135
+ }
136
+
137
+ &.e-success {
138
+ @include outline-success-focus;
139
+ @if $skin-name != 'bootstrap5' and $skin-name != 'tailwind' {
140
+ box-shadow: none;
141
+ }
142
+ @if $skin-name == 'bootstrap5' {
143
+ border-color: $btn-success-focus-bgcolor;
144
+ }
145
+ }
146
+
147
+ &.e-info {
148
+ @include outline-info-focus;
149
+ @if $skin-name != 'bootstrap5' and $skin-name != 'tailwind' {
150
+ box-shadow: none;
151
+ }
152
+ @if $skin-name == 'bootstrap5' {
153
+ border-color: $btn-info-hover-bgcolor;
154
+ }
155
+ }
156
+
157
+ &.e-warning {
158
+ @include outline-warning-focus;
159
+ @if $skin-name != 'bootstrap5' and $skin-name != 'tailwind' {
160
+ box-shadow: none;
161
+ }
162
+ @if $skin-name == 'bootstrap5' {
163
+ border-color: $btn-warning-hover-bgcolor;
164
+ }
165
+ }
166
+
167
+ &.e-danger {
168
+ @include outline-danger-focus;
169
+ @if $skin-name != 'bootstrap5' and $skin-name != 'tailwind' {
170
+ box-shadow: none;
171
+ }
172
+ @if $skin-name == 'bootstrap5' {
173
+ border-color: $btn-danger-hover-bgcolor;
174
+ }
175
+ }
176
+ }
177
+ }
178
+
179
+ //Active/Checked state for Normal and Outline GroupButton
180
+ .e-btn:active,
181
+ input:active+label.e-btn,
182
+ input:checked+label.e-btn {
183
+ @include button-active;
184
+
185
+ &.e-primary {
186
+ @include primary-active;
187
+ }
188
+
189
+ &.e-success {
190
+ @include success-active;
191
+ }
192
+
193
+ &.e-info {
194
+ @include info-active;
195
+ }
196
+
197
+ &.e-warning {
198
+ @include warning-active;
199
+ }
200
+
201
+ &.e-danger {
202
+ @include danger-active;
203
+ }
204
+
205
+ &.e-outline {
206
+ @include outline-active;
207
+
208
+ &.e-primary {
209
+ @include outline-primary-active;
210
+ }
211
+
212
+ &.e-success {
213
+ @include outline-success-active;
214
+ }
215
+
216
+ &.e-info {
217
+ @include outline-info-active;
218
+ }
219
+
220
+ &.e-warning {
221
+ @include outline-warning-active;
222
+ }
223
+
224
+ &.e-danger {
225
+ @include outline-danger-active;
226
+ }
227
+ }
228
+ }
229
+
230
+ //Disabled state for Normal and Outline GroupButton
231
+ .e-btn:disabled,
232
+ input:disabled+label.e-btn {
233
+ @include disabled;
234
+ @if $skin-name != 'bootstrap4' {
235
+ border-color: $btn-border-color;
236
+ }
237
+
238
+ &.e-primary {
239
+ @include primary-disabled;
240
+ @if $skin-name != 'bootstrap4' {
241
+ border-color: $btn-primary-border-color;
242
+ }
243
+ }
244
+
245
+ &.e-success {
246
+ @include success-disabled;
247
+ @if $skin-name != 'bootstrap4' {
248
+ border-color: $btn-success-border-color;
249
+ }
250
+ }
251
+
252
+ &.e-info {
253
+ @include info-disabled;
254
+ @if $skin-name != 'bootstrap4' {
255
+ border-color: $btn-info-border-color;
256
+ }
257
+ }
258
+
259
+ &.e-warning {
260
+ @include warning-disabled;
261
+ @if $skin-name != 'bootstrap4' {
262
+ border-color: $btn-warning-border-color;
263
+ }
264
+ }
265
+
266
+ &.e-danger {
267
+ @include danger-disabled;
268
+ @if $skin-name != 'bootstrap4' {
269
+ border-color: $btn-danger-border-color;
270
+ }
271
+ }
272
+
273
+ &.e-link {
274
+ @include link-disabled;
275
+ @if $skin-name != 'bootstrap4' {
276
+ border-color: $btn-link-border-color;
277
+ }
278
+ }
279
+
280
+ &.e-outline {
281
+ @include outline-disabled;
282
+ border-color: $btn-outline-border-color;
283
+
284
+ &.e-primary {
285
+ @include outline-primary-disabled;
286
+ border-color: $btn-primary-bgcolor;
287
+ }
288
+
289
+ &.e-success {
290
+ @include outline-success-disabled;
291
+ border-color: $btn-success-bgcolor;
292
+ }
293
+
294
+ &.e-info {
295
+ @include outline-info-disabled;
296
+ border-color: $btn-info-bgcolor;
297
+ }
298
+
299
+ &.e-warning {
300
+ @include outline-warning-disabled;
301
+ border-color: $btn-warning-bgcolor;
302
+ }
303
+
304
+ &.e-danger {
305
+ @include outline-danger-disabled;
306
+ border-color: $btn-danger-bgcolor;
307
+ }
308
+ }
309
+ }
310
+
311
+ //Normal ButtonGroup layout for highcontrast theme
312
+ @if $skin-name == 'highcontrast' {
313
+ &:not(.e-vertical):not(.e-rtl) {
314
+ .e-btn {
315
+ @include apply-border;
316
+ }
317
+ }
318
+
319
+ &.e-vertical:not(.e-rtl) {
320
+ .e-btn {
321
+ @include apply-border-vertical;
322
+ }
323
+ }
324
+
325
+ .e-btn:hover {
326
+ border-color: $btn-border-color;
327
+
328
+ &.e-primary {
329
+ border-color: $btn-primary-bgcolor;
330
+ }
331
+
332
+ &.e-success {
333
+ border-color: $btn-success-bgcolor;
334
+ }
335
+
336
+ &.e-info {
337
+ border-color: $btn-info-bgcolor;
338
+ }
339
+
340
+ &.e-warning {
341
+ border-color: $btn-warning-bgcolor;
342
+ }
343
+
344
+ &.e-danger {
345
+ border-color: $btn-danger-bgcolor;
346
+ }
347
+ }
348
+ }
349
+
350
+ &:not(.e-vertical):not(.e-rtl) {// Outline GroupButton - Horizontal orientation
351
+ .e-outline {
352
+ @if $skin-name != 'bootstrap' {
353
+ @include apply-border;
354
+ }
355
+ }
356
+ @include different-states;
357
+ }
358
+
359
+ &.e-vertical:not(.e-rtl) {// Outline GroupButton - Vertical Orientation
360
+ .e-outline {
361
+ @include apply-border-vertical;
362
+ }
363
+ @include different-states;
364
+ }
365
+
366
+ // RTL
367
+ &.e-rtl {
368
+ .e-btn {
369
+ @if $skin-name != 'bootstrap' and $skin-name != 'tailwind' and $skin-name !='tailwind-dark' {
370
+ &:not(:first-of-type):not(:last-of-type) {
371
+ border-left: transparent;
372
+ border-right: transparent;
373
+ }
374
+
375
+ &:first-of-type {
376
+ border-left: transparent;
377
+ }
378
+
379
+ &:last-of-type {
380
+ border-right: transparent;
381
+ }
382
+ }
383
+ }
384
+ }
385
+ }
386
+ }
@@ -1 +1,4 @@
1
- @import 'ej2-splitbuttons/styles/button-group/bootstrap-dark.scss';
1
+ @import 'ej2-base/styles/bootstrap-dark-definition.scss';
2
+ @import 'ej2-buttons/styles/button/bootstrap-dark-definition.scss';
3
+ @import 'bootstrap-dark-definition.scss';
4
+ @import 'all.scss';
@@ -1 +1,4 @@
1
- @import 'ej2-splitbuttons/styles/button-group/bootstrap.scss';
1
+ @import 'ej2-base/styles/bootstrap-definition.scss';
2
+ @import 'ej2-buttons/styles/button/bootstrap-definition.scss';
3
+ @import 'bootstrap-definition.scss';
4
+ @import 'all.scss';
@@ -1 +1,4 @@
1
- @import 'ej2-splitbuttons/styles/button-group/bootstrap4.scss';
1
+ @import 'ej2-base/styles/bootstrap4-definition.scss';
2
+ @import 'ej2-buttons/styles/button/bootstrap4-definition.scss';
3
+ @import 'bootstrap4-definition.scss';
4
+ @import 'all.scss';
@@ -1 +1,4 @@
1
- @import 'ej2-splitbuttons/styles/button-group/bootstrap5-dark.scss';
1
+ @import 'ej2-base/styles/bootstrap5-dark-definition.scss';
2
+ @import 'ej2-buttons/styles/button/bootstrap5-dark-definition.scss';
3
+ @import 'bootstrap5-dark-definition.scss';
4
+ @import 'all.scss';
@@ -1 +1,4 @@
1
- @import 'ej2-splitbuttons/styles/button-group/bootstrap5.scss';
1
+ @import 'ej2-base/styles/bootstrap5-definition.scss';
2
+ @import 'ej2-buttons/styles/button/bootstrap5-definition.scss';
3
+ @import 'bootstrap5-definition.scss';
4
+ @import 'all.scss';
@@ -1 +1,4 @@
1
- @import 'ej2-splitbuttons/styles/button-group/fabric-dark.scss';
1
+ @import 'ej2-base/styles/fabric-dark-definition.scss';
2
+ @import 'ej2-buttons/styles/button/fabric-dark-definition.scss';
3
+ @import 'fabric-dark-definition.scss';
4
+ @import 'all.scss';
@@ -1 +1,4 @@
1
- @import 'ej2-splitbuttons/styles/button-group/fabric.scss';
1
+ @import 'ej2-base/styles/fabric-definition.scss';
2
+ @import 'ej2-buttons/styles/button/fabric-definition.scss';
3
+ @import 'fabric-definition.scss';
4
+ @import 'all.scss';
@@ -1 +1,4 @@
1
- @import 'ej2-splitbuttons/styles/button-group/fluent-dark.scss';
1
+ @import 'ej2-base/styles/fluent-dark-definition.scss';
2
+ @import 'ej2-buttons/styles/button/fluent-dark-definition.scss';
3
+ @import 'fluent-dark-definition.scss';
4
+ @import 'all.scss';
@@ -1 +1,4 @@
1
- @import 'ej2-splitbuttons/styles/button-group/fluent.scss';
1
+ @import 'ej2-base/styles/fluent-definition.scss';
2
+ @import 'ej2-buttons/styles/button/fluent-definition.scss';
3
+ @import 'fluent-definition.scss';
4
+ @import 'all.scss';
@@ -1 +1,4 @@
1
- @import 'ej2-splitbuttons/styles/button-group/highcontrast-light.scss';
1
+ @import 'ej2-base/styles/highcontrast-light-definition.scss';
2
+ @import 'ej2-buttons/styles/button/highcontrast-light-definition.scss';
3
+ @import 'highcontrast-light-definition.scss';
4
+ @import 'all.scss';
@@ -1 +1,4 @@
1
- @import 'ej2-splitbuttons/styles/button-group/highcontrast.scss';
1
+ @import 'ej2-base/styles/highcontrast-definition.scss';
2
+ @import 'ej2-buttons/styles/button/highcontrast-definition.scss';
3
+ @import 'highcontrast-definition.scss';
4
+ @import 'all.scss';
@@ -1 +1,4 @@
1
- @import 'ej2-splitbuttons/styles/button-group/material-dark.scss';
1
+ @import 'ej2-base/styles/material-dark-definition.scss';
2
+ @import 'ej2-buttons/styles/button/material-dark-definition.scss';
3
+ @import 'material-dark-definition.scss';
4
+ @import 'all.scss';
@@ -1 +1,4 @@
1
- @import 'ej2-splitbuttons/styles/button-group/material.scss';
1
+ @import 'ej2-base/styles/material-definition.scss';
2
+ @import 'ej2-buttons/styles/button/material-definition.scss';
3
+ @import 'material-definition.scss';
4
+ @import 'all.scss';
@@ -1 +1,4 @@
1
- @import 'ej2-splitbuttons/styles/button-group/tailwind-dark.scss';
1
+ @import 'ej2-base/styles/tailwind-dark-definition.scss';
2
+ @import 'ej2-buttons/styles/button/tailwind-dark-definition.scss';
3
+ @import 'tailwind-dark-definition.scss';
4
+ @import 'all.scss';
@@ -1 +1,4 @@
1
- @import 'ej2-splitbuttons/styles/button-group/tailwind.scss';
1
+ @import 'ej2-base/styles/tailwind-definition.scss';
2
+ @import 'ej2-buttons/styles/button/tailwind-definition.scss';
3
+ @import 'tailwind-definition.scss';
4
+ @import 'all.scss';
@@ -0,0 +1,2 @@
1
+ @import 'layout.scss';
2
+ @import 'theme.scss';
@@ -0,0 +1,51 @@
1
+ //default
2
+ $drop-down-btn-arrow-content: '\e969' !default;
3
+ $drop-down-btn-vertical-btn-padding: 6px 12px !default;
4
+ $drop-down-btn-vertical-bigger-padding: 8px 16px !default;
5
+ $drop-down-btn-bigger-font-size: 15px !default;
6
+ $drop-down-btn-bigger-li-height: 40px !default;
7
+ $drop-down-btn-bigger-max-width: 280px !default;
8
+ $drop-down-btn-bigger-min-width: 112px !default;
9
+ $drop-down-btn-color: $grey-dark-font !default;
10
+ $drop-down-btn-disable-text: rgba($grey-dark-font, .65) !default;
11
+ $drop-down-btn-font-size: 14px !default;
12
+ $drop-down-btn-font-weight: normal !default;
13
+ $drop-down-btn-icon-margin-right: 12px !default;
14
+ $drop-down-btn-bigger-icon-margin-right: 12px !default;
15
+ $drop-down-btn-li-bgcolor: $grey-44 !default;
16
+ $drop-down-btn-li-box-shadow: inset 0 0 0 1px $grey-8c !default;
17
+ $drop-down-btn-li-border-color: $grey-44 !default;
18
+ $drop-down-btn-li-border-style: solid !default;
19
+ $drop-down-btn-li-border-width: 1px !default;
20
+ $drop-down-btn-li-focus-bgcolor: transparent !default;
21
+ $drop-down-btn-li-height: 26px !default;
22
+ $drop-down-btn-li-padding: 0 14px !default;
23
+ $drop-down-btn-bigger-li-padding: 0 14px !default;
24
+ $drop-down-btn-small-li-padding: 0 14px !default;
25
+ $drop-down-btn-li-selection-bgcolor: $brand-primary !default;
26
+ $drop-down-btn-li-selection-font-color: $brand-primary-font !default;
27
+ $drop-down-btn-max-width: 240px !default;
28
+ $drop-down-btn-icon-font-size: 14px !default;
29
+ $drop-down-btn-menu-icon-bigger-font-size: 16px !default;
30
+ $drop-down-btn-menu-icon-color: $grey-dark-font !default;
31
+ $drop-down-btn-menu-icon-disabled-color: rgba($grey-dark-font, .65) !default;
32
+ $drop-down-btn-menu-icon-font-size: 16px !default;
33
+ $drop-down-btn-min-width: 120px !default;
34
+ $drop-down-btn-parent-ul-box-shadow: 0 6px 12px rgba($grey-base, .175) !default;
35
+ $drop-down-btn-seperator-padding: 3px 0 !default;
36
+ $drop-down-btn-selected-color: $brand-primary-font !default;
37
+ $drop-down-btn-sub-ul-box-shadow: 0 6px 12px rgba($grey-base, .175) !default;
38
+ $drop-down-btn-ul-bgcolor: $grey-dark !default;
39
+ $drop-down-btn-ul-border: 1px solid $grey-44 !default;
40
+ $drop-down-btn-ul-border-radius: 4px !default;
41
+ $drop-down-btn-ul-padding: 3px 0 !default;
42
+ $drop-down-btn-ul-bigger-padding: 5px 0 !default;
43
+ $drop-down-btn-ul-small-padding: 5px 0 !default;
44
+ $drop-down-btn-caret-icon-font-size: 8px !default;
45
+ $drop-down-btn-icon-font-size-bigger: 16px !default;
46
+ $drop-down-btn-caret-icon-font-size-bigger: 10px !default;
47
+ $drop-down-btn-box-shadow: none !default;
48
+ $drop-down-btn-popup-margin-top: 0 !default;
49
+ $drop-down-btn-bigger-popup-margin-top: 0 !default;
50
+
51
+ //enddefault
@@ -0,0 +1,48 @@
1
+ $drop-down-btn-arrow-content: '\e969' !default;
2
+ $drop-down-btn-vertical-btn-padding: 6px 12px !default;
3
+ $drop-down-btn-vertical-bigger-padding: 8px 16px !default;
4
+ $drop-down-btn-bigger-font-size: 15px !default;
5
+ $drop-down-btn-bigger-li-height: 40px !default;
6
+ $drop-down-btn-bigger-max-width: 280px !default;
7
+ $drop-down-btn-bigger-min-width: 112px !default;
8
+ $drop-down-btn-color: $grey-dark !default;
9
+ $drop-down-btn-disable-text: rgba($grey, .65) !default;
10
+ $drop-down-btn-font-size: 14px !default;
11
+ $drop-down-btn-font-weight: normal !default;
12
+ $drop-down-btn-icon-font-size: 14px !default;
13
+ $drop-down-btn-icon-margin-right: 12px !default;
14
+ $drop-down-btn-bigger-icon-margin-right: 12px !default;
15
+ $drop-down-btn-li-bgcolor: $grey-e6 !default;
16
+ $drop-down-btn-li-box-shadow: 0 0 0 1px $grey-8c inset !default;
17
+ $drop-down-btn-li-border-color: $grey-e6 !default;
18
+ $drop-down-btn-li-border-style: solid !default;
19
+ $drop-down-btn-li-border-width: 1px !default;
20
+ $drop-down-btn-li-focus-bgcolor: transparent !default;
21
+ $drop-down-btn-li-height: 26px !default;
22
+ $drop-down-btn-li-padding: 0 14px !default;
23
+ $drop-down-btn-bigger-li-padding: 0 14px !default;
24
+ $drop-down-btn-small-li-padding: 0 14px !default;
25
+ $drop-down-btn-li-selection-bgcolor: $grey-e6 !default;
26
+ $drop-down-btn-li-selection-font-color: $grey-dark !default;
27
+ $drop-down-btn-max-width: 240px !default;
28
+ $drop-down-btn-menu-icon-bigger-font-size: 16px !default;
29
+ $drop-down-btn-menu-icon-color: $grey-dark !default;
30
+ $drop-down-btn-menu-icon-disabled-color: rgba($grey-light-font, .65) !default;
31
+ $drop-down-btn-menu-icon-font-size: 16px !default;
32
+ $drop-down-btn-min-width: 120px !default;
33
+ $drop-down-btn-parent-ul-box-shadow: 0 6px 12px rgba($grey-base, .175) !default;
34
+ $drop-down-btn-seperator-padding: 3px 0 !default;
35
+ $drop-down-btn-selected-color: $grey-dark !default;
36
+ $drop-down-btn-sub-ul-box-shadow: 0 6px 12px rgba($grey-base, .175) !default;
37
+ $drop-down-btn-ul-bgcolor: $grey-white !default;
38
+ $drop-down-btn-ul-border: 1px solid $grey-cc !default;
39
+ $drop-down-btn-ul-border-radius: 4px !default;
40
+ $drop-down-btn-ul-padding: 3px 0 !default;
41
+ $drop-down-btn-ul-bigger-padding: 5px 0 !default;
42
+ $drop-down-btn-ul-small-padding: 5px 0 !default;
43
+ $drop-down-btn-caret-icon-font-size: 8px !default;
44
+ $drop-down-btn-icon-font-size-bigger: 16px !default;
45
+ $drop-down-btn-caret-icon-font-size-bigger: 10px !default;
46
+ $drop-down-btn-box-shadow: none !default;
47
+ $drop-down-btn-popup-margin-top: 0 !default;
48
+ $drop-down-btn-bigger-popup-margin-top: 0 !default;
@@ -0,0 +1,48 @@
1
+ $drop-down-btn-arrow-content: '\e969' !default;
2
+ $drop-down-btn-vertical-btn-padding: 6px 12px !default;
3
+ $drop-down-btn-vertical-bigger-padding: 8px 16px !default;
4
+ $drop-down-btn-bigger-font-size: 16px !default;
5
+ $drop-down-btn-bigger-li-height: 32px !default;
6
+ $drop-down-btn-bigger-max-width: 280px !default;
7
+ $drop-down-btn-bigger-min-width: 112px !default;
8
+ $drop-down-btn-color: $gray-900 !default;
9
+ $drop-down-btn-disable-text: rgba($gray-600, .65) !default;
10
+ $drop-down-btn-font-size: 14px !default;
11
+ $drop-down-btn-font-weight: normal !default;
12
+ $drop-down-btn-icon-font-size: 14px !default;
13
+ $drop-down-btn-icon-margin-right: 8px !default;
14
+ $drop-down-btn-bigger-icon-margin-right: 0 !default;
15
+ $drop-down-btn-li-bgcolor: darken($gray-100, 2%) !default;
16
+ $drop-down-btn-li-box-shadow: none !default;
17
+ $drop-down-btn-li-border-color: $gray-600 !default;
18
+ $drop-down-btn-li-border-style: solid !default;
19
+ $drop-down-btn-li-border-width: 1px !default;
20
+ $drop-down-btn-li-focus-bgcolor: darken($gray-100, 2%) !default;
21
+ $drop-down-btn-li-height: 26px !default;
22
+ $drop-down-btn-li-padding: 0 20px !default;
23
+ $drop-down-btn-bigger-li-padding: 0 24px !default;
24
+ $drop-down-btn-small-li-padding: 0 16px !default;
25
+ $drop-down-btn-li-selection-bgcolor: $primary !default;
26
+ $drop-down-btn-li-selection-font-color: $gray-900 !default;
27
+ $drop-down-btn-max-width: 240px !default;
28
+ $drop-down-btn-menu-icon-bigger-font-size: 16px !default;
29
+ $drop-down-btn-menu-icon-color: $gray-900 !default;
30
+ $drop-down-btn-menu-icon-disabled-color: $gray-600 !default;
31
+ $drop-down-btn-menu-icon-font-size: 16px !default;
32
+ $drop-down-btn-min-width: 120px !default;
33
+ $drop-down-btn-parent-ul-box-shadow: none !default;
34
+ $drop-down-btn-seperator-padding: 3px 0 !default;
35
+ $drop-down-btn-selected-color: $white !default;
36
+ $drop-down-btn-sub-ul-box-shadow: none !default;
37
+ $drop-down-btn-ul-bgcolor: $content-popup-bg !default;
38
+ $drop-down-btn-ul-border: 1px solid rgba($black, .15) !default;
39
+ $drop-down-btn-ul-border-radius: 4px !default;
40
+ $drop-down-btn-ul-padding: 6px 0 !default;
41
+ $drop-down-btn-ul-bigger-padding: 8px 0 !default;
42
+ $drop-down-btn-ul-small-padding: 4px 0 !default;
43
+ $drop-down-btn-caret-icon-font-size: 8px !default;
44
+ $drop-down-btn-icon-font-size-bigger: 16px !default;
45
+ $drop-down-btn-caret-icon-font-size-bigger: 10px !default;
46
+ $drop-down-btn-box-shadow: none !default;
47
+ $drop-down-btn-popup-margin-top: 0 !default;
48
+ $drop-down-btn-bigger-popup-margin-top: 0 !default;
@@ -0,0 +1 @@
1
+ @import './bootstrap5-definition.scss';