@syncfusion/ej2-splitbuttons 26.1.35 → 26.2.5

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 (12) hide show
  1. package/dist/ej2-splitbuttons.min.js +2 -2
  2. package/dist/ej2-splitbuttons.umd.min.js +1 -1
  3. package/dist/global/ej2-splitbuttons.min.js +1 -1
  4. package/dist/global/index.d.ts +1 -1
  5. package/package.json +7 -7
  6. package/styles/button-group/fluent2.css +34 -34
  7. package/styles/drop-down-button/fluent2.css +34 -34
  8. package/styles/fluent2.css +42 -46
  9. package/styles/progress-button/_bds-definition.scss +0 -5
  10. package/styles/progress-button/_fluent2-definition.scss +0 -5
  11. package/styles/progress-button/fluent2.css +30 -34
  12. package/styles/split-button/fluent2.css +34 -34
package/styles/drop-down-button/fluent2.css CHANGED
@@ -10,7 +10,7 @@
10
10
  --color-sf-success: #0e700e;
11
11
  --color-sf-info: #008aa9;
12
12
  --color-sf-warning: #bc4b09;
13
- --color-sf-danger: #b10e1c;
13
+ --color-sf-danger: #d13438;
14
14
  --color-sf-success-light: #54b054;
15
15
  --color-sf-info-light: #56bfd7;
16
16
  --color-sf-warning-light: #fee5d7;
@@ -221,7 +221,7 @@
221
221
  --color-sf-diagram-palette-background: var(--color-sf-content-bg-color-alt1);
222
222
  --color-sf-diagram-palette-hover-background: var(--color-sf-content-bg-color-hover);
223
223
  --color-sf-diagram-palette-selected-background: var(--color-sf-content-bg-color-selected);
224
- --color-sf-rating-selected-color: var(--color-sf-content-text-color);
224
+ --color-sf-rating-selected-color: #242424;
225
225
  --color-sf-rating-unrated-color: var(--color-sf-content-text-color);
226
226
  --color-sf-rating-selected-disabled-color: #b3b3b3;
227
227
  --color-sf-rating-unrated-disabled-color: #b3b3b3;
@@ -246,7 +246,7 @@
246
246
  --color-sf-msg-success-color: var(--color-sf-content-text-color);
247
247
  --color-sf-msg-success-bg-color: #f1faf1;
248
248
  --color-sf-msg-success-border-color: #9fd89f;
249
- --color-sf-msg-success-color-alt1: var(--color-sf-success);
249
+ --color-sf-msg-success-color-alt1: #0e700e;
250
250
  --color-sf-msg-success-bg-color-alt1: transparent;
251
251
  --color-sf-msg-success-border-color-alt1: var(--color-sf-msg-success-border-color);
252
252
  --color-sf-msg-success-color-alt2: #fff;
@@ -261,7 +261,7 @@
261
261
  --color-sf-msg-danger-color: var(--color-sf-content-text-color);
262
262
  --color-sf-msg-danger-bg-color: #fdf3f4;
263
263
  --color-sf-msg-danger-border-color: #eeacb2;
264
- --color-sf-msg-danger-color-alt1: var(--color-sf-danger);
264
+ --color-sf-msg-danger-color-alt1: #b10e1c;
265
265
  --color-sf-msg-danger-bg-color-alt1: transparent;
266
266
  --color-sf-msg-danger-border-color-alt1: var(--color-sf-msg-danger-border-color);
267
267
  --color-sf-msg-danger-color-alt2: #fff;
@@ -276,7 +276,7 @@
276
276
  --color-sf-msg-info-color: var(--color-sf-content-text-color);
277
277
  --color-sf-msg-info-bg-color: #f2fafc;
278
278
  --color-sf-msg-info-border-color: #a4deeb;
279
- --color-sf-msg-info-color-alt1: var(--color-sf-info);
279
+ --color-sf-msg-info-color-alt1: #00748f;
280
280
  --color-sf-msg-info-bg-color-alt1: transparent;
281
281
  --color-sf-msg-info-border-color-alt1: var(--color-sf-msg-info-border-color);
282
282
  --color-sf-msg-info-color-alt2: #fff;
@@ -291,7 +291,7 @@
291
291
  --color-sf-msg-warning-color: var(--color-sf-content-text-color);
292
292
  --color-sf-msg-warning-bg-color: #fdf6f3;
293
293
  --color-sf-msg-warning-border-color: #f4bfab;
294
- --color-sf-msg-warning-color-alt1: var(--color-sf-warning);
294
+ --color-sf-msg-warning-color-alt1: #c43501;
295
295
  --color-sf-msg-warning-bg-color-alt1: transparent;
296
296
  --color-sf-msg-warning-border-color-alt1: var(--color-sf-msg-warning-border-color);
297
297
  --color-sf-msg-warning-color-alt2: #fff;
@@ -317,7 +317,7 @@
317
317
  --color-sf-link-button-focus: #0f6cbd;
318
318
  --color-sf-link-button-border-focus: #242424;
319
319
  --color-sf-chip-bg-color: #f5f5f5;
320
- --color-sf-chip-border-color: rgba(0, 0, 0, 0);
320
+ --color-sf-chip-border-color: #f5f5f5;
321
321
  --color-sf-chip-bg-disabled: #f0f0f0;
322
322
  --color-sf-chip-border-disabled: #fff;
