@syncfusion/blazor-themes 26.2.5 → 26.2.7

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 (61) hide show
  1. package/SCSS-Themes/bds-dark.scss +18 -4
  2. package/SCSS-Themes/bds.scss +18 -4
  3. package/SCSS-Themes/bootstrap-dark.scss +18 -4
  4. package/SCSS-Themes/bootstrap.scss +18 -4
  5. package/SCSS-Themes/bootstrap4.scss +18 -4
  6. package/SCSS-Themes/bootstrap5-dark.scss +18 -4
  7. package/SCSS-Themes/bootstrap5.scss +18 -4
  8. package/SCSS-Themes/documenteditor/document-editor/bds-dark.scss +2 -1
  9. package/SCSS-Themes/documenteditor/document-editor/bds.scss +2 -1
  10. package/SCSS-Themes/documenteditor/document-editor/bootstrap-dark.scss +2 -1
  11. package/SCSS-Themes/documenteditor/document-editor/bootstrap.scss +2 -1
  12. package/SCSS-Themes/documenteditor/document-editor/bootstrap4.scss +2 -1
  13. package/SCSS-Themes/documenteditor/document-editor/bootstrap5-dark.scss +2 -1
  14. package/SCSS-Themes/documenteditor/document-editor/bootstrap5.scss +2 -1
  15. package/SCSS-Themes/documenteditor/document-editor/fabric-dark.scss +2 -1
  16. package/SCSS-Themes/documenteditor/document-editor/fabric.scss +2 -1
  17. package/SCSS-Themes/documenteditor/document-editor/fluent-dark.scss +2 -1
  18. package/SCSS-Themes/documenteditor/document-editor/fluent.scss +2 -1
  19. package/SCSS-Themes/documenteditor/document-editor/fluent2-dark.scss +4 -3
  20. package/SCSS-Themes/documenteditor/document-editor/fluent2.scss +4 -3
  21. package/SCSS-Themes/documenteditor/document-editor/highcontrast.scss +2 -1
  22. package/SCSS-Themes/documenteditor/document-editor/material-dark.scss +2 -1
  23. package/SCSS-Themes/documenteditor/document-editor/material.scss +2 -1
  24. package/SCSS-Themes/documenteditor/document-editor/material3-dark.scss +2 -1
  25. package/SCSS-Themes/documenteditor/document-editor/material3.scss +2 -1
  26. package/SCSS-Themes/documenteditor/document-editor/tailwind-dark.scss +2 -1
  27. package/SCSS-Themes/documenteditor/document-editor/tailwind.scss +2 -1
  28. package/SCSS-Themes/documenteditor/document-editor-container/bds-dark.scss +16 -3
  29. package/SCSS-Themes/documenteditor/document-editor-container/bds.scss +16 -3
  30. package/SCSS-Themes/documenteditor/document-editor-container/bootstrap-dark.scss +16 -3
  31. package/SCSS-Themes/documenteditor/document-editor-container/bootstrap.scss +16 -3
  32. package/SCSS-Themes/documenteditor/document-editor-container/bootstrap4.scss +16 -3
  33. package/SCSS-Themes/documenteditor/document-editor-container/bootstrap5-dark.scss +16 -3
  34. package/SCSS-Themes/documenteditor/document-editor-container/bootstrap5.scss +16 -3
  35. package/SCSS-Themes/documenteditor/document-editor-container/fabric-dark.scss +16 -3
  36. package/SCSS-Themes/documenteditor/document-editor-container/fabric.scss +16 -3
  37. package/SCSS-Themes/documenteditor/document-editor-container/fluent-dark.scss +16 -3
  38. package/SCSS-Themes/documenteditor/document-editor-container/fluent.scss +16 -3
  39. package/SCSS-Themes/documenteditor/document-editor-container/fluent2-dark.scss +16 -3
  40. package/SCSS-Themes/documenteditor/document-editor-container/fluent2.scss +16 -3
  41. package/SCSS-Themes/documenteditor/document-editor-container/highcontrast.scss +16 -3
  42. package/SCSS-Themes/documenteditor/document-editor-container/material-dark.scss +16 -3
  43. package/SCSS-Themes/documenteditor/document-editor-container/material.scss +16 -3
  44. package/SCSS-Themes/documenteditor/document-editor-container/material3-dark.scss +16 -3
  45. package/SCSS-Themes/documenteditor/document-editor-container/material3.scss +16 -3
  46. package/SCSS-Themes/documenteditor/document-editor-container/tailwind-dark.scss +16 -3
  47. package/SCSS-Themes/documenteditor/document-editor-container/tailwind.scss +16 -3
  48. package/SCSS-Themes/fabric-dark.scss +18 -4
  49. package/SCSS-Themes/fabric.scss +18 -4
  50. package/SCSS-Themes/fluent-dark.scss +18 -4
  51. package/SCSS-Themes/fluent.scss +18 -4
  52. package/SCSS-Themes/fluent2-dark.scss +20 -6
  53. package/SCSS-Themes/fluent2.scss +20 -6
  54. package/SCSS-Themes/highcontrast.scss +18 -4
  55. package/SCSS-Themes/material-dark.scss +18 -4
  56. package/SCSS-Themes/material.scss +18 -4
  57. package/SCSS-Themes/material3-dark.scss +18 -4
  58. package/SCSS-Themes/material3.scss +18 -4
  59. package/SCSS-Themes/tailwind-dark.scss +18 -4
  60. package/SCSS-Themes/tailwind.scss +18 -4
  61. package/package.json +1 -1
