@syncfusion/blazor-themes 24.1.43 → 24.1.44
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/SCSS-Themes/bootstrap-dark.scss +89 -6
- package/SCSS-Themes/bootstrap.scss +89 -6
- package/SCSS-Themes/bootstrap4.scss +89 -6
- package/SCSS-Themes/bootstrap5-dark.scss +89 -6
- package/SCSS-Themes/bootstrap5.scss +89 -6
- package/SCSS-Themes/buttons/button/bootstrap-dark.scss +52 -0
- package/SCSS-Themes/buttons/button/bootstrap.scss +52 -0
- package/SCSS-Themes/buttons/button/bootstrap4.scss +52 -0
- package/SCSS-Themes/buttons/button/bootstrap5-dark.scss +52 -0
- package/SCSS-Themes/buttons/button/bootstrap5.scss +52 -0
- package/SCSS-Themes/buttons/button/fabric-dark.scss +52 -0
- package/SCSS-Themes/buttons/button/fabric.scss +52 -0
- package/SCSS-Themes/buttons/button/fluent-dark.scss +52 -0
- package/SCSS-Themes/buttons/button/fluent.scss +52 -0
- package/SCSS-Themes/buttons/button/highcontrast.scss +52 -0
- package/SCSS-Themes/buttons/button/material-dark.scss +52 -0
- package/SCSS-Themes/buttons/button/material.scss +52 -0
- package/SCSS-Themes/buttons/button/material3-dark.scss +52 -0
- package/SCSS-Themes/buttons/button/material3.scss +52 -0
- package/SCSS-Themes/buttons/button/tailwind-dark.scss +52 -0
- package/SCSS-Themes/buttons/button/tailwind.scss +52 -0
- package/SCSS-Themes/dropdowns/drop-down-tree/bootstrap-dark.scss +5 -0
- package/SCSS-Themes/dropdowns/drop-down-tree/bootstrap.scss +5 -0
- package/SCSS-Themes/dropdowns/drop-down-tree/bootstrap4.scss +5 -0
- package/SCSS-Themes/dropdowns/drop-down-tree/bootstrap5-dark.scss +5 -0
- package/SCSS-Themes/dropdowns/drop-down-tree/bootstrap5.scss +5 -0
- package/SCSS-Themes/dropdowns/drop-down-tree/fabric-dark.scss +5 -0
- package/SCSS-Themes/dropdowns/drop-down-tree/fabric.scss +5 -0
- package/SCSS-Themes/dropdowns/drop-down-tree/fluent-dark.scss +5 -0
- package/SCSS-Themes/dropdowns/drop-down-tree/fluent.scss +5 -0
- package/SCSS-Themes/dropdowns/drop-down-tree/highcontrast.scss +5 -0
- package/SCSS-Themes/dropdowns/drop-down-tree/material-dark.scss +5 -0
- package/SCSS-Themes/dropdowns/drop-down-tree/material.scss +5 -0
- package/SCSS-Themes/dropdowns/drop-down-tree/material3-dark.scss +5 -0
- package/SCSS-Themes/dropdowns/drop-down-tree/material3.scss +5 -0
- package/SCSS-Themes/dropdowns/drop-down-tree/tailwind-dark.scss +5 -0
- package/SCSS-Themes/dropdowns/drop-down-tree/tailwind.scss +5 -0
- package/SCSS-Themes/fabric-dark.scss +89 -6
- package/SCSS-Themes/fabric.scss +89 -6
- package/SCSS-Themes/fluent-dark.scss +90 -7
- package/SCSS-Themes/fluent.scss +90 -7
- package/SCSS-Themes/grids/grid/bootstrap-dark.scss +9 -0
- package/SCSS-Themes/grids/grid/bootstrap.scss +9 -0
- package/SCSS-Themes/grids/grid/bootstrap4.scss +9 -0
- package/SCSS-Themes/grids/grid/bootstrap5-dark.scss +9 -0
- package/SCSS-Themes/grids/grid/bootstrap5.scss +9 -0
- package/SCSS-Themes/grids/grid/fabric-dark.scss +9 -0
- package/SCSS-Themes/grids/grid/fabric.scss +9 -0
- package/SCSS-Themes/grids/grid/fluent-dark.scss +9 -0
- package/SCSS-Themes/grids/grid/fluent.scss +9 -0
- package/SCSS-Themes/grids/grid/highcontrast.scss +9 -0
- package/SCSS-Themes/grids/grid/material-dark.scss +10 -1
- package/SCSS-Themes/grids/grid/material.scss +9 -0
- package/SCSS-Themes/grids/grid/material3-dark.scss +9 -0
- package/SCSS-Themes/grids/grid/material3.scss +9 -0
- package/SCSS-Themes/grids/grid/tailwind-dark.scss +9 -0
- package/SCSS-Themes/grids/grid/tailwind.scss +9 -0
- package/SCSS-Themes/highcontrast.scss +89 -6
- package/SCSS-Themes/image-editor/image-editor/bootstrap-dark.scss +9 -6
- package/SCSS-Themes/image-editor/image-editor/bootstrap.scss +9 -6
- package/SCSS-Themes/image-editor/image-editor/bootstrap4.scss +9 -6
- package/SCSS-Themes/image-editor/image-editor/bootstrap5-dark.scss +9 -6
- package/SCSS-Themes/image-editor/image-editor/bootstrap5.scss +9 -6
- package/SCSS-Themes/image-editor/image-editor/fabric-dark.scss +9 -6
- package/SCSS-Themes/image-editor/image-editor/fabric.scss +9 -6
- package/SCSS-Themes/image-editor/image-editor/fluent-dark.scss +9 -6
- package/SCSS-Themes/image-editor/image-editor/fluent.scss +9 -6
- package/SCSS-Themes/image-editor/image-editor/highcontrast.scss +9 -6
- package/SCSS-Themes/image-editor/image-editor/material-dark.scss +9 -6
- package/SCSS-Themes/image-editor/image-editor/material.scss +9 -6
- package/SCSS-Themes/image-editor/image-editor/material3-dark.scss +9 -6
- package/SCSS-Themes/image-editor/image-editor/material3.scss +9 -6
- package/SCSS-Themes/image-editor/image-editor/tailwind-dark.scss +9 -6
- package/SCSS-Themes/image-editor/image-editor/tailwind.scss +9 -6
- package/SCSS-Themes/inputs/data-form/material3-dark.scss +1 -1
- package/SCSS-Themes/inputs/data-form/material3.scss +1 -1
- package/SCSS-Themes/material-dark.scss +90 -7
- package/SCSS-Themes/material.scss +89 -6
- package/SCSS-Themes/material3-dark.scss +90 -7
- package/SCSS-Themes/material3.scss +90 -7
- package/SCSS-Themes/pdfviewer/pdfviewer/fluent-dark.scss +1 -1
- package/SCSS-Themes/pdfviewer/pdfviewer/fluent.scss +1 -1
- package/SCSS-Themes/splitbuttons/progress-button/bootstrap-dark.scss +14 -0
- package/SCSS-Themes/splitbuttons/progress-button/bootstrap.scss +14 -0
- package/SCSS-Themes/splitbuttons/progress-button/bootstrap4.scss +14 -0
- package/SCSS-Themes/splitbuttons/progress-button/bootstrap5-dark.scss +14 -0
- package/SCSS-Themes/splitbuttons/progress-button/bootstrap5.scss +14 -0
- package/SCSS-Themes/splitbuttons/progress-button/fabric-dark.scss +14 -0
- package/SCSS-Themes/splitbuttons/progress-button/fabric.scss +14 -0
- package/SCSS-Themes/splitbuttons/progress-button/fluent-dark.scss +14 -0
- package/SCSS-Themes/splitbuttons/progress-button/fluent.scss +14 -0
- package/SCSS-Themes/splitbuttons/progress-button/highcontrast.scss +14 -0
- package/SCSS-Themes/splitbuttons/progress-button/material-dark.scss +14 -0
- package/SCSS-Themes/splitbuttons/progress-button/material.scss +14 -0
- package/SCSS-Themes/splitbuttons/progress-button/material3-dark.scss +14 -0
- package/SCSS-Themes/splitbuttons/progress-button/material3.scss +14 -0
- package/SCSS-Themes/splitbuttons/progress-button/tailwind-dark.scss +14 -0
- package/SCSS-Themes/splitbuttons/progress-button/tailwind.scss +14 -0
- package/SCSS-Themes/tailwind-dark.scss +89 -6
- package/SCSS-Themes/tailwind.scss +89 -6
- package/package.json +1 -1
|
@@ -24911,12 +24911,22 @@ $btn-keyboard-focus-box-shadow: $shadow-focus-ring1 !default;
|
|
|
24911
24911
|
@if $skin-name == 'FluentUI' {
|
|
24912
24912
|
outline: none !important; /* stylelint-disable-line declaration-no-important */
|
|
24913
24913
|
}
|
|
24914
|
+
|
|
24915
|
+
@if $skin-name == 'bootstrap5' {
|
|
24916
|
+
background: $btn-outline-active-bgcolor;
|
|
24917
|
+
color: $btn-outline-active-color;
|
|
24918
|
+
}
|
|
24914
24919
|
}
|
|
24915
24920
|
|
|
24916
24921
|
&:focus-visible { // only for keybord
|
|
24917
24922
|
@if $skin-name == 'FluentUI' {
|
|
24918
24923
|
background: $btn-outline-bgcolor;
|
|
24919
24924
|
}
|
|
24925
|
+
|
|
24926
|
+
@if $skin-name == 'bootstrap5' {
|
|
24927
|
+
box-shadow: $btn-focus-box-shadow;
|
|
24928
|
+
}
|
|
24929
|
+
|
|
24920
24930
|
@if $skin-name == 'Material3' {
|
|
24921
24931
|
background: $btn-active-bgcolor;
|
|
24922
24932
|
box-shadow: $btn-keyboard-focus-box-shadow;
|
|
@@ -24967,12 +24977,22 @@ $btn-keyboard-focus-box-shadow: $shadow-focus-ring1 !default;
|
|
|
24967
24977
|
@if $skin-name == 'FluentUI' {
|
|
24968
24978
|
outline: none !important; /* stylelint-disable-line declaration-no-important */
|
|
24969
24979
|
}
|
|
24980
|
+
|
|
24981
|
+
@if $skin-name == 'bootstrap5' {
|
|
24982
|
+
background: $btn-outline-primary-focus-bgcolor;
|
|
24983
|
+
color: $btn-outline-active-color;
|
|
24984
|
+
}
|
|
24970
24985
|
}
|
|
24971
24986
|
|
|
24972
24987
|
&:focus-visible { // only for keybord
|
|
24973
24988
|
@if $skin-name == 'FluentUI' {
|
|
24974
24989
|
background: $btn-outline-bgcolor;
|
|
24975
24990
|
}
|
|
24991
|
+
|
|
24992
|
+
@if $skin-name == 'bootstrap5' {
|
|
24993
|
+
box-shadow: $btn-primary-focus-box-shadow;
|
|
24994
|
+
}
|
|
24995
|
+
|
|
24976
24996
|
@if $skin-name == 'Material3' {
|
|
24977
24997
|
background: $btn-primary-active-bgcolor;
|
|
24978
24998
|
box-shadow: $btn-keyboard-focus-box-shadow;
|
|
@@ -25030,12 +25050,20 @@ $btn-keyboard-focus-box-shadow: $shadow-focus-ring1 !default;
|
|
|
25030
25050
|
@if $skin-name == 'FluentUI' {
|
|
25031
25051
|
outline: none !important; /* stylelint-disable-line declaration-no-important */
|
|
25032
25052
|
}
|
|
25053
|
+
|
|
25054
|
+
@if $skin-name == 'bootstrap5' {
|
|
25055
|
+
background: $btn-success-bgcolor;
|
|
25056
|
+
color: $btn-success-color;
|
|
25057
|
+
}
|
|
25033
25058
|
}
|
|
25034
25059
|
|
|
25035
25060
|
&:focus-visible { // only for keybord
|
|
25036
25061
|
@if $skin-name == 'FluentUI' {
|
|
25037
25062
|
background: $btn-outline-bgcolor;
|
|
25038
25063
|
}
|
|
25064
|
+
@if $skin-name == 'bootstrap5' {
|
|
25065
|
+
box-shadow: $btn-success-focus-box-shadow;
|
|
25066
|
+
}
|
|
25039
25067
|
@if $skin-name == 'Material3' {
|
|
25040
25068
|
background: $btn-success-active-bgcolor;
|
|
25041
25069
|
box-shadow: $btn-keyboard-focus-box-shadow;
|
|
@@ -25093,12 +25121,20 @@ $btn-keyboard-focus-box-shadow: $shadow-focus-ring1 !default;
|
|
|
25093
25121
|
@if $skin-name == 'FluentUI' {
|
|
25094
25122
|
outline: none !important; /* stylelint-disable-line declaration-no-important */
|
|
25095
25123
|
}
|
|
25124
|
+
|
|
25125
|
+
@if $skin-name == 'bootstrap5' {
|
|
25126
|
+
background: $btn-info-bgcolor;
|
|
25127
|
+
color: $btn-info-color;
|
|
25128
|
+
}
|
|
25096
25129
|
}
|
|
25097
25130
|
|
|
25098
25131
|
&:focus-visible { // only for keybord
|
|
25099
25132
|
@if $skin-name == 'FluentUI' {
|
|
25100
25133
|
background: $btn-outline-bgcolor;
|
|
25101
25134
|
}
|
|
25135
|
+
@if $skin-name == 'bootstrap5' {
|
|
25136
|
+
box-shadow: $btn-info-focus-box-shadow;
|
|
25137
|
+
}
|
|
25102
25138
|
@if $skin-name == 'Material3' {
|
|
25103
25139
|
background: $btn-info-active-bgcolor;
|
|
25104
25140
|
box-shadow: $btn-keyboard-focus-box-shadow;
|
|
@@ -25156,12 +25192,20 @@ $btn-keyboard-focus-box-shadow: $shadow-focus-ring1 !default;
|
|
|
25156
25192
|
@if $skin-name == 'FluentUI' {
|
|
25157
25193
|
outline: none !important; /* stylelint-disable-line declaration-no-important */
|
|
25158
25194
|
}
|
|
25195
|
+
|
|
25196
|
+
@if $skin-name == 'bootstrap5' {
|
|
25197
|
+
background: $btn-warning-bgcolor;
|
|
25198
|
+
color: $btn-warning-color;
|
|
25199
|
+
}
|
|
25159
25200
|
}
|
|
25160
25201
|
|
|
25161
25202
|
&:focus-visible { // only for keybord
|
|
25162
25203
|
@if $skin-name == 'FluentUI' {
|
|
25163
25204
|
background: $btn-outline-bgcolor;
|
|
25164
25205
|
}
|
|
25206
|
+
@if $skin-name == 'bootstrap5' {
|
|
25207
|
+
box-shadow: $btn-warning-focus-box-shadow;
|
|
25208
|
+
}
|
|
25165
25209
|
@if $skin-name == 'Material3' {
|
|
25166
25210
|
background: $btn-warning-active-bgcolor;
|
|
25167
25211
|
box-shadow: $btn-keyboard-focus-box-shadow;
|
|
@@ -25219,12 +25263,20 @@ $btn-keyboard-focus-box-shadow: $shadow-focus-ring1 !default;
|
|
|
25219
25263
|
@if $skin-name == 'FluentUI' {
|
|
25220
25264
|
outline: none !important; /* stylelint-disable-line declaration-no-important */
|
|
25221
25265
|
}
|
|
25266
|
+
|
|
25267
|
+
@if $skin-name == 'bootstrap5' {
|
|
25268
|
+
background: $btn-danger-bgcolor;
|
|
25269
|
+
color: $btn-danger-color;
|
|
25270
|
+
}
|
|
25222
25271
|
}
|
|
25223
25272
|
|
|
25224
25273
|
&:focus-visible { // only for keybord
|
|
25225
25274
|
@if $skin-name == 'FluentUI' {
|
|
25226
25275
|
background: $btn-outline-bgcolor;
|
|
25227
25276
|
}
|
|
25277
|
+
@if $skin-name == 'bootstrap5' {
|
|
25278
|
+
box-shadow: $btn-danger-focus-box-shadow;
|
|
25279
|
+
}
|
|
25228
25280
|
@if $skin-name == 'Material3' {
|
|
25229
25281
|
background: $btn-danger-active-bgcolor;
|
|
25230
25282
|
box-shadow: $btn-keyboard-focus-box-shadow;
|
|
@@ -59626,6 +59678,11 @@ $ddt-readonly-input-bg-color: rgba($content-bg-color) !default;
|
|
|
59626
59678
|
}
|
|
59627
59679
|
}
|
|
59628
59680
|
|
|
59681
|
+
&.e-input-group.e-control-wrapper.e-valid-input:hover:not(.e-disabled) .e-clear-icon,
|
|
59682
|
+
&.e-float-input.e-control-wrapper.e-valid-input:hover:not(.e-disabled) .e-clear-icon {
|
|
59683
|
+
display: flex;
|
|
59684
|
+
}
|
|
59685
|
+
|
|
59629
59686
|
.e-chips-wrapper {
|
|
59630
59687
|
width: 100%;
|
|
59631
59688
|
}
|
|
@@ -84148,6 +84205,15 @@ margin: $grid-group-animator-cell-margin;
|
|
|
84148
84205
|
color: $grid-cell-selection-color;
|
|
84149
84206
|
}
|
|
84150
84207
|
|
|
84208
|
+
td.e-cellselectionbackground.e-leftfreeze:not(.e-updatedtd),
|
|
84209
|
+
td.e-cellselectionbackground.e-unfreeze:not(.e-updatedtd),
|
|
84210
|
+
td.e-cellselectionbackground.e-rightfreeze:not(.e-updatedtd),
|
|
84211
|
+
td.e-cellselectionbackground.e-fixedfreeze:not(.e-updatedtd) {
|
|
84212
|
+
@if $grid-skin == 'material3' {
|
|
84213
|
+
background-color: rgba($primary-container, 1);
|
|
84214
|
+
}
|
|
84215
|
+
}
|
|
84216
|
+
|
|
84151
84217
|
.e-filterbarcell,
|
|
84152
84218
|
.e-filterbarcelldisabled {
|
|
84153
84219
|
background-color: $grid-header-bg-color;
|
|
@@ -87798,7 +87864,7 @@ $form-group-title-border-height: 1px !default;
|
|
|
87798
87864
|
$form-group-title-border-bottom-style: 1px solid $group-title-border-color !default;
|
|
87799
87865
|
|
|
87800
87866
|
//tooltip styles
|
|
87801
|
-
$form-tooltip-background-color:
|
|
87867
|
+
$form-tooltip-background-color: var(--danger-light, #f9dedc) !default;
|
|
87802
87868
|
$form-tooltip-color: var(--danger, #b3261e) !default;
|
|
87803
87869
|
$form-validation-message-font-size: 12px;
|
|
87804
87870
|
|
|
@@ -90542,6 +90608,20 @@ $btn-flat-primary-path-arc: rgba($white);
|
|
|
90542
90608
|
}
|
|
90543
90609
|
}
|
|
90544
90610
|
|
|
90611
|
+
.e-progress-btn.e-outline .e-spinner-pane .e-spinner-inner svg {
|
|
90612
|
+
fill: $btn-outline-color;
|
|
90613
|
+
stroke: $btn-outline-color;
|
|
90614
|
+
}
|
|
90615
|
+
|
|
90616
|
+
.e-progress-btn.e-outline:focus .e-spinner-pane .e-spinner-inner svg {
|
|
90617
|
+
fill: $btn-color;
|
|
90618
|
+
stroke: $btn-color;
|
|
90619
|
+
}
|
|
90620
|
+
|
|
90621
|
+
.e-progress-btn.e-outline.e-success .e-spinner-pane .e-spinner-inner svg .e-path-arc {
|
|
90622
|
+
stroke: $btn-outline-color;
|
|
90623
|
+
}
|
|
90624
|
+
|
|
90545
90625
|
|
|
90546
90626
|
|
|
90547
90627
|
|
|
@@ -122961,18 +123041,17 @@ $image-editor-device-slider-handler: calc(50% - 8px) !default;
|
|
|
122961
123041
|
}
|
|
122962
123042
|
}
|
|
122963
123043
|
.e-ie-straighten-value-span,
|
|
122964
|
-
.e-ie-straighten-span
|
|
122965
|
-
|
|
123044
|
+
.e-ie-straighten-span,
|
|
123045
|
+
.e-ie-toolbar-straighten {
|
|
123046
|
+
font-size: 14px !important; /* stylelint-disable-line declaration-no-important */
|
|
122966
123047
|
padding-left: 10px !important; /* stylelint-disable-line declaration-no-important */
|
|
122967
123048
|
padding-right: 10px !important; /* stylelint-disable-line declaration-no-important */
|
|
122968
123049
|
}
|
|
122969
123050
|
|
|
122970
123051
|
.e-straighten .e-control-wrapper.e-slider-container.e-horizontal {
|
|
122971
123052
|
height: auto;
|
|
122972
|
-
|
|
122973
|
-
|
|
122974
|
-
padding-right: 2px;
|
|
122975
|
-
}
|
|
123053
|
+
margin-left: 8px;
|
|
123054
|
+
padding-right: 2px;
|
|
122976
123055
|
}
|
|
122977
123056
|
|
|
122978
123057
|
.e-straighten .e-control-wrapper.e-slider-container.e-horizontal .e-slider {
|
|
@@ -122992,6 +123071,10 @@ $image-editor-device-slider-handler: calc(50% - 8px) !default;
|
|
|
122992
123071
|
}
|
|
122993
123072
|
}
|
|
122994
123073
|
|
|
123074
|
+
.e-ie-finetune-value-span {
|
|
123075
|
+
top: 26% !important; /* stylelint-disable-line declaration-no-important */
|
|
123076
|
+
}
|
|
123077
|
+
|
|
122995
123078
|
.e-bigger .e-straighten .e-control-wrapper.e-slider-container .e-slider .e-handle {
|
|
122996
123079
|
@if $skin-name == 'Material3' {
|
|
122997
123080
|
height: 22px !important; /* stylelint-disable-line declaration-no-important */
|
|
@@ -24994,12 +24994,22 @@ $btn-keyboard-focus-box-shadow: $shadow-focus-ring1 !default;
|
|
|
24994
24994
|
@if $skin-name == 'FluentUI' {
|
|
24995
24995
|
outline: none !important; /* stylelint-disable-line declaration-no-important */
|
|
24996
24996
|
}
|
|
24997
|
+
|
|
24998
|
+
@if $skin-name == 'bootstrap5' {
|
|
24999
|
+
background: $btn-outline-active-bgcolor;
|
|
25000
|
+
color: $btn-outline-active-color;
|
|
25001
|
+
}
|
|
24997
25002
|
}
|
|
24998
25003
|
|
|
24999
25004
|
&:focus-visible { // only for keybord
|
|
25000
25005
|
@if $skin-name == 'FluentUI' {
|
|
25001
25006
|
background: $btn-outline-bgcolor;
|
|
25002
25007
|
}
|
|
25008
|
+
|
|
25009
|
+
@if $skin-name == 'bootstrap5' {
|
|
25010
|
+
box-shadow: $btn-focus-box-shadow;
|
|
25011
|
+
}
|
|
25012
|
+
|
|
25003
25013
|
@if $skin-name == 'Material3' {
|
|
25004
25014
|
background: $btn-active-bgcolor;
|
|
25005
25015
|
box-shadow: $btn-keyboard-focus-box-shadow;
|
|
@@ -25050,12 +25060,22 @@ $btn-keyboard-focus-box-shadow: $shadow-focus-ring1 !default;
|
|
|
25050
25060
|
@if $skin-name == 'FluentUI' {
|
|
25051
25061
|
outline: none !important; /* stylelint-disable-line declaration-no-important */
|
|
25052
25062
|
}
|
|
25063
|
+
|
|
25064
|
+
@if $skin-name == 'bootstrap5' {
|
|
25065
|
+
background: $btn-outline-primary-focus-bgcolor;
|
|
25066
|
+
color: $btn-outline-active-color;
|
|
25067
|
+
}
|
|
25053
25068
|
}
|
|
25054
25069
|
|
|
25055
25070
|
&:focus-visible { // only for keybord
|
|
25056
25071
|
@if $skin-name == 'FluentUI' {
|
|
25057
25072
|
background: $btn-outline-bgcolor;
|
|
25058
25073
|
}
|
|
25074
|
+
|
|
25075
|
+
@if $skin-name == 'bootstrap5' {
|
|
25076
|
+
box-shadow: $btn-primary-focus-box-shadow;
|
|
25077
|
+
}
|
|
25078
|
+
|
|
25059
25079
|
@if $skin-name == 'Material3' {
|
|
25060
25080
|
background: $btn-primary-active-bgcolor;
|
|
25061
25081
|
box-shadow: $btn-keyboard-focus-box-shadow;
|
|
@@ -25113,12 +25133,20 @@ $btn-keyboard-focus-box-shadow: $shadow-focus-ring1 !default;
|
|
|
25113
25133
|
@if $skin-name == 'FluentUI' {
|
|
25114
25134
|
outline: none !important; /* stylelint-disable-line declaration-no-important */
|
|
25115
25135
|
}
|
|
25136
|
+
|
|
25137
|
+
@if $skin-name == 'bootstrap5' {
|
|
25138
|
+
background: $btn-success-bgcolor;
|
|
25139
|
+
color: $btn-success-color;
|
|
25140
|
+
}
|
|
25116
25141
|
}
|
|
25117
25142
|
|
|
25118
25143
|
&:focus-visible { // only for keybord
|
|
25119
25144
|
@if $skin-name == 'FluentUI' {
|
|
25120
25145
|
background: $btn-outline-bgcolor;
|
|
25121
25146
|
}
|
|
25147
|
+
@if $skin-name == 'bootstrap5' {
|
|
25148
|
+
box-shadow: $btn-success-focus-box-shadow;
|
|
25149
|
+
}
|
|
25122
25150
|
@if $skin-name == 'Material3' {
|
|
25123
25151
|
background: $btn-success-active-bgcolor;
|
|
25124
25152
|
box-shadow: $btn-keyboard-focus-box-shadow;
|
|
@@ -25176,12 +25204,20 @@ $btn-keyboard-focus-box-shadow: $shadow-focus-ring1 !default;
|
|
|
25176
25204
|
@if $skin-name == 'FluentUI' {
|
|
25177
25205
|
outline: none !important; /* stylelint-disable-line declaration-no-important */
|
|
25178
25206
|
}
|
|
25207
|
+
|
|
25208
|
+
@if $skin-name == 'bootstrap5' {
|
|
25209
|
+
background: $btn-info-bgcolor;
|
|
25210
|
+
color: $btn-info-color;
|
|
25211
|
+
}
|
|
25179
25212
|
}
|
|
25180
25213
|
|
|
25181
25214
|
&:focus-visible { // only for keybord
|
|
25182
25215
|
@if $skin-name == 'FluentUI' {
|
|
25183
25216
|
background: $btn-outline-bgcolor;
|
|
25184
25217
|
}
|
|
25218
|
+
@if $skin-name == 'bootstrap5' {
|
|
25219
|
+
box-shadow: $btn-info-focus-box-shadow;
|
|
25220
|
+
}
|
|
25185
25221
|
@if $skin-name == 'Material3' {
|
|
25186
25222
|
background: $btn-info-active-bgcolor;
|
|
25187
25223
|
box-shadow: $btn-keyboard-focus-box-shadow;
|
|
@@ -25239,12 +25275,20 @@ $btn-keyboard-focus-box-shadow: $shadow-focus-ring1 !default;
|
|
|
25239
25275
|
@if $skin-name == 'FluentUI' {
|
|
25240
25276
|
outline: none !important; /* stylelint-disable-line declaration-no-important */
|
|
25241
25277
|
}
|
|
25278
|
+
|
|
25279
|
+
@if $skin-name == 'bootstrap5' {
|
|
25280
|
+
background: $btn-warning-bgcolor;
|
|
25281
|
+
color: $btn-warning-color;
|
|
25282
|
+
}
|
|
25242
25283
|
}
|
|
25243
25284
|
|
|
25244
25285
|
&:focus-visible { // only for keybord
|
|
25245
25286
|
@if $skin-name == 'FluentUI' {
|
|
25246
25287
|
background: $btn-outline-bgcolor;
|
|
25247
25288
|
}
|
|
25289
|
+
@if $skin-name == 'bootstrap5' {
|
|
25290
|
+
box-shadow: $btn-warning-focus-box-shadow;
|
|
25291
|
+
}
|
|
25248
25292
|
@if $skin-name == 'Material3' {
|
|
25249
25293
|
background: $btn-warning-active-bgcolor;
|
|
25250
25294
|
box-shadow: $btn-keyboard-focus-box-shadow;
|
|
@@ -25302,12 +25346,20 @@ $btn-keyboard-focus-box-shadow: $shadow-focus-ring1 !default;
|
|
|
25302
25346
|
@if $skin-name == 'FluentUI' {
|
|
25303
25347
|
outline: none !important; /* stylelint-disable-line declaration-no-important */
|
|
25304
25348
|
}
|
|
25349
|
+
|
|
25350
|
+
@if $skin-name == 'bootstrap5' {
|
|
25351
|
+
background: $btn-danger-bgcolor;
|
|
25352
|
+
color: $btn-danger-color;
|
|
25353
|
+
}
|
|
25305
25354
|
}
|
|
25306
25355
|
|
|
25307
25356
|
&:focus-visible { // only for keybord
|
|
25308
25357
|
@if $skin-name == 'FluentUI' {
|
|
25309
25358
|
background: $btn-outline-bgcolor;
|
|
25310
25359
|
}
|
|
25360
|
+
@if $skin-name == 'bootstrap5' {
|
|
25361
|
+
box-shadow: $btn-danger-focus-box-shadow;
|
|
25362
|
+
}
|
|
25311
25363
|
@if $skin-name == 'Material3' {
|
|
25312
25364
|
background: $btn-danger-active-bgcolor;
|
|
25313
25365
|
box-shadow: $btn-keyboard-focus-box-shadow;
|
|
@@ -59709,6 +59761,11 @@ $ddt-readonly-input-bg-color: rgba($content-bg-color) !default;
|
|
|
59709
59761
|
}
|
|
59710
59762
|
}
|
|
59711
59763
|
|
|
59764
|
+
&.e-input-group.e-control-wrapper.e-valid-input:hover:not(.e-disabled) .e-clear-icon,
|
|
59765
|
+
&.e-float-input.e-control-wrapper.e-valid-input:hover:not(.e-disabled) .e-clear-icon {
|
|
59766
|
+
display: flex;
|
|
59767
|
+
}
|
|
59768
|
+
|
|
59712
59769
|
.e-chips-wrapper {
|
|
59713
59770
|
width: 100%;
|
|
59714
59771
|
}
|
|
@@ -84231,6 +84288,15 @@ margin: $grid-group-animator-cell-margin;
|
|
|
84231
84288
|
color: $grid-cell-selection-color;
|
|
84232
84289
|
}
|
|
84233
84290
|
|
|
84291
|
+
td.e-cellselectionbackground.e-leftfreeze:not(.e-updatedtd),
|
|
84292
|
+
td.e-cellselectionbackground.e-unfreeze:not(.e-updatedtd),
|
|
84293
|
+
td.e-cellselectionbackground.e-rightfreeze:not(.e-updatedtd),
|
|
84294
|
+
td.e-cellselectionbackground.e-fixedfreeze:not(.e-updatedtd) {
|
|
84295
|
+
@if $grid-skin == 'material3' {
|
|
84296
|
+
background-color: rgba($primary-container, 1);
|
|
84297
|
+
}
|
|
84298
|
+
}
|
|
84299
|
+
|
|
84234
84300
|
.e-filterbarcell,
|
|
84235
84301
|
.e-filterbarcelldisabled {
|
|
84236
84302
|
background-color: $grid-header-bg-color;
|
|
@@ -87881,7 +87947,7 @@ $form-group-title-border-height: 1px !default;
|
|
|
87881
87947
|
$form-group-title-border-bottom-style: 1px solid $group-title-border-color !default;
|
|
87882
87948
|
|
|
87883
87949
|
//tooltip styles
|
|
87884
|
-
$form-tooltip-background-color:
|
|
87950
|
+
$form-tooltip-background-color: var(--danger-light, #f9dedc) !default;
|
|
87885
87951
|
$form-tooltip-color: var(--danger, #b3261e) !default;
|
|
87886
87952
|
$form-validation-message-font-size: 12px;
|
|
87887
87953
|
|
|
@@ -90625,6 +90691,20 @@ $btn-flat-primary-path-arc: rgba($white);
|
|
|
90625
90691
|
}
|
|
90626
90692
|
}
|
|
90627
90693
|
|
|
90694
|
+
.e-progress-btn.e-outline .e-spinner-pane .e-spinner-inner svg {
|
|
90695
|
+
fill: $btn-outline-color;
|
|
90696
|
+
stroke: $btn-outline-color;
|
|
90697
|
+
}
|
|
90698
|
+
|
|
90699
|
+
.e-progress-btn.e-outline:focus .e-spinner-pane .e-spinner-inner svg {
|
|
90700
|
+
fill: $btn-color;
|
|
90701
|
+
stroke: $btn-color;
|
|
90702
|
+
}
|
|
90703
|
+
|
|
90704
|
+
.e-progress-btn.e-outline.e-success .e-spinner-pane .e-spinner-inner svg .e-path-arc {
|
|
90705
|
+
stroke: $btn-outline-color;
|
|
90706
|
+
}
|
|
90707
|
+
|
|
90628
90708
|
|
|
90629
90709
|
|
|
90630
90710
|
|
|
@@ -123044,18 +123124,17 @@ $image-editor-device-slider-handler: calc(50% - 8px) !default;
|
|
|
123044
123124
|
}
|
|
123045
123125
|
}
|
|
123046
123126
|
.e-ie-straighten-value-span,
|
|
123047
|
-
.e-ie-straighten-span
|
|
123048
|
-
|
|
123127
|
+
.e-ie-straighten-span,
|
|
123128
|
+
.e-ie-toolbar-straighten {
|
|
123129
|
+
font-size: 14px !important; /* stylelint-disable-line declaration-no-important */
|
|
123049
123130
|
padding-left: 10px !important; /* stylelint-disable-line declaration-no-important */
|
|
123050
123131
|
padding-right: 10px !important; /* stylelint-disable-line declaration-no-important */
|
|
123051
123132
|
}
|
|
123052
123133
|
|
|
123053
123134
|
.e-straighten .e-control-wrapper.e-slider-container.e-horizontal {
|
|
123054
123135
|
height: auto;
|
|
123055
|
-
|
|
123056
|
-
|
|
123057
|
-
padding-right: 2px;
|
|
123058
|
-
}
|
|
123136
|
+
margin-left: 8px;
|
|
123137
|
+
padding-right: 2px;
|
|
123059
123138
|
}
|
|
123060
123139
|
|
|
123061
123140
|
.e-straighten .e-control-wrapper.e-slider-container.e-horizontal .e-slider {
|
|
@@ -123075,6 +123154,10 @@ $image-editor-device-slider-handler: calc(50% - 8px) !default;
|
|
|
123075
123154
|
}
|
|
123076
123155
|
}
|
|
123077
123156
|
|
|
123157
|
+
.e-ie-finetune-value-span {
|
|
123158
|
+
top: 26% !important; /* stylelint-disable-line declaration-no-important */
|
|
123159
|
+
}
|
|
123160
|
+
|
|
123078
123161
|
.e-bigger .e-straighten .e-control-wrapper.e-slider-container .e-slider .e-handle {
|
|
123079
123162
|
@if $skin-name == 'Material3' {
|
|
123080
123163
|
height: 22px !important; /* stylelint-disable-line declaration-no-important */
|
|
@@ -1066,3 +1066,17 @@ $btn-flat-primary-path-arc: none;
|
|
|
1066
1066
|
}
|
|
1067
1067
|
}
|
|
1068
1068
|
|
|
1069
|
+
.e-progress-btn.e-outline .e-spinner-pane .e-spinner-inner svg {
|
|
1070
|
+
fill: $btn-outline-color;
|
|
1071
|
+
stroke: $btn-outline-color;
|
|
1072
|
+
}
|
|
1073
|
+
|
|
1074
|
+
.e-progress-btn.e-outline:focus .e-spinner-pane .e-spinner-inner svg {
|
|
1075
|
+
fill: $btn-color;
|
|
1076
|
+
stroke: $btn-color;
|
|
1077
|
+
}
|
|
1078
|
+
|
|
1079
|
+
.e-progress-btn.e-outline.e-success .e-spinner-pane .e-spinner-inner svg .e-path-arc {
|
|
1080
|
+
stroke: $btn-outline-color;
|
|
1081
|
+
}
|
|
1082
|
+
|
|
@@ -1063,3 +1063,17 @@ $btn-flat-primary-path-arc: none;
|
|
|
1063
1063
|
}
|
|
1064
1064
|
}
|
|
1065
1065
|
|
|
1066
|
+
.e-progress-btn.e-outline .e-spinner-pane .e-spinner-inner svg {
|
|
1067
|
+
fill: $btn-outline-color;
|
|
1068
|
+
stroke: $btn-outline-color;
|
|
1069
|
+
}
|
|
1070
|
+
|
|
1071
|
+
.e-progress-btn.e-outline:focus .e-spinner-pane .e-spinner-inner svg {
|
|
1072
|
+
fill: $btn-color;
|
|
1073
|
+
stroke: $btn-color;
|
|
1074
|
+
}
|
|
1075
|
+
|
|
1076
|
+
.e-progress-btn.e-outline.e-success .e-spinner-pane .e-spinner-inner svg .e-path-arc {
|
|
1077
|
+
stroke: $btn-outline-color;
|
|
1078
|
+
}
|
|
1079
|
+
|
|
@@ -1063,3 +1063,17 @@ $btn-flat-primary-path-arc: none;
|
|
|
1063
1063
|
}
|
|
1064
1064
|
}
|
|
1065
1065
|
|
|
1066
|
+
.e-progress-btn.e-outline .e-spinner-pane .e-spinner-inner svg {
|
|
1067
|
+
fill: $btn-outline-color;
|
|
1068
|
+
stroke: $btn-outline-color;
|
|
1069
|
+
}
|
|
1070
|
+
|
|
1071
|
+
.e-progress-btn.e-outline:focus .e-spinner-pane .e-spinner-inner svg {
|
|
1072
|
+
fill: $btn-color;
|
|
1073
|
+
stroke: $btn-color;
|
|
1074
|
+
}
|
|
1075
|
+
|
|
1076
|
+
.e-progress-btn.e-outline.e-success .e-spinner-pane .e-spinner-inner svg .e-path-arc {
|
|
1077
|
+
stroke: $btn-outline-color;
|
|
1078
|
+
}
|
|
1079
|
+
|
|
@@ -1060,3 +1060,17 @@ $btn-flat-primary-path-arc: $white;
|
|
|
1060
1060
|
}
|
|
1061
1061
|
}
|
|
1062
1062
|
|
|
1063
|
+
.e-progress-btn.e-outline .e-spinner-pane .e-spinner-inner svg {
|
|
1064
|
+
fill: $btn-outline-color;
|
|
1065
|
+
stroke: $btn-outline-color;
|
|
1066
|
+
}
|
|
1067
|
+
|
|
1068
|
+
.e-progress-btn.e-outline:focus .e-spinner-pane .e-spinner-inner svg {
|
|
1069
|
+
fill: $btn-color;
|
|
1070
|
+
stroke: $btn-color;
|
|
1071
|
+
}
|
|
1072
|
+
|
|
1073
|
+
.e-progress-btn.e-outline.e-success .e-spinner-pane .e-spinner-inner svg .e-path-arc {
|
|
1074
|
+
stroke: $btn-outline-color;
|
|
1075
|
+
}
|
|
1076
|
+
|
|
@@ -1060,3 +1060,17 @@ $btn-flat-primary-path-arc: $white;
|
|
|
1060
1060
|
}
|
|
1061
1061
|
}
|
|
1062
1062
|
|
|
1063
|
+
.e-progress-btn.e-outline .e-spinner-pane .e-spinner-inner svg {
|
|
1064
|
+
fill: $btn-outline-color;
|
|
1065
|
+
stroke: $btn-outline-color;
|
|
1066
|
+
}
|
|
1067
|
+
|
|
1068
|
+
.e-progress-btn.e-outline:focus .e-spinner-pane .e-spinner-inner svg {
|
|
1069
|
+
fill: $btn-color;
|
|
1070
|
+
stroke: $btn-color;
|
|
1071
|
+
}
|
|
1072
|
+
|
|
1073
|
+
.e-progress-btn.e-outline.e-success .e-spinner-pane .e-spinner-inner svg .e-path-arc {
|
|
1074
|
+
stroke: $btn-outline-color;
|
|
1075
|
+
}
|
|
1076
|
+
|
|
@@ -1066,3 +1066,17 @@ $btn-flat-primary-path-arc: none;
|
|
|
1066
1066
|
}
|
|
1067
1067
|
}
|
|
1068
1068
|
|
|
1069
|
+
.e-progress-btn.e-outline .e-spinner-pane .e-spinner-inner svg {
|
|
1070
|
+
fill: $btn-outline-color;
|
|
1071
|
+
stroke: $btn-outline-color;
|
|
1072
|
+
}
|
|
1073
|
+
|
|
1074
|
+
.e-progress-btn.e-outline:focus .e-spinner-pane .e-spinner-inner svg {
|
|
1075
|
+
fill: $btn-color;
|
|
1076
|
+
stroke: $btn-color;
|
|
1077
|
+
}
|
|
1078
|
+
|
|
1079
|
+
.e-progress-btn.e-outline.e-success .e-spinner-pane .e-spinner-inner svg .e-path-arc {
|
|
1080
|
+
stroke: $btn-outline-color;
|
|
1081
|
+
}
|
|
1082
|
+
|
|
@@ -1063,3 +1063,17 @@ $btn-flat-primary-path-arc: none;
|
|
|
1063
1063
|
}
|
|
1064
1064
|
}
|
|
1065
1065
|
|
|
1066
|
+
.e-progress-btn.e-outline .e-spinner-pane .e-spinner-inner svg {
|
|
1067
|
+
fill: $btn-outline-color;
|
|
1068
|
+
stroke: $btn-outline-color;
|
|
1069
|
+
}
|
|
1070
|
+
|
|
1071
|
+
.e-progress-btn.e-outline:focus .e-spinner-pane .e-spinner-inner svg {
|
|
1072
|
+
fill: $btn-color;
|
|
1073
|
+
stroke: $btn-color;
|
|
1074
|
+
}
|
|
1075
|
+
|
|
1076
|
+
.e-progress-btn.e-outline.e-success .e-spinner-pane .e-spinner-inner svg .e-path-arc {
|
|
1077
|
+
stroke: $btn-outline-color;
|
|
1078
|
+
}
|
|
1079
|
+
|
|
@@ -1060,3 +1060,17 @@ $btn-flat-primary-path-arc: $white;
|
|
|
1060
1060
|
}
|
|
1061
1061
|
}
|
|
1062
1062
|
|
|
1063
|
+
.e-progress-btn.e-outline .e-spinner-pane .e-spinner-inner svg {
|
|
1064
|
+
fill: $btn-outline-color;
|
|
1065
|
+
stroke: $btn-outline-color;
|
|
1066
|
+
}
|
|
1067
|
+
|
|
1068
|
+
.e-progress-btn.e-outline:focus .e-spinner-pane .e-spinner-inner svg {
|
|
1069
|
+
fill: $btn-color;
|
|
1070
|
+
stroke: $btn-color;
|
|
1071
|
+
}
|
|
1072
|
+
|
|
1073
|
+
.e-progress-btn.e-outline.e-success .e-spinner-pane .e-spinner-inner svg .e-path-arc {
|
|
1074
|
+
stroke: $btn-outline-color;
|
|
1075
|
+
}
|
|
1076
|
+
|
|
@@ -1060,3 +1060,17 @@ $btn-flat-primary-path-arc: $white;
|
|
|
1060
1060
|
}
|
|
1061
1061
|
}
|
|
1062
1062
|
|
|
1063
|
+
.e-progress-btn.e-outline .e-spinner-pane .e-spinner-inner svg {
|
|
1064
|
+
fill: $btn-outline-color;
|
|
1065
|
+
stroke: $btn-outline-color;
|
|
1066
|
+
}
|
|
1067
|
+
|
|
1068
|
+
.e-progress-btn.e-outline:focus .e-spinner-pane .e-spinner-inner svg {
|
|
1069
|
+
fill: $btn-color;
|
|
1070
|
+
stroke: $btn-color;
|
|
1071
|
+
}
|
|
1072
|
+
|
|
1073
|
+
.e-progress-btn.e-outline.e-success .e-spinner-pane .e-spinner-inner svg .e-path-arc {
|
|
1074
|
+
stroke: $btn-outline-color;
|
|
1075
|
+
}
|
|
1076
|
+
|
|
@@ -1063,3 +1063,17 @@ $btn-flat-primary-path-arc: none;
|
|
|
1063
1063
|
}
|
|
1064
1064
|
}
|
|
1065
1065
|
|
|
1066
|
+
.e-progress-btn.e-outline .e-spinner-pane .e-spinner-inner svg {
|
|
1067
|
+
fill: $btn-outline-color;
|
|
1068
|
+
stroke: $btn-outline-color;
|
|
1069
|
+
}
|
|
1070
|
+
|
|
1071
|
+
.e-progress-btn.e-outline:focus .e-spinner-pane .e-spinner-inner svg {
|
|
1072
|
+
fill: $btn-color;
|
|
1073
|
+
stroke: $btn-color;
|
|
1074
|
+
}
|
|
1075
|
+
|
|
1076
|
+
.e-progress-btn.e-outline.e-success .e-spinner-pane .e-spinner-inner svg .e-path-arc {
|
|
1077
|
+
stroke: $btn-outline-color;
|
|
1078
|
+
}
|
|
1079
|
+
|
|
@@ -1066,3 +1066,17 @@ $btn-flat-primary-path-arc: none;
|
|
|
1066
1066
|
}
|
|
1067
1067
|
}
|
|
1068
1068
|
|
|
1069
|
+
.e-progress-btn.e-outline .e-spinner-pane .e-spinner-inner svg {
|
|
1070
|
+
fill: $btn-outline-color;
|
|
1071
|
+
stroke: $btn-outline-color;
|
|
1072
|
+
}
|
|
1073
|
+
|
|
1074
|
+
.e-progress-btn.e-outline:focus .e-spinner-pane .e-spinner-inner svg {
|
|
1075
|
+
fill: $btn-color;
|
|
1076
|
+
stroke: $btn-color;
|
|
1077
|
+
}
|
|
1078
|
+
|
|
1079
|
+
.e-progress-btn.e-outline.e-success .e-spinner-pane .e-spinner-inner svg .e-path-arc {
|
|
1080
|
+
stroke: $btn-outline-color;
|
|
1081
|
+
}
|
|
1082
|
+
|
|
@@ -1063,3 +1063,17 @@ $btn-flat-primary-path-arc: none;
|
|
|
1063
1063
|
}
|
|
1064
1064
|
}
|
|
1065
1065
|
|
|
1066
|
+
.e-progress-btn.e-outline .e-spinner-pane .e-spinner-inner svg {
|
|
1067
|
+
fill: $btn-outline-color;
|
|
1068
|
+
stroke: $btn-outline-color;
|
|
1069
|
+
}
|
|
1070
|
+
|
|
1071
|
+
.e-progress-btn.e-outline:focus .e-spinner-pane .e-spinner-inner svg {
|
|
1072
|
+
fill: $btn-color;
|
|
1073
|
+
stroke: $btn-color;
|
|
1074
|
+
}
|
|
1075
|
+
|
|
1076
|
+
.e-progress-btn.e-outline.e-success .e-spinner-pane .e-spinner-inner svg .e-path-arc {
|
|
1077
|
+
stroke: $btn-outline-color;
|
|
1078
|
+
}
|
|
1079
|
+
|