323
323
  --color-sf-secondary-outline-button-text-color-hover: #242424;
@@ -406,7 +406,7 @@
406
406
  --color-sf-border-focus: var(--color-sf-border);
407
407
  --color-sf-border-selected: #6b6b6b;
408
408
  --color-sf-border-dragged: var(--color-sf-primary);
409
- --color-sf-border-disabled: #08233b;
409
+ --color-sf-border-disabled: #424242;
410
410
  --color-sf-border-warning: #bc4b09;
411
411
  --color-sf-border-error: #dc626d;
412
412
  --color-sf-border-success: #9fd89f;
@@ -569,7 +569,7 @@
569
569
  --color-sf-diagram-palette-background: #e0e0e0;
570
570
  --color-sf-diagram-palette-hover-background: #bdbdbd;
571
571
  --color-sf-diagram-palette-selected-background: var(--color-sf-diagram-palette-hover-background);
572
- --color-sf-rating-selected-color: var(--color-sf-content-text-color);
572
+ --color-sf-rating-selected-color: #fff;
573
573
  --color-sf-rating-unrated-color: var(--color-sf-content-text-color);
574
574
  --color-sf-rating-selected-disabled-color: #575757;
575
575
  --color-sf-rating-unrated-disabled-color: #4d4d4d;
@@ -581,9 +581,9 @@
581
581
  --color-sf-msg-border-color: var(--color-sf-border);
582
582
  --color-sf-msg-color-alt1: var(--color-sf-content-text-color);
583
583
  --color-sf-msg-bg-color-alt1: transparent;
584
- --color-sf-msg-border-color-alt1: var(--color-sf-msg-bg-color);
584
+ --color-sf-msg-border-color-alt1: #666666;
585
585
  --color-sf-msg-color-alt2: #242424;
586
- --color-sf-msg-bg-color-alt2: #adadad;
586
+ --color-sf-msg-bg-color-alt2: #c2c2c2;
587
587
  --color-sf-msg-border-color-alt2: var(--color-sf-msg-bg-color-alt2);
588
588
  --color-sf-msg-icon-color: var(--color-sf-msg-bg-color-alt2);
589
589
  --color-sf-msg-icon-color-alt1: var(--color-sf-msg-icon-color);
@@ -594,9 +594,9 @@
594
594
  --color-sf-msg-success-color: var(--color-sf-content-text-color);
595
595
  --color-sf-msg-success-bg-color: #052505;
596
596
  --color-sf-msg-success-border-color: #107c10;
597
- --color-sf-msg-success-color-alt1: var(--color-sf-success);
597
+ --color-sf-msg-success-color-alt1: #54b054;
598
598
  --color-sf-msg-success-bg-color-alt1: transparent;
599
- --color-sf-msg-success-border-color-alt1: var(--color-sf-msg-success-color);
599
+ --color-sf-msg-success-border-color-alt1: #218c21;
600
600
  --color-sf-msg-success-color-alt2: #fff;
601
601
  --color-sf-msg-success-bg-color-alt2: #107c10;
602
602
  --color-sf-msg-success-border-color-alt2: var(--color-sf-msg-success-bg-color-alt2);
@@ -609,9 +609,9 @@
609
609
  --color-sf-msg-danger-color: var(--color-sf-content-text-color);
610
610
  --color-sf-msg-danger-bg-color: #3b0509;
611
611
  --color-sf-msg-danger-border-color: #c50f1f;
612
- --color-sf-msg-danger-color-alt1: var(--color-sf-danger);
612
+ --color-sf-msg-danger-color-alt1: #dc626d;
613
613
  --color-sf-msg-danger-bg-color-alt1: transparent;
614
- --color-sf-msg-danger-border-color-alt1: var(--color-sf-msg-danger-border-color);
614
+ --color-sf-msg-danger-border-color-alt1: #d33f4c;
615
615
  --color-sf-msg-danger-color-alt2: #fff;
616
616
  --color-sf-msg-danger-bg-color-alt2: #c50f1f;
617
617
  --color-sf-msg-danger-border-color-alt2: var(--color-sf-msg-danger-bg-color-alt2);
@@ -624,9 +624,9 @@
624
624
  --color-sf-msg-info-color: var(--color-sf-content-text-color);
625
625
  --color-sf-msg-info-bg-color: #002e38;
626
626
  --color-sf-msg-info-border-color: #0099bc;
627
- --color-sf-msg-info-color-alt1: var(--color-sf-info);
627
+ --color-sf-msg-info-color-alt1: #56bfd7;
628
628
  --color-sf-msg-info-bg-color-alt1: transparent;
629
- --color-sf-msg-info-border-color-alt1: var(--color-sf-msg-info-border-color);
629
+ --color-sf-msg-info-border-color-alt1: #31afdd;
630
630
  --color-sf-msg-info-color-alt2: #fff;
631
631
  --color-sf-msg-info-bg-color-alt2: #0099bc;
632
632
  --color-sf-msg-info-border-color-alt2: var(--color-sf-msg-info-bg-color-alt2);
@@ -639,9 +639,9 @@
639
639
  --color-sf-msg-warning-color: var(--color-sf-content-text-color);
640
640
  --color-sf-msg-warning-bg-color: #411200;
641
641
  --color-sf-msg-warning-border-color: #da3b01;