package/SCSS-Themes/highcontrast.scss CHANGED
@@ -67351,7 +67351,8 @@ $de-column-presets-font-size: 60px !default;
67351
67351
  .e-de-style-paragraph-group-button .e-btn.e-active,
67352
67352
  .e-de-style-font-group-button .e-btn.e-active {
67353
67353
  @if $skin-name =='fluent2' {
67354
- background-color: var(--color-sf-secondary-bg-color);
67354
+ background-color: var(--color-sf-content-bg-color-pressed);
67355
+ color: var(--color-sf-toolbar-icon-color);
67355
67356
  }
67356
67357
  }
67357
67358
  .e-de-hyperlink-bookmark-check .e-checkbox-wrapper .e-frame {
@@ -69764,13 +69765,13 @@ $de-prop-btn-icon-clr: #ccc;
69764
69765
  }
69765
69766
  .e-btn-toggle {
69766
69767
  @if $skin-name=='fluent2' {
69767
- background-color: var(--color-sf-secondary-bg-color);
69768
+ background-color: var(--color-sf-content-bg-color-pressed) !important;
69768
69769
  }
69769
69770
  @else{
69770
69771
  background-color: $de-toggle-bg-color !important;
69771
69772
  }
69772
69773
  @if $skin-name =='fluent2' {
69773
- background-color: $de-items-pressed;
69774
+ color: var(--color-sf-toolbar-icon-color) !important;
69774
69775
  }
69775
69776
  @if $skin-name=='highcontrast' {
69776
69777
  color: $de-title-bar-font-clr !important;
@@ -69782,7 +69783,12 @@ $de-prop-btn-icon-clr: #ccc;
69782
69783
  outline-offset: 0;
69783
69784
  box-shadow: $de-toggle-btn-border !important;
69784
69785
  #{if(&, '&', '*')}:hover {
69785
- background-color: $de-toggle-bg-color !important;
69786
+ @if $skin-name=='fluent2' {
69787
+ background-color: var(--color-sf-content-bg-color-pressed) !important;
69788
+ }
69789
+ @else {
69790
+ background-color: $de-toggle-bg-color !important;
69791
+ }
69786
69792
  @if $skin-name=='fabric' {
69787
69793
  border-color: $de-toggle-bg-color !important;
69788
69794
  }
@@ -69799,6 +69805,14 @@ $de-prop-btn-icon-clr: #ccc;
69799
69805
  color: $de-title-bar-font-clr !important;
69800
69806
  }
69801
69807
  }