642
- --color-sf-msg-warning-color-alt1: var(--color-sf-warning);
642
+ --color-sf-msg-warning-color-alt1: #e9835e;
643
643
  --color-sf-msg-warning-bg-color-alt1: transparent;
644
- --color-sf-msg-warning-border-color-alt1: var(--color-sf-msg-warning-border-color);
644
+ --color-sf-msg-warning-border-color-alt1: #e36537;
645
645
  --color-sf-msg-warning-color-alt2: #fff;
646
646
  --color-sf-msg-warning-bg-color-alt2: #da3b01;
647
647
  --color-sf-msg-warning-border-color-alt2: var(--color-sf-msg-warning-bg-color-alt2);
@@ -659,7 +659,7 @@
659
659
  --color-sf-link-button-focus: #115ea3;
660
660
  --color-sf-link-button-border-focus: #fff;
661
661
  --color-sf-chip-bg-color: #141414;
662
- --color-sf-chip-border-color: rgba(0, 0, 0, 0);
662
+ --color-sf-chip-border-color: #141414;
663
663
  --color-sf-chip-bg-disabled: #141414;
664
664
  --color-sf-chip-border-disabled: rgba(0, 0, 0, 0);
665
665
  --color-sf-secondary-outline-button-text-color-hover: #fff;
@@ -714,7 +714,7 @@
714
714
  --color-sf-overlay-bg-color: rgba($black, .4);
715
715
  --color-sf-table-bg-color-hover: var(--color-sf-black);
716
716
  --color-sf-table-bg-color-pressed: var(--color-sf-black);
717
- --color-sf-table-bg-color-selected: var(--color-sf-black);
717
+ --color-sf-table-bg-color-selected: #1a3bff;
718
718
  --color-sf-content-text-color: #fff;
719
719
  --color-sf-content-text-color-alt1: var(--color-sf-content-text-color);
720
720
  --color-sf-content-text-color-alt2: var(--color-sf-content-text-color);
@@ -724,7 +724,7 @@
724
724
  --color-sf-content-text-color-focus: var(--color-sf-content-text-color-hover);
725
725
  --color-sf-content-text-color-selected: var(--color-sf-content-text-color-hover);
726
726
  --color-sf-content-text-color-dragged: #000;
727
- --color-sf-content-text-color-disabled: var(--color-sf-content-bg-color-disabled);
727
+ --color-sf-content-text-color-disabled: #3ff23f;
728
728
  --color-sf-placeholder-text-color: var(--color-sf-content-text-color);
729
729
  --color-sf-flyout-text-color: var(--color-sf-content-text-color);
730
730
  --color-sf-flyout-text-color-hover: var(--color-sf-content-text-color-hover);
@@ -748,12 +748,12 @@
748
748
  --color-sf-border-focus: var(--color-sf-border-hover);
749
749
  --color-sf-border-selected: var(--color-sf-border-hover);
750
750
  --color-sf-border-dragged: var(--color-sf-border-light);
751
- --color-sf-border-disabled: #fff;
751
+ --color-sf-border-disabled: #3ff23f;
752
752
  --color-sf-border-warning: #f7630c;
753
753
  --color-sf-border-error: #c50f1f;
754
754
  --color-sf-border-success: #107c10;
755
755
  --color-sf-border-info: #0099bc;
756
- --color-sf-spreadsheet-gridline: var(--color-sf-border-light);
756
+ --color-sf-spreadsheet-gridline: #e6e6e6;
757
757
  --color-sf-flyout-border: var(--color-sf-border-light);
758
758
  --color-sf-primary: #1aebff;
759
759
  --color-sf-primary-text-color: #000;
@@ -911,7 +911,7 @@
911
911
  --color-sf-diagram-palette-background: #000;
912
912
  --color-sf-diagram-palette-hover-background: var(--color-sf-content-bg-color-hover);
913
913
  --color-sf-diagram-palette-selected-background: var(--color-sf-diagram-palette-hover-background);
914
- --color-sf-rating-selected-color: var(--color-sf-content-text-color);
914
+ --color-sf-rating-selected-color: #fff;
915
915
  --color-sf-rating-unrated-color: var(--color-sf-content-text-color);
916
916
  --color-sf-rating-selected-disabled-color: var(--color-sf-content-text-color-disabled);
917
917
  --color-sf-rating-unrated-disabled-color: var(--color-sf-content-text-color-disabled);
@@ -936,7 +936,7 @@
936
936
  --color-sf-msg-success-color: #107c10;
937
937
  --color-sf-msg-success-bg-color: #000;
938
938
  --color-sf-msg-success-border-color: var(--color-sf-msg-success-color);
939
- --color-sf-msg-success-color-alt1: var(--color-sf-success);
939
+ --color-sf-msg-success-color-alt1: #107c10;
940
940
  --color-sf-msg-success-bg-color-alt1: var(--color-sf-msg-success-bg-color);
941
941
  --color-sf-msg-success-border-color-alt1: #fff;
942
942
  --color-sf-msg-success-color-alt2: var(--color-sf-msg-success-bg-color);
@@ -951,7 +951,7 @@
951
951
  --color-sf-msg-danger-color: #c50f1f;
952
952
  --color-sf-msg-danger-bg-color: #000;
953
953
  --color-sf-msg-danger-border-color: var(--color-sf-msg-danger-color);
954
- --color-sf-msg-danger-color-alt1: var(--color-sf-danger);
954
+ --color-sf-msg-danger-color-alt1: #c50f1f;
955
955
  --color-sf-msg-danger-bg-color-alt1: var(--color-sf-msg-danger-bg-color);
956
956
  --color-sf-msg-danger-border-color-alt1: #fff;
957
957
  --color-sf-msg-danger-color-alt2: var(--color-sf-msg-danger-bg-color);
@@ -966,7 +966,7 @@
966
966
  --color-sf-msg-info-color: #0099bc;
967
967
  --color-sf-msg-info-bg-color: #000;
968
968
  --color-sf-msg-info-border-color: var(--color-sf-msg-info-color);
969
- --color-sf-msg-info-color-alt1: var(--color-sf-info);
969
+ --color-sf-msg-info-color-alt1: #0099bc;
970
970
  --color-sf-msg-info-bg-color-alt1: var(--color-sf-msg-info-bg-color);
971
971
  --color-sf-msg-info-border-color-alt1: #fff;
972
972
  --color-sf-msg-info-color-alt2: var(--color-sf-msg-info-bg-color);
@@ -981,7 +981,7 @@
981
981
  --color-sf-msg-warning-color: #f7630c;
982
982
  --color-sf-msg-warning-bg-color: #000;
983
983
  --color-sf-msg-warning-border-color: #da3b01;
984
- --color-sf-msg-warning-color-alt1: var(--color-sf-warning);
984
+ --color-sf-msg-warning-color-alt1: #f7630c;
985
985
  --color-sf-msg-warning-bg-color-alt1: var(--color-sf-msg-warning-bg-color);
986
986
  --color-sf-msg-warning-border-color-alt1: #fff;
987
987
  --color-sf-msg-warning-color-alt2: var(--color-sf-msg-warning-bg-color);
@@ -1022,7 +1022,7 @@
1022
1022
  --color-sf-secondary-badge-border-color: #fff;
1023
1023
  --color-sf-secondary-badge-bg-color: #000;
1024
1024
  --color-sf-secondary-badge-bg-color-focus: #fff;
1025
- --color-sf-skeleton-bg-color: #ffffff;
1025
+ --color-sf-skeleton-bg-color: #fff;
1026
1026
  --color-sf-tab-selected-bg-color-disabled: #000;
1027
1027
  --color-sf-tab-selected-text-color-disabled: #3ff23f;
1028
1028
  --color-sf-ribbon-border-color: #fff;
@@ -1055,8 +1055,8 @@
1055
1055
  }
1056
1056
  .e-dropdown-btn:focus-visible,
1057
1057
  .e-dropdown-btn.e-btn:focus-visible {
1058
- -webkit-box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px #fff;
1059
- box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px #fff;
1058
+ -webkit-box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px var(--color-sf-shadow-color1);
1059
+ box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px var(--color-sf-shadow-color1);
1060
1060
  }
1061
1061
  .e-dropdown-btn:active,
1062
1062
  .e-dropdown-btn.e-btn:active {
@@ -1280,8 +1280,8 @@
1280
1280
  }
1281
1281
  .e-dropdown-popup ul .e-item:focus-visible {
1282
1282
  background-color: var(--color-sf-flyout-bg-color-focus);
1283
- -webkit-box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px #fff;
1284
- box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px #fff;
1283
+ -webkit-box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px var(--color-sf-shadow-color1);
1284
+ box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px var(--color-sf-shadow-color1);
1285
1285
  }