69808
+ @if $skin-name=='fluent2' {
69809
+ .e-btn-toggle .e-tbar-btn-text {
69810
+ color: var(--color-sf-toolbar-icon-color) !important;
69811
+ }
69812
+ .e-btn-toggle>span {
69813
+ color: var(--color-sf-toolbar-icon-color) !important;
69814
+ }
69815
+ }
69802
69816
  @if $skin-name=='bootstrap' or $skin-name=='bootstrap4' or $skin-name=='tailwind' or or $skin-name=='bootstrap5' or $skin-name =='FluentUI' {
69803
69817
  .e-de-ctnr-group-btn-top>button:first-child {
69804
69818
  border-radius: 0;
package/SCSS-Themes/material-dark.scss CHANGED
@@ -68621,7 +68621,8 @@ $de-column-presets-font-size: 60px !default;
68621
68621
  .e-de-style-paragraph-group-button .e-btn.e-active,
68622
68622
  .e-de-style-font-group-button .e-btn.e-active {
68623
68623
  @if $skin-name =='fluent2' {
68624
- background-color: var(--color-sf-secondary-bg-color);
68624
+ background-color: var(--color-sf-content-bg-color-pressed);
68625
+ color: var(--color-sf-toolbar-icon-color);
68625
68626
  }
68626
68627
  }
68627
68628
  .e-de-hyperlink-bookmark-check .e-checkbox-wrapper .e-frame {
@@ -71028,13 +71029,13 @@ $de-prop-btn-icon-clr: #ccc;
71028
71029
  }
71029
71030
  .e-btn-toggle {
71030
71031
  @if $skin-name=='fluent2' {
71031
- background-color: var(--color-sf-secondary-bg-color);
71032
+ background-color: var(--color-sf-content-bg-color-pressed) !important;
71032
71033
  }
71033
71034
  @else{
71034
71035
  background-color: $de-toggle-bg-color !important;
71035
71036
  }
71036
71037
  @if $skin-name =='fluent2' {
71037
- background-color: $de-items-pressed;
71038
+ color: var(--color-sf-toolbar-icon-color) !important;
71038
71039
  }
71039
71040
  @if $skin-name=='highcontrast' {
71040
71041
  color: $de-title-bar-font-clr !important;
@@ -71046,7 +71047,12 @@ $de-prop-btn-icon-clr: #ccc;
71046
71047
  outline-offset: 0;
71047
71048
  box-shadow: $de-toggle-btn-border !important;
71048
71049
  #{if(&, '&', '*')}:hover {
71049
- background-color: $de-toggle-bg-color !important;
71050
+ @if $skin-name=='fluent2' {
71051
+ background-color: var(--color-sf-content-bg-color-pressed) !important;
71052
+ }
71053
+ @else {
71054
+ background-color: $de-toggle-bg-color !important;
71055
+ }
71050
71056
  @if $skin-name=='fabric' {
71051
71057
  border-color: $de-toggle-bg-color !important;
71052
71058
  }
@@ -71063,6 +71069,14 @@ $de-prop-btn-icon-clr: #ccc;
71063
71069
  color: $de-title-bar-font-clr !important;
71064
71070
  }
71065
71071
  }
71072
+ @if $skin-name=='fluent2' {
71073
+ .e-btn-toggle .e-tbar-btn-text {
71074
+ color: var(--color-sf-toolbar-icon-color) !important;
71075
+ }
71076
+ .e-btn-toggle>span {
71077
+ color: var(--color-sf-toolbar-icon-color) !important;
71078
+ }
71079
+ }
71066
71080
  @if $skin-name=='bootstrap' or $skin-name=='bootstrap4' or $skin-name=='tailwind' or or $skin-name=='bootstrap5' or $skin-name =='FluentUI' {
71067
71081
  .e-de-ctnr-group-btn-top>button:first-child {
71068
71082
  border-radius: 0;
package/SCSS-Themes/material.scss CHANGED
@@ -68375,7 +68375,8 @@ $de-column-presets-font-size: 60px !default;
68375
68375
  .e-de-style-paragraph-group-button .e-btn.e-active,
68376
68376
  .e-de-style-font-group-button .e-btn.e-active {
68377
68377
  @if $skin-name =='fluent2' {
68378
- background-color: var(--color-sf-secondary-bg-color);
68378
+ background-color: var(--color-sf-content-bg-color-pressed);
68379
+ color: var(--color-sf-toolbar-icon-color);
68379
68380
  }
68380
68381
  }
68381
68382
  .e-de-hyperlink-bookmark-check .e-checkbox-wrapper .e-frame {
@@ -70781,13 +70782,13 @@ $de-prop-btn-icon-clr: #ccc;
70781
70782
  }
70782
70783
  .e-btn-toggle {
70783
70784
  @if $skin-name=='fluent2' {
70784
- background-color: var(--color-sf-secondary-bg-color);
70785
+ background-color: var(--color-sf-content-bg-color-pressed) !important;
70785
70786
  }
70786
70787
  @else{
70787
70788
  background-color: $de-toggle-bg-color !important;
70788
70789
  }
70789
70790
  @if $skin-name =='fluent2' {
70790
- background-color: $de-items-pressed;
70791
+ color: var(--color-sf-toolbar-icon-color) !important;
70791
70792
  }
70792
70793
  @if $skin-name=='highcontrast' {
70793
70794
  color: $de-title-bar-font-clr !important;
@@ -70799,7 +70800,12 @@ $de-prop-btn-icon-clr: #ccc;
70799
70800
  outline-offset: 0;
70800
70801
  box-shadow: $de-toggle-btn-border !important;
70801
70802
  #{if(&, '&', '*')}:hover {
70802
- background-color: $de-toggle-bg-color !important;
70803
+ @if $skin-name=='fluent2' {
70804
+ background-color: var(--color-sf-content-bg-color-pressed) !important;
70805
+ }
70806
+ @else {
70807
+ background-color: $de-toggle-bg-color !important;
70808
+ }
70803
70809
  @if $skin-name=='fabric' {
70804
70810
  border-color: $de-toggle-bg-color !important;
70805
70811
  }
@@ -70816,6 +70822,14 @@ $de-prop-btn-icon-clr: #ccc;
70816
70822
  color: $de-title-bar-font-clr !important;
70817
70823
  }
70818
70824
  }
70825
+ @if $skin-name=='fluent2' {
70826
+ .e-btn-toggle .e-tbar-btn-text {
70827
+ color: var(--color-sf-toolbar-icon-color) !important;
70828
+ }
70829
+ .e-btn-toggle>span {
70830
+ color: var(--color-sf-toolbar-icon-color) !important;
70831
+ }
70832
+ }
70819
70833
  @if $skin-name=='bootstrap' or $skin-name=='bootstrap4' or $skin-name=='tailwind' or or $skin-name=='bootstrap5' or $skin-name =='FluentUI' {
70820
70834
  .e-de-ctnr-group-btn-top>button:first-child {
70821
70835
  border-radius: 0;
package/SCSS-Themes/material3-dark.scss CHANGED
@@ -68345,7 +68345,8 @@ $de-column-presets-font-size: 60px !default;
68345
68345
  .e-de-style-paragraph-group-button .e-btn.e-active,
68346
68346
  .e-de-style-font-group-button .e-btn.e-active {
68347
68347
  @if $skin-name =='fluent2' {
68348
- background-color: var(--color-sf-secondary-bg-color);
68348
+ background-color: var(--color-sf-content-bg-color-pressed);
68349
+ color: var(--color-sf-toolbar-icon-color);
68349
68350
  }
68350
68351
  }
68351
68352
  .e-de-hyperlink-bookmark-check .e-checkbox-wrapper .e-frame {
@@ -70819,13 +70820,13 @@ $de-hover-bg: $content-bg-color-alt2 !default;
70819
70820
  }
70820
70821
  .e-btn-toggle {
70821
70822
  @if $skin-name=='fluent2' {
70822
- background-color: var(--color-sf-secondary-bg-color);
70823
+ background-color: var(--color-sf-content-bg-color-pressed) !important;
70823
70824
  }
70824
70825
  @else{
70825
70826
  background-color: $de-toggle-bg-color !important;
70826
70827
  }
70827
70828
  @if $skin-name =='fluent2' {
70828
- background-color: $de-items-pressed;
70829
+ color: var(--color-sf-toolbar-icon-color) !important;
70829
70830
  }
70830
70831
  @if $skin-name=='highcontrast' {
70831
70832
  color: $de-title-bar-font-clr !important;
@@ -70837,7 +70838,12 @@ $de-hover-bg: $content-bg-color-alt2 !default;
70837
70838
  outline-offset: 0;
70838
70839
  box-shadow: $de-toggle-btn-border !important;
70839
70840
  #{if(&, '&', '*')}:hover {
70840
- background-color: $de-toggle-bg-color !important;
70841
+ @if $skin-name=='fluent2' {
70842
+ background-color: var(--color-sf-content-bg-color-pressed) !important;
70843
+ }
70844
+ @else {
70845
+ background-color: $de-toggle-bg-color !important;
70846
+ }
70841
70847
  @if $skin-name=='fabric' {
70842
70848
  border-color: $de-toggle-bg-color !important;
70843
70849
  }
@@ -70854,6 +70860,14 @@ $de-hover-bg: $content-bg-color-alt2 !default;
70854
70860
  color: $de-title-bar-font-clr !important;
70855
70861
  }
70856
70862
  }
70863
+ @if $skin-name=='fluent2' {
70864
+ .e-btn-toggle .e-tbar-btn-text {
70865
+ color: var(--color-sf-toolbar-icon-color) !important;
70866
+ }
70867
+ .e-btn-toggle>span {
70868
+ color: var(--color-sf-toolbar-icon-color) !important;
70869
+ }
70870
+ }
70857
70871
  @if $skin-name=='bootstrap' or $skin-name=='bootstrap4' or $skin-name=='tailwind' or or $skin-name=='bootstrap5' or $skin-name =='FluentUI' {
70858
70872
  .e-de-ctnr-group-btn-top>button:first-child {
70859
70873
  border-radius: 0;
package/SCSS-Themes/material3.scss CHANGED
@@ -68415,7 +68415,8 @@ $de-column-presets-font-size: 60px !default;
68415
68415
  .e-de-style-paragraph-group-button .e-btn.e-active,
68416
68416
  .e-de-style-font-group-button .e-btn.e-active {
68417
68417
  @if $skin-name =='fluent2' {
68418
- background-color: var(--color-sf-secondary-bg-color);
68418
+ background-color: var(--color-sf-content-bg-color-pressed);
68419
+ color: var(--color-sf-toolbar-icon-color);
68419
68420
  }
68420
68421
  }
68421
68422
  .e-de-hyperlink-bookmark-check .e-checkbox-wrapper .e-frame {
@@ -70889,13 +70890,13 @@ $de-hover-bg: $content-bg-color-alt2 !default;
70889
70890
  }
70890
70891
  .e-btn-toggle {
70891
70892
  @if $skin-name=='fluent2' {
70892
- background-color: var(--color-sf-secondary-bg-color);
70893
+ background-color: var(--color-sf-content-bg-color-pressed) !important;
70893
70894
  }
70894
70895
  @else{
70895
70896
  background-color: $de-toggle-bg-color !important;
70896
70897
  }
70897
70898
  @if $skin-name =='fluent2' {
70898
- background-color: $de-items-pressed;
70899
+ color: var(--color-sf-toolbar-icon-color) !important;
70899
70900
  }
70900
70901
  @if $skin-name=='highcontrast' {
70901
70902
  color: $de-title-bar-font-clr !important;
@@ -70907,7 +70908,12 @@ $de-hover-bg: $content-bg-color-alt2 !default;
70907
70908
  outline-offset: 0;
70908
70909
  box-shadow: $de-toggle-btn-border !important;
70909
70910
  #{if(&, '&', '*')}:hover {
70910
- background-color: $de-toggle-bg-color !important;
70911
+ @if $skin-name=='fluent2' {
70912
+ background-color: var(--color-sf-content-bg-color-pressed) !important;
70913
+ }
70914
+ @else {
70915
+ background-color: $de-toggle-bg-color !important;
70916
+ }
70911
70917
  @if $skin-name=='fabric' {
70912
70918
  border-color: $de-toggle-bg-color !important;
70913
70919
  }
@@ -70924,6 +70930,14 @@ $de-hover-bg: $content-bg-color-alt2 !default;
70924
70930
  color: $de-title-bar-font-clr !important;
70925
70931
  }
70926
70932
  }
70933
+ @if $skin-name=='fluent2' {
70934
+ .e-btn-toggle .e-tbar-btn-text {
70935
+ color: var(--color-sf-toolbar-icon-color) !important;
70936
+ }
70937
+ .e-btn-toggle>span {
70938
+ color: var(--color-sf-toolbar-icon-color) !important;
70939
+ }
70940
+ }
70927
70941
  @if $skin-name=='bootstrap' or $skin-name=='bootstrap4' or $skin-name=='tailwind' or or $skin-name=='bootstrap5' or $skin-name =='FluentUI' {
70928
70942
  .e-de-ctnr-group-btn-top>button:first-child {
70929
70943
  border-radius: 0;
package/SCSS-Themes/tailwind-dark.scss CHANGED
@@ -67498,7 +67498,8 @@ $de-column-presets-font-size: $text-6xl !default;
67498
67498
  .e-de-style-paragraph-group-button .e-btn.e-active,
67499
67499
  .e-de-style-font-group-button .e-btn.e-active {
67500
67500
  @if $skin-name =='fluent2' {
67501
- background-color: var(--color-sf-secondary-bg-color);
67501
+ background-color: var(--color-sf-content-bg-color-pressed);
67502
+ color: var(--color-sf-toolbar-icon-color);
67502
67503
  }
67503
67504
  }
67504
67505
  .e-de-hyperlink-bookmark-check .e-checkbox-wrapper .e-frame {
@@ -69965,13 +69966,13 @@ $de-hlt-clr-height-bigger: 24px;
69965
69966
  }
69966
69967
  .e-btn-toggle {
69967
69968
  @if $skin-name=='fluent2' {
69968
- background-color: var(--color-sf-secondary-bg-color);
69969
+ background-color: var(--color-sf-content-bg-color-pressed) !important;
69969
69970
  }
69970
69971
  @else{
69971
69972
  background-color: $de-toggle-bg-color !important;
69972
69973
  }
69973
69974
  @if $skin-name =='fluent2' {
69974
- background-color: $de-items-pressed;
69975
+ color: var(--color-sf-toolbar-icon-color) !important;
69975
69976
  }
69976
69977
  @if $skin-name=='highcontrast' {
69977
69978
  color: $de-title-bar-font-clr !important;
@@ -69983,7 +69984,12 @@ $de-hlt-clr-height-bigger: 24px;
69983
69984
  outline-offset: 0;
69984
69985
  box-shadow: $de-toggle-btn-border !important;
69985
69986
  #{if(&, '&', '*')}:hover {
69986
- background-color: $de-toggle-bg-color !important;
69987
+ @if $skin-name=='fluent2' {
69988
+ background-color: var(--color-sf-content-bg-color-pressed) !important;
69989
+ }
69990
+ @else {
69991
+ background-color: $de-toggle-bg-color !important;
69992
+ }
69987
69993
  @if $skin-name=='fabric' {
69988
69994
  border-color: $de-toggle-bg-color !important;
69989
69995
  }
@@ -70000,6 +70006,14 @@ $de-hlt-clr-height-bigger: 24px;
70000
70006
  color: $de-title-bar-font-clr !important;
70001
70007
  }
70002
70008
  }
70009
+ @if $skin-name=='fluent2' {
70010
+ .e-btn-toggle .e-tbar-btn-text {
70011
+ color: var(--color-sf-toolbar-icon-color) !important;
70012
+ }
70013
+ .e-btn-toggle>span {
70014
+ color: var(--color-sf-toolbar-icon-color) !important;
70015
+ }
70016
+ }
70003
70017
  @if $skin-name=='bootstrap' or $skin-name=='bootstrap4' or $skin-name=='tailwind' or or $skin-name=='bootstrap5' or $skin-name =='FluentUI' {
70004
70018
  .e-de-ctnr-group-btn-top>button:first-child {
70005
70019
  border-radius: 0;
package/SCSS-Themes/tailwind.scss CHANGED
@@ -67496,7 +67496,8 @@ $de-column-presets-font-size: $text-6xl !default;
67496
67496
  .e-de-style-paragraph-group-button .e-btn.e-active,
67497
67497
  .e-de-style-font-group-button .e-btn.e-active {
67498
67498
  @if $skin-name =='fluent2' {
67499
- background-color: var(--color-sf-secondary-bg-color);
67499
+ background-color: var(--color-sf-content-bg-color-pressed);
67500
+ color: var(--color-sf-toolbar-icon-color);
67500
67501
  }
67501
67502
  }
67502
67503
  .e-de-hyperlink-bookmark-check .e-checkbox-wrapper .e-frame {
@@ -69963,13 +69964,13 @@ $de-hlt-clr-height-bigger: 24px;
69963
69964
  }
69964
69965
  .e-btn-toggle {
69965
69966
  @if $skin-name=='fluent2' {
69966
- background-color: var(--color-sf-secondary-bg-color);
69967
+ background-color: var(--color-sf-content-bg-color-pressed) !important;
69967
69968
  }
69968
69969
  @else{
69969
69970
  background-color: $de-toggle-bg-color !important;
69970
69971
  }
69971
69972
  @if $skin-name =='fluent2' {
69972
- background-color: $de-items-pressed;
69973
+ color: var(--color-sf-toolbar-icon-color) !important;
69973
69974
  }
69974
69975
  @if $skin-name=='highcontrast' {
69975
69976
  color: $de-title-bar-font-clr !important;
@@ -69981,7 +69982,12 @@ $de-hlt-clr-height-bigger: 24px;
69981
69982
  outline-offset: 0;
69982
69983
  box-shadow: $de-toggle-btn-border !important;
69983
69984
  #{if(&, '&', '*')}:hover {
69984
- background-color: $de-toggle-bg-color !important;
69985
+ @if $skin-name=='fluent2' {
69986
+ background-color: var(--color-sf-content-bg-color-pressed) !important;
69987
+ }
69988
+ @else {
69989
+ background-color: $de-toggle-bg-color !important;
69990
+ }
69985
69991
  @if $skin-name=='fabric' {
69986
69992
  border-color: $de-toggle-bg-color !important;
69987
69993
  }
@@ -69998,6 +70004,14 @@ $de-hlt-clr-height-bigger: 24px;
69998
70004
  color: $de-title-bar-font-clr !important;
69999
70005
  }
70000
70006
  }
70007
+ @if $skin-name=='fluent2' {
70008
+ .e-btn-toggle .e-tbar-btn-text {
70009
+ color: var(--color-sf-toolbar-icon-color) !important;
70010
+ }
70011
+ .e-btn-toggle>span {
70012
+ color: var(--color-sf-toolbar-icon-color) !important;
70013
+ }
70014
+ }
70001
70015
  @if $skin-name=='bootstrap' or $skin-name=='bootstrap4' or $skin-name=='tailwind' or or $skin-name=='bootstrap5' or $skin-name =='FluentUI' {
70002
70016
  .e-de-ctnr-group-btn-top>button:first-child {
70003
70017
  border-radius: 0;
package/package.json CHANGED
@@ -1 +1 @@
1
- {"name":"@syncfusion/blazor-themes","version":"26.2.5","description":"This package contains the individual component wise SCSS files and single SCSS files for Syncfusion Blazor components.","author":"Syncfusion Inc.","license":"SEE LICENSE IN license","keywords":["Blazor","Blazor Themes","Syncfusion","Syncfusion Blazor","Web components","Themes","Individual Themes","Combined Themes","Syncfusion Blazor SCSS"],"repository":{"type":"git","url":"git@github.com/syncfusion/blazor-samples"}}
1
+ {"name":"@syncfusion/blazor-themes","version":"26.2.7","description":"This package contains the individual component wise SCSS files and single SCSS files for Syncfusion Blazor components.","author":"Syncfusion Inc.","license":"SEE LICENSE IN license","keywords":["Blazor","Blazor Themes","Syncfusion","Syncfusion Blazor","Web components","Themes","Individual Themes","Combined Themes","Syncfusion Blazor SCSS"],"repository":{"type":"git","url":"git@github.com/syncfusion/blazor-samples"}}