1286
1286
  .e-dropdown-popup ul .e-separator {
1287
1287
  border-bottom-color: var(--color-sf-border-light);
package/styles/fluent2.css CHANGED
@@ -10,7 +10,7 @@
10
10
  --color-sf-success: #0e700e;
11
11
  --color-sf-info: #008aa9;
12
12
  --color-sf-warning: #bc4b09;
13
- --color-sf-danger: #b10e1c;
13
+ --color-sf-danger: #d13438;
14
14
  --color-sf-success-light: #54b054;
15
15
  --color-sf-info-light: #56bfd7;
16
16
  --color-sf-warning-light: #fee5d7;
@@ -221,7 +221,7 @@
221
221
  --color-sf-diagram-palette-background: var(--color-sf-content-bg-color-alt1);
222
222
  --color-sf-diagram-palette-hover-background: var(--color-sf-content-bg-color-hover);
223
223
  --color-sf-diagram-palette-selected-background: var(--color-sf-content-bg-color-selected);
224
- --color-sf-rating-selected-color: var(--color-sf-content-text-color);
224
+ --color-sf-rating-selected-color: #242424;
225
225
  --color-sf-rating-unrated-color: var(--color-sf-content-text-color);
226
226
  --color-sf-rating-selected-disabled-color: #b3b3b3;
227
227
  --color-sf-rating-unrated-disabled-color: #b3b3b3;
@@ -246,7 +246,7 @@
246
246
  --color-sf-msg-success-color: var(--color-sf-content-text-color);
247
247
  --color-sf-msg-success-bg-color: #f1faf1;
248
248
  --color-sf-msg-success-border-color: #9fd89f;
249
- --color-sf-msg-success-color-alt1: var(--color-sf-success);
249
+ --color-sf-msg-success-color-alt1: #0e700e;
250
250
  --color-sf-msg-success-bg-color-alt1: transparent;
251
251
  --color-sf-msg-success-border-color-alt1: var(--color-sf-msg-success-border-color);
252
252
  --color-sf-msg-success-color-alt2: #fff;
@@ -261,7 +261,7 @@
261
261
  --color-sf-msg-danger-color: var(--color-sf-content-text-color);
262
262
  --color-sf-msg-danger-bg-color: #fdf3f4;
263
263
  --color-sf-msg-danger-border-color: #eeacb2;
264
- --color-sf-msg-danger-color-alt1: var(--color-sf-danger);
264
+ --color-sf-msg-danger-color-alt1: #b10e1c;
265
265
  --color-sf-msg-danger-bg-color-alt1: transparent;
266
266
  --color-sf-msg-danger-border-color-alt1: var(--color-sf-msg-danger-border-color);
267
267
  --color-sf-msg-danger-color-alt2: #fff;
@@ -276,7 +276,7 @@
276
276
  --color-sf-msg-info-color: var(--color-sf-content-text-color);
277
277
  --color-sf-msg-info-bg-color: #f2fafc;
278
278
  --color-sf-msg-info-border-color: #a4deeb;
279
- --color-sf-msg-info-color-alt1: var(--color-sf-info);
279
+ --color-sf-msg-info-color-alt1: #00748f;
280
280
  --color-sf-msg-info-bg-color-alt1: transparent;
281
281
  --color-sf-msg-info-border-color-alt1: var(--color-sf-msg-info-border-color);
282
282
  --color-sf-msg-info-color-alt2: #fff;
@@ -291,7 +291,7 @@
291
291
  --color-sf-msg-warning-color: var(--color-sf-content-text-color);
292
292
  --color-sf-msg-warning-bg-color: #fdf6f3;
293
293
  --color-sf-msg-warning-border-color: #f4bfab;
294
- --color-sf-msg-warning-color-alt1: var(--color-sf-warning);
294
+ --color-sf-msg-warning-color-alt1: #c43501;
295
295
  --color-sf-msg-warning-bg-color-alt1: transparent;
296
296
  --color-sf-msg-warning-border-color-alt1: var(--color-sf-msg-warning-border-color);
297
297
  --color-sf-msg-warning-color-alt2: #fff;
@@ -317,7 +317,7 @@
317
317
  --color-sf-link-button-focus: #0f6cbd;
318
318
  --color-sf-link-button-border-focus: #242424;
319
319
  --color-sf-chip-bg-color: #f5f5f5;
320
- --color-sf-chip-border-color: rgba(0, 0, 0, 0);
320
+ --color-sf-chip-border-color: #f5f5f5;
321
321
  --color-sf-chip-bg-disabled: #f0f0f0;
322
322
  --color-sf-chip-border-disabled: #fff;
323
323
  --color-sf-secondary-outline-button-text-color-hover: #242424;
@@ -406,7 +406,7 @@
406
406
  --color-sf-border-focus: var(--color-sf-border);
407
407
  --color-sf-border-selected: #6b6b6b;
408
408
  --color-sf-border-dragged: var(--color-sf-primary);
409
- --color-sf-border-disabled: #08233b;
409
+ --color-sf-border-disabled: #424242;
410
410
  --color-sf-border-warning: #bc4b09;
411
411
  --color-sf-border-error: #dc626d;
412
412
  --color-sf-border-success: #9fd89f;
@@ -569,7 +569,7 @@
569
569
  --color-sf-diagram-palette-background: #e0e0e0;
570
570
  --color-sf-diagram-palette-hover-background: #bdbdbd;
571
571
  --color-sf-diagram-palette-selected-background: var(--color-sf-diagram-palette-hover-background);
572
- --color-sf-rating-selected-color: var(--color-sf-content-text-color);
572
+ --color-sf-rating-selected-color: #fff;
573
573
  --color-sf-rating-unrated-color: var(--color-sf-content-text-color);
574
574
  --color-sf-rating-selected-disabled-color: #575757;
575
575
  --color-sf-rating-unrated-disabled-color: #4d4d4d;
@@ -581,9 +581,9 @@
581
581
  --color-sf-msg-border-color: var(--color-sf-border);
582
582
  --color-sf-msg-color-alt1: var(--color-sf-content-text-color);
583
583
  --color-sf-msg-bg-color-alt1: transparent;
584
- --color-sf-msg-border-color-alt1: var(--color-sf-msg-bg-color);
584
+ --color-sf-msg-border-color-alt1: #666666;
585
585
  --color-sf-msg-color-alt2: #242424;
586
- --color-sf-msg-bg-color-alt2: #adadad;
586
+ --color-sf-msg-bg-color-alt2: #c2c2c2;
587
587
  --color-sf-msg-border-color-alt2: var(--color-sf-msg-bg-color-alt2);
588
588
  --color-sf-msg-icon-color: var(--color-sf-msg-bg-color-alt2);
589
589
  --color-sf-msg-icon-color-alt1: var(--color-sf-msg-icon-color);
@@ -594,9 +594,9 @@
594
594
  --color-sf-msg-success-color: var(--color-sf-content-text-color);
595
595
  --color-sf-msg-success-bg-color: #052505;
596
596
  --color-sf-msg-success-border-color: #107c10;
597
- --color-sf-msg-success-color-alt1: var(--color-sf-success);
597
+ --color-sf-msg-success-color-alt1: #54b054;
598
598
  --color-sf-msg-success-bg-color-alt1: transparent;
599
- --color-sf-msg-success-border-color-alt1: var(--color-sf-msg-success-color);
599
+ --color-sf-msg-success-border-color-alt1: #218c21;
600
600
  --color-sf-msg-success-color-alt2: #fff;
601
601
  --color-sf-msg-success-bg-color-alt2: #107c10;
602
602
  --color-sf-msg-success-border-color-alt2: var(--color-sf-msg-success-bg-color-alt2);
@@ -609,9 +609,9 @@
609
609
  --color-sf-msg-danger-color: var(--color-sf-content-text-color);
610
610
  --color-sf-msg-danger-bg-color: #3b0509;
611
611
  --color-sf-msg-danger-border-color: #c50f1f;
612
- --color-sf-msg-danger-color-alt1: var(--color-sf-danger);
612
+ --color-sf-msg-danger-color-alt1: #dc626d;
613
613
  --color-sf-msg-danger-bg-color-alt1: transparent;
614
- --color-sf-msg-danger-border-color-alt1: var(--color-sf-msg-danger-border-color);
614
+ --color-sf-msg-danger-border-color-alt1: #d33f4c;
615
615
  --color-sf-msg-danger-color-alt2: #fff;
616
616
  --color-sf-msg-danger-bg-color-alt2: #c50f1f;
617
617
  --color-sf-msg-danger-border-color-alt2: var(--color-sf-msg-danger-bg-color-alt2);
@@ -624,9 +624,9 @@
624
624
  --color-sf-msg-info-color: var(--color-sf-content-text-color);
625
625
  --color-sf-msg-info-bg-color: #002e38;
626
626
  --color-sf-msg-info-border-color: #0099bc;
627
- --color-sf-msg-info-color-alt1: var(--color-sf-info);
627
+ --color-sf-msg-info-color-alt1: #56bfd7;
628
628
  --color-sf-msg-info-bg-color-alt1: transparent;
629
- --color-sf-msg-info-border-color-alt1: var(--color-sf-msg-info-border-color);
629
+ --color-sf-msg-info-border-color-alt1: #31afdd;
630
630
  --color-sf-msg-info-color-alt2: #fff;
631
631
  --color-sf-msg-info-bg-color-alt2: #0099bc;
632
632
  --color-sf-msg-info-border-color-alt2: var(--color-sf-msg-info-bg-color-alt2);
@@ -639,9 +639,9 @@
639
639
  --color-sf-msg-warning-color: var(--color-sf-content-text-color);
640
640
  --color-sf-msg-warning-bg-color: #411200;
641
641
  --color-sf-msg-warning-border-color: #da3b01;
642
- --color-sf-msg-warning-color-alt1: var(--color-sf-warning);
642
+ --color-sf-msg-warning-color-alt1: #e9835e;
643
643
  --color-sf-msg-warning-bg-color-alt1: transparent;
644
- --color-sf-msg-warning-border-color-alt1: var(--color-sf-msg-warning-border-color);
644
+ --color-sf-msg-warning-border-color-alt1: #e36537;
645
645
  --color-sf-msg-warning-color-alt2: #fff;
646
646
  --color-sf-msg-warning-bg-color-alt2: #da3b01;
647
647
  --color-sf-msg-warning-border-color-alt2: var(--color-sf-msg-warning-bg-color-alt2);
@@ -659,7 +659,7 @@
659
659
  --color-sf-link-button-focus: #115ea3;
660
660
  --color-sf-link-button-border-focus: #fff;
661
661
  --color-sf-chip-bg-color: #141414;
662
- --color-sf-chip-border-color: rgba(0, 0, 0, 0);
662
+ --color-sf-chip-border-color: #141414;
663
663
  --color-sf-chip-bg-disabled: #141414;
664
664
  --color-sf-chip-border-disabled: rgba(0, 0, 0, 0);
665
665
  --color-sf-secondary-outline-button-text-color-hover: #fff;
@@ -714,7 +714,7 @@
714
714
  --color-sf-overlay-bg-color: rgba($black, .4);
715
715
  --color-sf-table-bg-color-hover: var(--color-sf-black);
716
716
  --color-sf-table-bg-color-pressed: var(--color-sf-black);
717
- --color-sf-table-bg-color-selected: var(--color-sf-black);
717
+ --color-sf-table-bg-color-selected: #1a3bff;
718
718
  --color-sf-content-text-color: #fff;
719
719
  --color-sf-content-text-color-alt1: var(--color-sf-content-text-color);
720
720
  --color-sf-content-text-color-alt2: var(--color-sf-content-text-color);
@@ -724,7 +724,7 @@
724
724
  --color-sf-content-text-color-focus: var(--color-sf-content-text-color-hover);
725
725
  --color-sf-content-text-color-selected: var(--color-sf-content-text-color-hover);
726
726
  --color-sf-content-text-color-dragged: #000;
727
- --color-sf-content-text-color-disabled: var(--color-sf-content-bg-color-disabled);
727
+ --color-sf-content-text-color-disabled: #3ff23f;
728
728
  --color-sf-placeholder-text-color: var(--color-sf-content-text-color);
729
729
  --color-sf-flyout-text-color: var(--color-sf-content-text-color);
730
730
  --color-sf-flyout-text-color-hover: var(--color-sf-content-text-color-hover);
@@ -748,12 +748,12 @@
748
748
  --color-sf-border-focus: var(--color-sf-border-hover);
749
749
  --color-sf-border-selected: var(--color-sf-border-hover);
750
750
  --color-sf-border-dragged: var(--color-sf-border-light);
751
- --color-sf-border-disabled: #fff;
751
+ --color-sf-border-disabled: #3ff23f;
752
752
  --color-sf-border-warning: #f7630c;
753
753
  --color-sf-border-error: #c50f1f;
754
754
  --color-sf-border-success: #107c10;
755
755
  --color-sf-border-info: #0099bc;
756
- --color-sf-spreadsheet-gridline: var(--color-sf-border-light);
756
+ --color-sf-spreadsheet-gridline: #e6e6e6;
757
757
  --color-sf-flyout-border: var(--color-sf-border-light);
758
758
  --color-sf-primary: #1aebff;
759
759
  --color-sf-primary-text-color: #000;
@@ -911,7 +911,7 @@
911
911
  --color-sf-diagram-palette-background: #000;
912
912
  --color-sf-diagram-palette-hover-background: var(--color-sf-content-bg-color-hover);
913
913
  --color-sf-diagram-palette-selected-background: var(--color-sf-diagram-palette-hover-background);
914
- --color-sf-rating-selected-color: var(--color-sf-content-text-color);
914
+ --color-sf-rating-selected-color: #fff;
915
915
  --color-sf-rating-unrated-color: var(--color-sf-content-text-color);
916
916
  --color-sf-rating-selected-disabled-color: var(--color-sf-content-text-color-disabled);
917
917
  --color-sf-rating-unrated-disabled-color: var(--color-sf-content-text-color-disabled);
@@ -936,7 +936,7 @@
936
936
  --color-sf-msg-success-color: #107c10;
937
937
  --color-sf-msg-success-bg-color: #000;
938
938
  --color-sf-msg-success-border-color: var(--color-sf-msg-success-color);
939
- --color-sf-msg-success-color-alt1: var(--color-sf-success);
939
+ --color-sf-msg-success-color-alt1: #107c10;
940
940
  --color-sf-msg-success-bg-color-alt1: var(--color-sf-msg-success-bg-color);
941
941
  --color-sf-msg-success-border-color-alt1: #fff;
942
942
  --color-sf-msg-success-color-alt2: var(--color-sf-msg-success-bg-color);
@@ -951,7 +951,7 @@
951
951
  --color-sf-msg-danger-color: #c50f1f;
952
952
  --color-sf-msg-danger-bg-color: #000;
953
953
  --color-sf-msg-danger-border-color: var(--color-sf-msg-danger-color);
954
- --color-sf-msg-danger-color-alt1: var(--color-sf-danger);
954
+ --color-sf-msg-danger-color-alt1: #c50f1f;
955
955
  --color-sf-msg-danger-bg-color-alt1: var(--color-sf-msg-danger-bg-color);
956
956
  --color-sf-msg-danger-border-color-alt1: #fff;
957
957
  --color-sf-msg-danger-color-alt2: var(--color-sf-msg-danger-bg-color);
@@ -966,7 +966,7 @@
966
966
  --color-sf-msg-info-color: #0099bc;
967
967
  --color-sf-msg-info-bg-color: #000;
968
968
  --color-sf-msg-info-border-color: var(--color-sf-msg-info-color);
969
- --color-sf-msg-info-color-alt1: var(--color-sf-info);
969
+ --color-sf-msg-info-color-alt1: #0099bc;
970
970
  --color-sf-msg-info-bg-color-alt1: var(--color-sf-msg-info-bg-color);
971
971
  --color-sf-msg-info-border-color-alt1: #fff;
972
972
  --color-sf-msg-info-color-alt2: var(--color-sf-msg-info-bg-color);
@@ -981,7 +981,7 @@
981
981
  --color-sf-msg-warning-color: #f7630c;
982
982
  --color-sf-msg-warning-bg-color: #000;
983
983
  --color-sf-msg-warning-border-color: #da3b01;
984
- --color-sf-msg-warning-color-alt1: var(--color-sf-warning);
984
+ --color-sf-msg-warning-color-alt1: #f7630c;
985
985
  --color-sf-msg-warning-bg-color-alt1: var(--color-sf-msg-warning-bg-color);
986
986
  --color-sf-msg-warning-border-color-alt1: #fff;
987
987
  --color-sf-msg-warning-color-alt2: var(--color-sf-msg-warning-bg-color);
@@ -1022,7 +1022,7 @@
1022
1022
  --color-sf-secondary-badge-border-color: #fff;
1023
1023
  --color-sf-secondary-badge-bg-color: #000;
1024
1024
  --color-sf-secondary-badge-bg-color-focus: #fff;
1025
- --color-sf-skeleton-bg-color: #ffffff;
1025
+ --color-sf-skeleton-bg-color: #fff;
1026
1026
  --color-sf-tab-selected-bg-color-disabled: #000;
1027
1027
  --color-sf-tab-selected-text-color-disabled: #3ff23f;
1028
1028
  --color-sf-ribbon-border-color: #fff;
@@ -1055,8 +1055,8 @@
1055
1055
  }
1056
1056
  .e-dropdown-btn:focus-visible,
1057
1057
  .e-dropdown-btn.e-btn:focus-visible {
1058
- -webkit-box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px #fff;
1059
- box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px #fff;
1058
+ -webkit-box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px var(--color-sf-shadow-color1);
1059
+ box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px var(--color-sf-shadow-color1);
1060
1060
  }
1061
1061
  .e-dropdown-btn:active,
1062
1062
  .e-dropdown-btn.e-btn:active {
@@ -1280,8 +1280,8 @@
1280
1280
  }
1281
1281
  .e-dropdown-popup ul .e-item:focus-visible {
1282
1282
  background-color: var(--color-sf-flyout-bg-color-focus);
1283
- -webkit-box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px #fff;
1284
- box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px #fff;
1283
+ -webkit-box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px var(--color-sf-shadow-color1);
1284
+ box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px var(--color-sf-shadow-color1);
1285
1285
  }
1286
1286
  .e-dropdown-popup ul .e-separator {
1287
1287
  border-bottom-color: var(--color-sf-border-light);
@@ -1337,8 +1337,8 @@
1337
1337
  }
1338
1338
  .e-split-btn-wrapper .e-split-btn.e-btn:focus-visible {
1339
1339
  border-right-color: #000 !important; /* stylelint-disable-line declaration-no-important */
1340
- -webkit-box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px #fff;
1341
- box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px #fff;
1340
+ -webkit-box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px var(--color-sf-shadow-color1);
1341
+ box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px var(--color-sf-shadow-color1);
1342
1342
  }
1343
1343
  .e-split-btn-wrapper .e-split-btn:active {
1344
1344
  -webkit-box-shadow: none;
@@ -1390,8 +1390,8 @@
1390
1390
  }
1391
1391
  .e-split-btn-wrapper .e-dropdown-btn.e-btn:focus-visible {
1392
1392
  margin-left: 0 !important; /* stylelint-disable-line declaration-no-important */
1393
- -webkit-box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px #fff;
1394
- box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px #fff;
1393
+ -webkit-box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px var(--color-sf-shadow-color1);
1394
+ box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px var(--color-sf-shadow-color1);
1395
1395
  }
1396
1396
  .e-split-btn-wrapper .e-btn:focus {
1397
1397
  -webkit-box-shadow: none;
@@ -1897,8 +1897,8 @@
1897
1897
  .e-btn-group input:focus-visible + label.e-btn,
1898
1898
  .e-css.e-btn-group .e-btn:focus-visible,
1899
1899
  .e-css.e-btn-group input:focus-visible + label.e-btn {
1900
- -webkit-box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px #fff !important;
1901
- box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px #fff !important;
1900
+ -webkit-box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px var(--color-sf-shadow-color1) !important;
1901
+ box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px var(--color-sf-shadow-color1) !important;
1902
1902
  }
1903
1903
  .e-btn-group .e-btn:focus,
1904
1904
  .e-btn-group input:focus-visible + label.e-btn,
@@ -2113,7 +2113,7 @@
2113
2113
  .e-css.e-btn-group input:active + label.e-btn.e-warning,
2114
2114
  .e-css.e-btn-group input:checked + label.e-btn.e-warning {
2115
2115
  background: var(--color-sf-warning-bg-color-pressed);
2116
- border-color: var(--color-sf-warning-border-color-selected);
2116
+ border-color: var(--color-sf-warning-border-color-pressed);
2117
2117
  color: var(--color-sf-warning-text-pressed);
2118
2118
  -webkit-box-shadow: none;
2119
2119
  box-shadow: none;
@@ -2185,7 +2185,7 @@
2185
2185
  .e-css.e-btn-group input:active + label.e-btn.e-outline.e-warning,
2186
2186
  .e-css.e-btn-group input:checked + label.e-btn.e-outline.e-warning {
2187
2187
  background: var(--color-sf-warning-bg-color-pressed);
2188
- border-color: var(--color-sf-warning-border-color-selected);
2188
+ border-color: var(--color-sf-warning-border-color-pressed);
2189
2189
  -webkit-box-shadow: none;
2190
2190
  box-shadow: none;
2191
2191
  color: var(--color-sf-warning-text-pressed);
@@ -2509,10 +2509,6 @@
2509
2509
  transform: rotate(360deg);
2510
2510
  }
2511
2511
  }
2512
- .e-path-circle {
2513
- stroke: none;
2514
- }
2515
-
2516
2512
  .e-progress-btn {
2517
2513
  position: relative;
2518
2514
  }
package/styles/progress-button/_bds-definition.scss CHANGED
@@ -20,9 +20,4 @@ $progress-btn-flat-info-progress-color: rgba($info-text, 1) !default;
20
20
  $progress-btn-flat-warning-progress-color: rgba($warning-text, 1) !default;
21
21
  $progress-btn-flat-danger-progress-color: rgba($danger-text, 1) !default;
22
22
  $btn-flat-primary-path-arc: $white;
23
-
24
23
  $fade-out: none !default;
25
-
26
- .e-path-circle {
27
- stroke: $fade-out;
28
- }
package/styles/progress-button/_fluent2-definition.scss CHANGED
@@ -18,9 +18,4 @@ $progress-btn-flat-info-progress-color: rgba($info-text, 1) !default;
18
18
  $progress-btn-flat-warning-progress-color: rgba($warning-text, 1) !default;
19
19
  $progress-btn-flat-danger-progress-color: rgba($danger-text, 1) !default;
20
20
  $btn-flat-primary-path-arc: $white;
21
-
22
21
  $fade-out: none !default;
23
-
24
- .e-path-circle {
25
- stroke: $fade-out;
26
- }