@syncfusion/blazor-themes 25.1.39 → 25.1.40

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 (73) hide show
  1. package/SCSS-Themes/bds-dark.scss +331 -429
  2. package/SCSS-Themes/bds.scss +331 -429
  3. package/SCSS-Themes/bootstrap-dark.scss +331 -429
  4. package/SCSS-Themes/bootstrap.scss +331 -429
  5. package/SCSS-Themes/bootstrap4.scss +331 -429
  6. package/SCSS-Themes/bootstrap5-dark.scss +331 -429
  7. package/SCSS-Themes/bootstrap5.scss +331 -429
  8. package/SCSS-Themes/fabric-dark.scss +331 -429
  9. package/SCSS-Themes/fabric.scss +331 -429
  10. package/SCSS-Themes/fluent-dark.scss +331 -429
  11. package/SCSS-Themes/fluent.scss +331 -429
  12. package/SCSS-Themes/grids/grid/bds-dark.scss +10 -2
  13. package/SCSS-Themes/grids/grid/bds.scss +10 -2
  14. package/SCSS-Themes/grids/grid/bootstrap-dark.scss +10 -2
  15. package/SCSS-Themes/grids/grid/bootstrap.scss +10 -2
  16. package/SCSS-Themes/grids/grid/bootstrap4.scss +10 -2
  17. package/SCSS-Themes/grids/grid/bootstrap5-dark.scss +10 -2
  18. package/SCSS-Themes/grids/grid/bootstrap5.scss +10 -2
  19. package/SCSS-Themes/grids/grid/fabric-dark.scss +10 -2
  20. package/SCSS-Themes/grids/grid/fabric.scss +10 -2
  21. package/SCSS-Themes/grids/grid/fluent-dark.scss +10 -2
  22. package/SCSS-Themes/grids/grid/fluent.scss +10 -2
  23. package/SCSS-Themes/grids/grid/highcontrast.scss +10 -2
  24. package/SCSS-Themes/grids/grid/material-dark.scss +10 -2
  25. package/SCSS-Themes/grids/grid/material.scss +10 -2
  26. package/SCSS-Themes/grids/grid/material3-dark.scss +10 -2
  27. package/SCSS-Themes/grids/grid/material3.scss +10 -2
  28. package/SCSS-Themes/grids/grid/tailwind-dark.scss +10 -2
  29. package/SCSS-Themes/grids/grid/tailwind.scss +10 -2
  30. package/SCSS-Themes/highcontrast.scss +331 -429
  31. package/SCSS-Themes/material-dark.scss +331 -429
  32. package/SCSS-Themes/material.scss +331 -429
  33. package/SCSS-Themes/material3-dark.scss +331 -429
  34. package/SCSS-Themes/material3.scss +331 -429
  35. package/SCSS-Themes/navigations/stepper/bds-dark.scss +323 -429
  36. package/SCSS-Themes/navigations/stepper/bds.scss +323 -429
  37. package/SCSS-Themes/navigations/stepper/bootstrap-dark.scss +323 -429
  38. package/SCSS-Themes/navigations/stepper/bootstrap.scss +323 -429
  39. package/SCSS-Themes/navigations/stepper/bootstrap4.scss +323 -429
  40. package/SCSS-Themes/navigations/stepper/bootstrap5-dark.scss +323 -429
  41. package/SCSS-Themes/navigations/stepper/bootstrap5.scss +323 -429
  42. package/SCSS-Themes/navigations/stepper/fabric-dark.scss +323 -429
  43. package/SCSS-Themes/navigations/stepper/fabric.scss +323 -429
  44. package/SCSS-Themes/navigations/stepper/fluent-dark.scss +323 -429
  45. package/SCSS-Themes/navigations/stepper/fluent.scss +323 -429
  46. package/SCSS-Themes/navigations/stepper/highcontrast.scss +323 -429
  47. package/SCSS-Themes/navigations/stepper/material-dark.scss +323 -429
  48. package/SCSS-Themes/navigations/stepper/material.scss +323 -429
  49. package/SCSS-Themes/navigations/stepper/material3-dark.scss +323 -429
  50. package/SCSS-Themes/navigations/stepper/material3.scss +323 -429
  51. package/SCSS-Themes/navigations/stepper/tailwind-dark.scss +323 -429
  52. package/SCSS-Themes/navigations/stepper/tailwind.scss +323 -429
  53. package/SCSS-Themes/splitbuttons/button-group/bds-dark.scss +1 -1
  54. package/SCSS-Themes/splitbuttons/button-group/bds.scss +1 -1
  55. package/SCSS-Themes/splitbuttons/button-group/bootstrap-dark.scss +1 -1
  56. package/SCSS-Themes/splitbuttons/button-group/bootstrap.scss +1 -1
  57. package/SCSS-Themes/splitbuttons/button-group/bootstrap4.scss +1 -1
  58. package/SCSS-Themes/splitbuttons/button-group/bootstrap5-dark.scss +1 -1
  59. package/SCSS-Themes/splitbuttons/button-group/bootstrap5.scss +1 -1
  60. package/SCSS-Themes/splitbuttons/button-group/fabric-dark.scss +1 -1
  61. package/SCSS-Themes/splitbuttons/button-group/fabric.scss +1 -1
  62. package/SCSS-Themes/splitbuttons/button-group/fluent-dark.scss +1 -1
  63. package/SCSS-Themes/splitbuttons/button-group/fluent.scss +1 -1
  64. package/SCSS-Themes/splitbuttons/button-group/highcontrast.scss +1 -1
  65. package/SCSS-Themes/splitbuttons/button-group/material-dark.scss +1 -1
  66. package/SCSS-Themes/splitbuttons/button-group/material.scss +1 -1
  67. package/SCSS-Themes/splitbuttons/button-group/material3-dark.scss +1 -1
  68. package/SCSS-Themes/splitbuttons/button-group/material3.scss +1 -1
  69. package/SCSS-Themes/splitbuttons/button-group/tailwind-dark.scss +1 -1
  70. package/SCSS-Themes/splitbuttons/button-group/tailwind.scss +1 -1
  71. package/SCSS-Themes/tailwind-dark.scss +331 -429
  72. package/SCSS-Themes/tailwind.scss +331 -429
  73. package/package.json +1 -1
@@ -57895,12 +57895,11 @@ $step-selected-active-color: $brand-primary-lighten-15 !default;
57895
57895
  .e-stepper {
57896
57896
  position: relative;
57897
57897
  &.e-stepper-readonly,
57898
- .e-stepper-steps .e-step-container.e-step-disabled {
57898
+ .e-step-disabled {
57899
57899
  cursor: default;
57900
57900
  pointer-events: none;
57901
57901
  }
57902
-
57903
- &.e-step-type-indicator .e-stepper-steps .e-step-container {
57902
+ &.e-step-type-indicator .e-step-container {
57904
57903
  &:not(.e-step-icon.e-step-label.e-step-text) {
57905
57904
  .e-icons.e-step-indicator {
57906
57905
  font-size: $stepper-step-width;
@@ -57913,12 +57912,12 @@ $step-selected-active-color: $brand-primary-lighten-15 !default;
57913
57912
  }
57914
57913
 
57915
57914
  //For Blazor Stepper Tooltip
57916
- .e-stepper-steps .e-step-container:has(.e-tooltip-wrap.e-stepper-tooltip),
57917
- &.e-vertical.e-label-after .e-stepper-steps .e-step-container.e-step-icon.e-step-label:has(.e-tooltip-wrap.e-stepper-tooltip),
57918
- &.e-vertical.e-label-before .e-stepper-steps .e-step-container.e-step-icon.e-step-label:has(.e-tooltip-wrap.e-stepper-tooltip) {
57915
+ .e-step-container:has(.e-tooltip-wrap.e-stepper-tooltip),
57916
+ &.e-vertical.e-label-after .e-step-icon.e-step-label:has(.e-tooltip-wrap.e-stepper-tooltip),
57917
+ &.e-vertical.e-label-before .e-step-icon.e-step-label:has(.e-tooltip-wrap.e-stepper-tooltip) {
57919
57918
  position: relative;
57920
57919
  }
57921
- &.e-horizontal .e-stepper-steps .e-step-container.e-step-icon.e-step-label:has(.e-tooltip-wrap.e-stepper-tooltip) {
57920
+ &.e-horizontal .e-step-icon.e-step-label:has(.e-tooltip-wrap.e-stepper-tooltip) {
57922
57921
  position: unset;
57923
57922
  }
57924
57923
  .e-tooltip-wrap.e-stepper-tooltip {
@@ -57943,15 +57942,14 @@ $step-selected-active-color: $brand-primary-lighten-15 !default;
57943
57942
  top: -6px;
57944
57943
  }
57945
57944
  }
57946
- .e-stepper-steps .e-step-container.e-step-icon.e-step-label .e-tooltip-wrap.e-stepper-tooltip {
57945
+ .e-step-icon.e-step-label .e-tooltip-wrap.e-stepper-tooltip {
57947
57946
  left: unset;
57948
57947
  top: 0;
57949
57948
  transform: translate(0%, -135%);
57950
57949
  }
57951
- &.e-step-type-indicator .e-stepper-steps .e-step-container .e-tooltip-wrap.e-stepper-tooltip {
57950
+ &.e-step-type-indicator .e-tooltip-wrap.e-stepper-tooltip {
57952
57951
  transform: translate(-50%, -115%);
57953
57952
  }
57954
-
57955
57953
  .e-stepper-steps {
57956
57954
  display: flex;
57957
57955
  padding: 0;
@@ -57959,124 +57957,170 @@ $step-selected-active-color: $brand-primary-lighten-15 !default;
57959
57957
  justify-content: space-between;
57960
57958
  position: relative;
57961
57959
  align-items: flex-start;
57962
- .e-step-container {
57963
- max-width: var(--max-width);
57964
- &.e-step-notstarted:not(.e-step-disabled) .e-step,
57965
- &.e-step-notstarted:not(.e-step-disabled) .e-indicator {
57966
- border: $step-border;
57967
- }
57968
- .e-step-label-container,
57969
- .e-step-text-container {
57970
- max-width: clamp(100%, 10em, 100%);
57971
- white-space: nowrap;
57972
- }
57973
- .e-step-label-optional {
57974
- font-size: $stepper-optional-size;
57975
- flex-basis: 100%;
57976
- }
57977
- .e-step-optional-container {
57978
- display: flex;
57979
- flex-direction: column;
57960
+ .e-step-container,
57961
+ .e-step,
57962
+ .e-step-valid.e-step-text.e-step-text-only .e-step-text-container,
57963
+ .e-step-error.e-step-text.e-step-text-only .e-step-text-container,
57964
+ .e-step-label-container {
57965
+ display: flex;
57966
+ align-items: center;
57967
+ justify-content: center;
57968
+ }
57969
+ }
57970
+ .e-step-container {
57971
+ max-width: var(--max-width);
57972
+ list-style-type: none;
57973
+ cursor: pointer;
57974
+ text-align: center;
57975
+ .e-step-label-container,
57976
+ .e-step-text-container {
57977
+ max-width: clamp(100%, 10em, 100%);
57978
+ white-space: nowrap;
57979
+ }
57980
+ .e-step-label-optional {
57981
+ font-size: $stepper-optional-size;
57982
+ flex-basis: 100%;
57983
+ }
57984
+ .e-step-optional-container {
57985
+ display: flex;
57986
+ flex-direction: column;
57987
+ }
57988
+ .e-step-content {
57989
+ font-size: $stepper-icon-size;
57990
+ line-height: 0;
57991
+ }
57992
+ .e-indicator {
57993
+ font-size: $stepper-icon-size;
57994
+ }
57995
+ &:not(.e-step-text-only) > .e-step-text-container {
57996
+ padding: $stepper-icon-text-padding;
57997
+ }
57998
+ &.e-step-text-only .e-step-text-container,
57999
+ &.e-step-label-only .e-step-label-container {
58000
+ padding: $stepper-text-padding;
58001
+ padding-block: 5px;
58002
+ }
58003
+ &.e-step-text-only.e-step-error .e-step-text-container,
58004
+ &.e-step-text-only.e-step-valid .e-step-text-container,
58005
+ &.e-step-label-only.e-step-error .e-step-label-container,
58006
+ &.e-step-label-only.e-step-valid .e-step-label-container {
58007
+ flex-direction: column;
58008
+ .e-step-validation-icon {
58009
+ position: relative;
58010
+ top: $stepper-validation-position;
57980
58011
  }
57981
58012
  }
58013
+ .e-step-label-container,
58014
+ .e-step-text-container {
58015
+ font-size: $stepper-text-size;
58016
+ }
58017
+ .e-step,
58018
+ .e-indicator {
58019
+ border-radius: $stepper-step-radius;
58020
+ min-width: $stepper-step-width;
58021
+ min-height: $stepper-step-width;
58022
+ }
58023
+ }
58024
+ .e-step-notstarted:not(.e-step-disabled) .e-step,
58025
+ .e-step-notstarted:not(.e-step-disabled) .e-indicator {
58026
+ border: $step-border;
57982
58027
  }
57983
-
57984
58028
  &.e-horizontal {
57985
58029
  display: block;
57986
58030
  .e-stepper-steps {
57987
58031
  flex-direction: row;
57988
58032
  }
57989
-
57990
58033
  &.e-label-before,
57991
58034
  &.e-label-after {
57992
- &:has(.e-stepper-steps .e-step-container.e-step-icon.e-step-label:not(.e-step-text)) .e-stepper-progressbar {
58035
+ &:has(.e-step-icon.e-step-label:not(.e-step-text)) .e-stepper-progressbar {
57993
58036
  margin-left: var(--progress-left-position);
57994
58037
  top: var(--progress-top-position);
57995
58038
  width: var(--progress-bar-width);
57996
58039
  }
57997
58040
  }
57998
-
57999
58041
  &.e-label-before.e-rtl,
58000
58042
  &.e-label-after.e-rtl {
58001
- &:has(.e-stepper-steps .e-step-container.e-step-icon.e-step-label:not(.e-step-text)) .e-stepper-progressbar {
58043
+ &:has(.e-step-icon.e-step-label:not(.e-step-text)) .e-stepper-progressbar {
58002
58044
  margin-right: var(--progress-left-position);
58003
58045
  margin-left: unset;
58004
58046
  }
58005
58047
  }
58006
- }
58007
-
58008
- &.e-horizontal .e-stepper-steps .e-step-container {
58009
- &.e-step-icon.e-step-label {
58048
+ .e-step-icon.e-step-label {
58010
58049
  gap: 1em;
58050
+ flex-direction: column;
58011
58051
  }
58012
-
58013
- &.e-step-icon.e-step-label .e-step-label-container {
58052
+ .e-step-icon.e-step-label .e-step-label-container {
58014
58053
  position: relative;
58015
58054
  &.e-label-before {
58016
58055
  order: -1;
58017
58056
  }
58018
58057
  }
58019
-
58020
- &.e-step-text.e-step-label,
58021
- &.e-step-icon.e-step-label {
58022
- flex-direction: column;
58058
+ &.e-label-start .e-step-text-container {
58059
+ order: $stepper-label-order;
58023
58060
  }
58024
- }
58025
-
58026
- &.e-horizontal.e-label-start .e-stepper-steps .e-step-container .e-step-text-container {
58027
- order: $stepper-label-order;
58028
- }
58029
-
58030
- &.e-horizontal .e-stepper-steps .e-step-container.e-step-icon.e-step-text:not(.e-step-label) .e-step-label-optional {
58031
- position: absolute;
58032
- top: 2.5em;
58033
- margin-left: 2.5em;
58034
- }
58035
-
58036
- &.e-horizontal.e-label-start .e-stepper-steps .e-step-container.e-step-icon.e-step-text:not(.e-step-label) .e-step-label-optional,
58037
- &.e-horizontal.e-rtl .e-stepper-steps .e-step-container.e-step-icon.e-step-text:not(.e-step-label) .e-step-label-optional {
58038
- margin-right: 2.5em;
58039
- margin-left: unset;
58040
- }
58041
-
58042
- &.e-horizontal.e-label-start.e-rtl .e-stepper-steps .e-step-container.e-step-icon.e-step-text:not(.e-step-label) .e-step-label-optional {
58043
- margin-right: unset;
58044
- margin-left: 2.5em;
58045
- }
58046
-
58047
- &.e-horizontal.e-label-before .e-stepper-steps {
58048
- &:has(.e-step-label-optional) {
58049
- align-items: flex-end;
58061
+ .e-step-icon.e-step-text:not(.e-step-label) .e-step-label-optional {
58062
+ position: absolute;
58063
+ top: 2.5em;
58064
+ margin-left: 2.5em;
58050
58065
  }
58051
- .e-step-container .e-step-label-container.e-label-before:has(.e-step-label-optional) {
58052
- flex-direction: column;
58053
- gap: .5em;
58066
+ &.e-label-start .e-step-icon.e-step-text:not(.e-step-label) .e-step-label-optional,
58067
+ &.e-rtl .e-step-icon.e-step-text:not(.e-step-label) .e-step-label-optional {
58068
+ margin-right: 2.5em;
58069
+ margin-left: unset;
58070
+ }
58071
+ &.e-label-start.e-rtl .e-step-icon.e-step-text:not(.e-step-label) .e-step-label-optional {
58072
+ margin-right: unset;
58073
+ margin-left: 2.5em;
58074
+ }
58075
+ &.e-label-before .e-stepper-steps {
58076
+ &:has(.e-step-label-optional) {
58077
+ align-items: flex-end;
58078
+ }
58079
+ .e-step-label-container.e-label-before:has(.e-step-label-optional) {
58080
+ flex-direction: column;
58081
+ gap: .5em;
58082
+ }
58083
+ }
58084
+ .e-text,
58085
+ .e-label,
58086
+ .e-step-label-optional {
58087
+ text-overflow: ellipsis;
58088
+ overflow: hidden;
58089
+ }
58090
+ .e-step-text.e-step-text-only:has(.e-step-label-optional),
58091
+ .e-step-label.e-step-label-only:has(.e-step-label-optional),
58092
+ .e-step-icon:not(.e-step-text):not(.e-step-label):has(.e-step-label-optional),
58093
+ .e-step-label-container.e-label-after:has(.e-step-label-optional) {
58094
+ flex-wrap: wrap;
58095
+ }
58096
+ &.e-step-type-indicator .e-step-container {
58097
+ flex-wrap: wrap;
58098
+ }
58099
+ .e-step-icon:not(.e-step-label):not(.e-step-text) .e-step-label-optional {
58100
+ margin-top: .5em;
58101
+ }
58102
+ &.e-label-after .e-step-icon.e-step-label:not(.e-step-text) .e-step-label-optional {
58103
+ margin-top: .2em;
58054
58104
  }
58055
58105
  }
58056
-
58057
58106
  &.e-vertical {
58058
58107
  min-height: inherit;
58059
58108
  display: inline-block;
58060
-
58061
- .e-stepper-steps .e-step-container.e-step-label.e-step-label-only,
58062
- .e-stepper-steps .e-step-container.e-step-template {
58109
+ .e-step-label.e-step-label-only,
58110
+ .e-step-template {
58063
58111
  position: relative;
58064
58112
  }
58065
-
58066
- &:not(.e-label-top):not(.e-label-bottom) .e-stepper-steps .e-step-container .e-step-label-optional {
58113
+ &:not(.e-label-top):not(.e-label-bottom) .e-step-label-optional {
58067
58114
  position: absolute;
58068
58115
  }
58069
-
58070
- &:not(.e-label-bottom):not(.e-label-top) .e-stepper-steps .e-step-container.e-step-icon.e-step-text:not(.e-step-label) .e-step-label-optional {
58116
+ &:not(.e-label-bottom):not(.e-label-top) .e-step-icon.e-step-text:not(.e-step-label) .e-step-label-optional {
58071
58117
  margin-top: $stepper-label-optional;
58072
58118
  margin-left: 4em;
58073
58119
  }
58074
-
58075
- &.e-rtl:not(.e-label-bottom):not(.e-label-top) .e-stepper-steps .e-step-container.e-step-icon.e-step-text:not(.e-step-label) .e-step-label-optional {
58120
+ &.e-rtl:not(.e-label-bottom):not(.e-label-top) .e-step-icon.e-step-text:not(.e-step-label) .e-step-label-optional {
58076
58121
  margin-left: unset;
58077
58122
  margin-right: 4em;
58078
58123
  }
58079
-
58080
58124
  .e-stepper-steps {
58081
58125
  flex-direction: column;
58082
58126
  min-height: inherit;
@@ -58085,49 +58129,42 @@ $step-selected-active-color: $brand-primary-lighten-15 !default;
58085
58129
  margin: $stepper-ol-padding;
58086
58130
  justify-content: space-between;
58087
58131
  }
58088
-
58089
58132
  &.e-rtl .e-stepper-steps {
58090
58133
  float: right;
58091
58134
  }
58092
-
58093
- .e-stepper-steps:has(.e-step-container.e-step-icon:not(.e-step-text):not(.e-step-label)),
58094
- .e-stepper-steps:has(.e-step-container.e-step-text.e-step-text-only:not(.e-step-icon.e-step-label)),
58095
- .e-stepper-steps:has(.e-step-container.e-step-label.e-step-label-only:not(.e-step-icon.e-step-text)),
58096
- &.e-label-after .e-stepper-steps:has(.e-step-container.e-step-label.e-step-text:not(.e-step-icon)),
58135
+ .e-stepper-steps:has(.e-step-icon:not(.e-step-text):not(.e-step-label)),
58136
+ .e-stepper-steps:has(.e-step-text.e-step-text-only),
58137
+ .e-stepper-steps:has(.e-step-label.e-step-label-only),
58138
+ &.e-label-after .e-stepper-steps:has(.e-step-label.e-step-text:not(.e-step-icon)),
58097
58139
  &.e-step-type-indicator .e-stepper-steps {
58098
58140
  align-items: center;
58099
58141
  }
58100
-
58101
- .e-stepper-steps .e-step-container.e-step-icon.e-step-text:not(.e-step-label) .e-step-text-container,
58102
- .e-stepper-steps .e-step-container.e-step-icon.e-step-label:not(.e-step-text) .e-step-label-container.e-label-after {
58142
+ .e-step-icon.e-step-text:not(.e-step-label) .e-step-text-container,
58143
+ .e-step-icon.e-step-label:not(.e-step-text) .e-step-label-container.e-label-after {
58103
58144
  margin-left: $stepper-text-postion;
58104
58145
  }
58105
-
58106
58146
  &.e-rtl {
58107
- .e-stepper-steps .e-step-container.e-step-icon.e-step-text:not(.e-step-label) .e-step-text-container,
58108
- .e-stepper-steps .e-step-container.e-step-icon.e-step-label:not(.e-step-text) .e-step-label-container.e-label-after {
58147
+ .e-step-icon.e-step-text:not(.e-step-label) .e-step-text-container,
58148
+ .e-step-icon.e-step-label:not(.e-step-text) .e-step-label-container.e-label-after {
58109
58149
  margin-left: unset;
58110
58150
  margin-right: $stepper-text-postion;
58111
58151
  }
58112
58152
  }
58113
-
58114
- .e-stepper-steps .e-step-container.e-step-icon:not(.e-step-label):not(.e-step-text):has(.e-step-label-optional),
58115
- &.e-label-before .e-stepper-steps .e-step-container .e-step-label-container.e-label-before:has(.e-step-label-optional),
58116
- .e-stepper-steps .e-step-container.e-step-text-only.e-step-text:has(.e-step-label-optional),
58117
- .e-stepper-steps .e-step-container.e-step-label-only.e-step-label:has(.e-step-label-optional) {
58153
+ .e-step-icon:not(.e-step-label):not(.e-step-text):has(.e-step-label-optional),
58154
+ &.e-label-before .e-step-label-container.e-label-before:has(.e-step-label-optional),
58155
+ .e-step-text-only.e-step-text:has(.e-step-label-optional),
58156
+ .e-step-label-only.e-step-label:has(.e-step-label-optional) {
58118
58157
  flex-direction: column;
58119
58158
  .e-step-label-optional {
58120
58159
  position: unset;
58121
58160
  }
58122
58161
  }
58123
-
58124
- .e-stepper-steps .e-step-container.e-step-icon:not(.e-step-label):not(.e-step-text):has(.e-step-label-optional),
58125
- &.e-label-before .e-stepper-steps .e-step-container .e-step-label-container.e-label-before:has(.e-step-label-optional) {
58162
+ .e-step-icon:not(.e-step-label):not(.e-step-text):has(.e-step-label-optional),
58163
+ &.e-label-before .e-step-label-container.e-label-before:has(.e-step-label-optional) {
58126
58164
  gap: .5em;
58127
58165
  }
58128
-
58129
- &.e-label-before .e-stepper-steps .e-step-container.e-step-icon.e-step-label,
58130
- &.e-label-after .e-stepper-steps .e-step-container.e-step-icon.e-step-label {
58166
+ &.e-label-before .e-step-icon.e-step-label,
58167
+ &.e-label-after .e-step-icon.e-step-label {
58131
58168
  .e-step-label-container.e-label-after:has(.e-step-label-optional) {
58132
58169
  flex-direction: column;
58133
58170
  .e-label {
@@ -58138,43 +58175,37 @@ $step-selected-active-color: $brand-primary-lighten-15 !default;
58138
58175
  position: unset;
58139
58176
  }
58140
58177
  }
58141
-
58142
- .e-stepper-steps .e-step-container {
58178
+ .e-step-container {
58143
58179
  &.e-step-label.e-step-text:not(.e-step-icon) .e-step-label-container.e-label-after {
58144
58180
  position: absolute;
58145
58181
  .e-step-label-optional {
58146
58182
  left: $stepper-ol-padding;
58147
58183
  }
58148
58184
  }
58149
-
58150
58185
  .e-step-label-container.e-label-after {
58151
58186
  .e-step-label-optional {
58152
58187
  font-size: $stepper-optional-size;
58153
58188
  }
58154
58189
  }
58155
-
58156
58190
  .e-step-label-container.e-label-before .e-label {
58157
58191
  width: var(--label-width);
58158
58192
  }
58159
-
58160
58193
  &:not(.e-step-text-only) .e-step-text-container {
58161
58194
  border: none;
58162
58195
  border-radius: unset;
58163
58196
  padding: $stepper-text-vert-padding;
58164
58197
  }
58165
-
58166
- &.e-step-text-only:not(.e-step-icon.e-step-label) .e-step-text-container,
58167
- &.e-step-label-only:not(.e-step-icon.e-step-text) .e-step-label-container {
58198
+ &.e-step-text-only .e-step-text-container,
58199
+ &.e-step-label-only .e-step-label-container {
58168
58200
  position: unset;
58169
58201
  }
58170
58202
  }
58171
58203
  &.e-label-top {
58172
- .e-stepper-steps .e-step-container .e-step-label-optional {
58204
+ .e-step-label-optional {
58173
58205
  padding-bottom: 6px;
58174
58206
  }
58175
58207
  }
58176
58208
  }
58177
-
58178
58209
  &.e-vertical.e-label-top,
58179
58210
  &.e-vertical.e-label-bottom {
58180
58211
  .e-stepper-steps {
@@ -58182,98 +58213,17 @@ $step-selected-active-color: $brand-primary-lighten-15 !default;
58182
58213
  .e-step-container {
58183
58214
  flex-direction: column;
58184
58215
  .e-step-text-container {
58185
- margin-left: $stepper-ol-padding !important; /* stylelint-disable-line declaration-no-important */
58216
+ margin-left: $stepper-ol-padding;
58186
58217
  }
58187
58218
  }
58188
58219
  }
58189
58220
  }
58190
-
58191
- &.e-vertical.e-label-top .e-stepper-steps .e-step-container {
58221
+ &.e-vertical.e-label-top .e-step-container {
58192
58222
  .e-step-label-optional,
58193
58223
  .e-step-text-container {
58194
58224
  order: $stepper-label-order;
58195
58225
  }
58196
58226
  }
58197
- .e-stepper-steps {
58198
- .e-step-container,
58199
- .e-step-container .e-step,
58200
- .e-step-container.e-step-valid.e-step-text.e-step-text-only:not(.e-step-icon.e-step-label) .e-step-text-container,
58201
- .e-step-container.e-step-error.e-step-text.e-step-text-only:not(.e-step-icon.e-step-label) .e-step-text-container,
58202
- .e-step-container .e-step-label-container {
58203
- display: flex;
58204
- align-items: center;
58205
- justify-content: center;
58206
- }
58207
- }
58208
-
58209
- &.e-horizontal {
58210
- .e-stepper-steps {
58211
- .e-step-container.e-step-text.e-step-text-only:not(.e-step-icon.e-step-label):has(.e-step-label-optional),
58212
- .e-step-container.e-step-label.e-step-label-only:not(.e-step-icon.e-step-label):has(.e-step-label-optional),
58213
- .e-step-container.e-step-icon:not(.e-step-text):not(.e-step-label):has(.e-step-label-optional),
58214
- .e-step-container .e-step-label-container.e-label-after:has(.e-step-label-optional) {
58215
- flex-wrap: wrap;
58216
- }
58217
- }
58218
- &.e-step-type-indicator .e-step-container {
58219
- flex-wrap: wrap;
58220
- }
58221
- }
58222
-
58223
- &.e-horizontal .e-stepper-steps .e-step-container.e-step-icon:not(.e-step-label):not(.e-step-text) .e-step-label-optional {
58224
- margin-top: .5em;
58225
- }
58226
-
58227
- &.e-horizontal.e-label-after .e-stepper-steps .e-step-container.e-step-icon.e-step-label:not(.e-step-text) .e-step-label-optional {
58228
- margin-top: .2em;
58229
- }
58230
-
58231
- .e-stepper-steps .e-step-container {
58232
- list-style-type: none;
58233
- cursor: pointer;
58234
- text-align: center;
58235
-
58236
- .e-step-content {
58237
- font-size: $stepper-icon-size;
58238
- line-height: 0;
58239
- }
58240
-
58241
- .e-indicator {
58242
- font-size: $stepper-icon-size;
58243
- }
58244
-
58245
- &:not(.e-step-text-only) > .e-step-text-container {
58246
- padding: $stepper-icon-text-padding;
58247
- }
58248
-
58249
- &.e-step-text-only:not(.e-step-icon.e-step-label) .e-step-text-container,
58250
- &.e-step-label-only:not(.e-step-icon.e-step-text) .e-step-label-container {
58251
- padding: $stepper-text-padding;
58252
- padding-block: 5px;
58253
- }
58254
-
58255
- &.e-step-text-only.e-step-error:not(.e-step-icon.e-step-label) .e-step-text-container,
58256
- &.e-step-text-only.e-step-valid:not(.e-step-icon.e-step-label) .e-step-text-container,
58257
- &.e-step-label-only.e-step-error:not(.e-step-icon.e-step-text) .e-step-label-container,
58258
- &.e-step-label-only.e-step-valid:not(.e-step-icon.e-step-text) .e-step-label-container {
58259
- flex-direction: column;
58260
- .e-step-validation-icon {
58261
- position: relative;
58262
- top: $stepper-validation-position;
58263
- }
58264
- }
58265
- .e-step-label-container,
58266
- .e-step-text-container {
58267
- font-size: $stepper-text-size;
58268
- }
58269
- .e-step,
58270
- .e-indicator {
58271
- border-radius: $stepper-step-radius;
58272
- min-width: $stepper-step-width;
58273
- min-height: $stepper-step-width;
58274
- }
58275
- }
58276
-
58277
58227
  .e-stepper-progressbar {
58278
58228
  height: $stepper-progress-bar-height;
58279
58229
  position: absolute;
@@ -58288,7 +58238,6 @@ $step-selected-active-color: $brand-primary-lighten-15 !default;
58288
58238
  transition-delay: var(--delay);
58289
58239
  }
58290
58240
  }
58291
-
58292
58241
  &.e-vertical .e-stepper-progressbar {
58293
58242
  min-height: inherit;
58294
58243
  width: $stepper-progress-bar-height;
@@ -58301,40 +58250,26 @@ $step-selected-active-color: $brand-primary-lighten-15 !default;
58301
58250
  transition-property: height;
58302
58251
  }
58303
58252
  }
58304
-
58305
58253
  &.e-vertical.e-rtl .e-stepper-progressbar {
58306
58254
  right: var(--progress-position);
58307
58255
  left: unset;
58308
58256
  }
58309
-
58310
- &:not(.e-steps-focus):not(.e-step-type-label):not(.e-step-type-indicator) .e-stepper-steps .e-step-container:not(.e-step-text-only):not(.e-step-label-only) .e-indicator,
58311
- .e-stepper-steps .e-step-container.e-step-focus .e-indicator {
58257
+ &:not(.e-steps-focus):not(.e-step-type-label):not(.e-step-type-indicator) .e-step-container .e-indicator,
58258
+ .e-step-focus .e-indicator {
58312
58259
  z-index: 0;
58313
58260
  }
58314
-
58315
- .e-stepper-steps .e-step-container.e-step-template.e-step-focus {
58261
+ .e-step-template.e-step-focus {
58316
58262
  outline: $stepper-temp-outline-width;
58317
58263
  }
58318
58264
  }
58319
-
58320
58265
  .e-tooltip-wrap.e-stepper-tooltip.e-step-inprogress-tip {
58321
58266
  .e-arrow-tip.e-tip-bottom {
58322
58267
  top: 90% !important; /* stylelint-disable-line declaration-no-important */
58323
58268
  }
58324
58269
  }
58325
-
58326
- .e-stepper.e-horizontal .e-stepper-steps .e-step-container {
58327
- .e-text,
58328
- .e-label,
58329
- .e-step-label-optional {
58330
- text-overflow: ellipsis;
58331
- overflow: hidden;
58332
- }
58333
- }
58334
-
58335
58270
  .e-small.e-stepper,
58336
58271
  .e-small .e-stepper {
58337
- &.e-step-type-indicator .e-stepper-steps .e-step-container:not(.e-step-icon.e-step-label.e-step-text) {
58272
+ &.e-step-type-indicator .e-step-container:not(.e-step-icon.e-step-label.e-step-text) {
58338
58273
  .e-icons.e-step-indicator {
58339
58274
  font-size: $stepper-small-step-width;
58340
58275
  }
@@ -58343,39 +58278,33 @@ $step-selected-active-color: $brand-primary-lighten-15 !default;
58343
58278
  height: $stepper-small-step-width;
58344
58279
  }
58345
58280
  }
58346
-
58347
- .e-stepper-steps .e-step-container {
58281
+ .e-step-container {
58348
58282
  .e-step,
58349
58283
  .e-indicator {
58350
58284
  min-width: $stepper-small-step-width;
58351
58285
  min-height: $stepper-small-step-width;
58352
58286
  }
58353
-
58354
58287
  .e-indicator {
58355
58288
  font-size: $stepper-small-icon-size;
58356
58289
  }
58357
-
58358
58290
  .e-step-text-container,
58359
58291
  .e-step-label-container {
58360
58292
  font-size: $stepper-small-text-size;
58361
58293
  }
58362
-
58363
58294
  .e-step-content {
58364
58295
  font-size: $stepper-small-icon-size;
58365
58296
  }
58366
-
58367
58297
  .e-step-label-optional {
58368
58298
  font-size: $stepper-small-optional-size;
58369
58299
  }
58370
58300
  }
58371
- &.e-vertical .e-stepper-steps .e-step-container .e-step-label-container.e-label-after .e-step-label-optional {
58301
+ &.e-vertical .e-step-label-container.e-label-after .e-step-label-optional {
58372
58302
  font-size: $stepper-small-optional-size;
58373
58303
  }
58374
58304
  }
58375
-
58376
58305
  .e-bigger.e-stepper,
58377
58306
  .e-bigger .e-stepper {
58378
- &.e-step-type-indicator .e-stepper-steps .e-step-container:not(.e-step-icon.e-step-label.e-step-text) {
58307
+ &.e-step-type-indicator .e-step-container:not(.e-step-icon.e-step-label.e-step-text) {
58379
58308
  .e-icons.e-step-indicator {
58380
58309
  font-size: $stepper-bigger-step-width;
58381
58310
  }
@@ -58384,32 +58313,27 @@ $step-selected-active-color: $brand-primary-lighten-15 !default;
58384
58313
  height: $stepper-bigger-step-width;
58385
58314
  }
58386
58315
  }
58387
-
58388
- .e-stepper-steps .e-step-container {
58316
+ .e-step-container {
58389
58317
  .e-step,
58390
58318
  .e-indicator {
58391
58319
  min-width: $stepper-bigger-step-width;
58392
58320
  min-height: $stepper-bigger-step-width;
58393
58321
  }
58394
-
58395
58322
  .e-indicator {
58396
58323
  font-size: $stepper-bigger-icon-size;
58397
58324
  }
58398
-
58399
58325
  .e-step-text-container,
58400
58326
  .e-step-label-container {
58401
58327
  font-size: $stepper-bigger-text-size;
58402
58328
  }
58403
-
58404
58329
  .e-step-content {
58405
58330
  font-size: $stepper-bigger-icon-size;
58406
58331
  }
58407
-
58408
58332
  .e-step-label-optional {
58409
58333
  font-size: $stepper-bigger-optional-size;
58410
58334
  }
58411
58335
  }
58412
- &.e-vertical .e-stepper-steps .e-step-container .e-step-label-container.e-label-after .e-step-label-optional {
58336
+ &.e-vertical .e-step-label-container.e-label-after .e-step-label-optional {
58413
58337
  font-size: $stepper-bigger-optional-size;
58414
58338
  }
58415
58339
  }
@@ -58418,7 +58342,7 @@ $step-selected-active-color: $brand-primary-lighten-15 !default;
58418
58342
  .e-bigger.e-small .e-stepper,
58419
58343
  .e-bigger .e-small.e-stepper,
58420
58344
  .e-small .e-bigger.e-stepper {
58421
- &.e-step-type-indicator .e-stepper-steps .e-step-container:not(.e-step-icon.e-step-label.e-step-text) {
58345
+ &.e-step-type-indicator .e-step-container:not(.e-step-icon.e-step-label.e-step-text) {
58422
58346
  .e-icons.e-step-indicator {
58423
58347
  font-size: $stepper-bigger-small-step-width;
58424
58348
  }
@@ -58427,31 +58351,27 @@ $step-selected-active-color: $brand-primary-lighten-15 !default;
58427
58351
  height: $stepper-bigger-small-step-width;
58428
58352
  }
58429
58353
  }
58430
-
58431
- .e-stepper-steps .e-step-container {
58354
+ .e-step-container {
58432
58355
  .e-step,
58433
58356
  .e-indicator {
58434
58357
  min-width: $stepper-bigger-small-step-width;
58435
58358
  min-height: $stepper-bigger-small-step-width;
58436
58359
  }
58437
-
58438
58360
  .e-indicator {
58439
58361
  font-size: $stepper-bigger-small-icon-size;
58440
58362
  }
58441
-
58442
58363
  .e-step-text-container,
58443
- .e-step-label-container{
58364
+ .e-step-label-container {
58444
58365
  font-size: $stepper-bigger-small-text-size;
58445
58366
  }
58446
58367
  .e-step-content {
58447
58368
  font-size: $stepper-bigger-small-icon-size;
58448
58369
  }
58449
-
58450
58370
  .e-step-label-optional {
58451
58371
  font-size: $stepper-bigger-small-optional-size;
58452
58372
  }
58453
58373
  }
58454
- &.e-vertical .e-stepper-steps .e-step-container .e-step-label-container.e-label-after .e-step-label-optional {
58374
+ &.e-vertical .e-step-label-container.e-label-after .e-step-label-optional {
58455
58375
  font-size: $stepper-bigger-small-optional-size;
58456
58376
  }
58457
58377
  }
@@ -58460,229 +58380,203 @@ $step-selected-active-color: $brand-primary-lighten-15 !default;
58460
58380
 
58461
58381
  @include export-module('stepper-theme') {
58462
58382
  .e-stepper {
58463
- .e-stepper-steps {
58464
- .e-step-container {
58465
- &.e-step-notstarted:not(.e-step-disabled) .e-step,
58466
- &.e-step-notstarted:not(.e-step-disabled) .e-indicator,
58467
- &.e-step-notstarted .e-icons.e-step-indicator {
58468
- border-color: $step-border-color;
58469
- }
58470
-
58471
- .e-step-label-optional {
58472
- color: $step-optional-color;
58473
- }
58474
-
58475
- .e-step,
58476
- .e-indicator {
58477
- color: $step-color;
58478
- background: $step-bg-color;
58479
- }
58480
-
58481
- .e-step-indicator {
58482
- color: transparent;
58483
- }
58484
-
58485
- &.e-step-completed .e-step,
58486
- &.e-step-inprogress .e-step,
58487
- &.e-step-completed .e-indicator,
58488
- &.e-step-inprogress .e-indicator,
58489
- &.e-step-completed .e-step-indicator,
58490
- &.e-step-inprogress .e-step-indicator {
58491
- background: $step-completed-bg-color;
58492
- color: $step-completed-color;
58493
- }
58494
-
58495
- &.e-step-valid {
58496
- .e-indicator {
58497
- background: $step-valid-completed-bg-color !important; /* stylelint-disable-line declaration-no-important */
58498
- color: $step-valid-completed-color;
58499
- }
58500
- }
58501
-
58502
- &.e-step-error {
58503
- .e-indicator {
58504
- background: $step-error-completed-bg-color !important; /* stylelint-disable-line declaration-no-important */
58505
- color: $step-error-icon-color;
58506
- }
58507
-
58508
- .e-text,
58509
- .e-label {
58510
- color: $step-error-completed-color;
58511
- }
58512
- }
58513
-
58514
- &.e-step-valid:not(.e-step-notstarted) .e-indicator:hover,
58515
- &.e-step-error .e-indicator:hover {
58516
- color: $step-color;
58517
- }
58518
-
58519
- &.e-step-selected {
58520
- .e-text,
58521
- .e-label {
58522
- font-weight: $stepper-font-weight;
58523
- }
58524
- }
58525
-
58526
- &.e-step-valid.e-step-text-only:not(.e-step-icon.e-step-label) .e-step-text-container,
58527
- &.e-step-valid.e-step-label-only:not(.e-step-icon.e-step-text) .e-step-label-container {
58528
- .e-step-validation-icon {
58529
- color: $step-valid-icon-only-color;
58530
- }
58531
- }
58532
-
58533
- &.e-step-error.e-step-text-only:not(.e-step-icon.e-step-label) .e-step-text-container,
58534
- &.e-step-error.e-step-label-only:not(.e-step-icon.e-step-text) .e-step-label-container {
58535
- .e-step-validation-icon {
58536
- color: $step-error-icon-only-color;
58537
- }
58538
- }
58539
-
58540
- .e-text,
58541
- .e-label {
58542
- color: $stepper-text-color;
58543
- }
58544
-
58545
- &.e-step-selected:not(.e-step-error),
58546
- &.e-step-completed:not(.e-step-error) {
58547
- .e-text,
58548
- .e-label {
58549
- color: $step-completed-bg-color;
58550
- }
58551
- }
58552
-
58553
- &.e-step-label:not(.e-step-icon) .e-step-label-container {
58554
- background-color: $stepper-outline-color;
58555
- }
58556
-
58557
- .e-step-text-container {
58558
- background-color: $stepper-outline-color;
58559
- border-color: transparent;
58560
- }
58561
-
58562
- &.e-step-selected .e-indicator {
58563
- background: $step-completed-bg-color;
58564
- }
58565
-
58566
- &.e-step-disabled .e-indicator {
58567
- background: $step-disabled-bg-color !important; /* stylelint-disable-line declaration-no-important */
58568
- color: $step-disabled-color !important; /* stylelint-disable-line declaration-no-important */
58569
- }
58570
-
58571
- &.e-step-disabled .e-text,
58572
- &.e-step-disabled .e-label,
58573
- &.e-step-disabled .e-step-validation-icon {
58574
- color: $step-disabled-font-color !important; /* stylelint-disable-line declaration-no-important */
58575
- }
58383
+ .e-step-notstarted:not(.e-step-disabled) .e-step,
58384
+ .e-step-notstarted:not(.e-step-disabled) .e-indicator,
58385
+ .e-step-notstarted .e-icons.e-step-indicator {
58386
+ border-color: $step-border-color;
58387
+ }
58388
+ .e-step-label-optional {
58389
+ color: $step-optional-color;
58390
+ }
58391
+ .e-step,
58392
+ .e-indicator {
58393
+ color: $step-color;
58394
+ background: $step-bg-color;
58395
+ }
58396
+ .e-step-indicator {
58397
+ color: transparent;
58398
+ }
58399
+ .e-step-completed .e-step,
58400
+ .e-step-inprogress .e-step,
58401
+ .e-step-completed .e-indicator,
58402
+ .e-step-inprogress .e-indicator,
58403
+ .e-step-completed .e-step-indicator,
58404
+ .e-step-inprogress .e-step-indicator {
58405
+ background: $step-completed-bg-color;
58406
+ color: $step-completed-color;
58407
+ }
58408
+ .e-step-selected .e-indicator {
58409
+ background: $step-completed-bg-color;
58410
+ }
58411
+ .e-step-valid .e-indicator {
58412
+ background: $step-valid-completed-bg-color;
58413
+ color: $step-valid-completed-color;
58414
+ }
58415
+ .e-step-error {
58416
+ .e-indicator {
58417
+ background: $step-error-completed-bg-color;
58418
+ color: $step-error-icon-color;
58419
+ }
58420
+ .e-text,
58421
+ .e-label {
58422
+ color: $step-error-completed-color;
58576
58423
  }
58577
58424
  }
58578
-
58579
- &.e-vertical .e-stepper-steps .e-step-container.e-step-text-only.e-step-text .e-step-label-optional,
58580
- &.e-vertical .e-stepper-steps .e-step-container.e-step-label-only.e-step-label .e-step-label-optional,
58581
- &.e-vertical .e-stepper-steps .e-step-container.e-step-icon:not(.e-step-text):not(.e-step-label) .e-step-label-optional,
58582
- &.e-vertical.e-label-top .e-stepper-steps .e-step-container .e-step-label-optional,
58583
- &.e-vertical.e-label-bottom .e-stepper-steps .e-step-container .e-step-label-optional {
58425
+ .e-step-valid:not(.e-step-notstarted) .e-indicator:hover,
58426
+ .e-step-error .e-indicator:hover {
58427
+ color: $step-color;
58428
+ }
58429
+ .e-step-selected {
58430
+ .e-text,
58431
+ .e-label {
58432
+ font-weight: $stepper-font-weight;
58433
+ }
58434
+ }
58435
+ .e-step-valid.e-step-text-only,
58436
+ .e-step-valid.e-step-label-only {
58437
+ .e-step-validation-icon {
58438
+ color: $step-valid-icon-only-color;
58439
+ }
58440
+ }
58441
+ .e-step-error.e-step-text-only,
58442
+ .e-step-error.e-step-label-only {
58443
+ .e-step-validation-icon {
58444
+ color: $step-error-icon-only-color;
58445
+ }
58446
+ }
58447
+ .e-text,
58448
+ .e-label {
58449
+ color: $stepper-text-color;
58450
+ }
58451
+ .e-step-selected:not(.e-step-error),
58452
+ .e-step-completed:not(.e-step-error) {
58453
+ .e-text,
58454
+ .e-label {
58455
+ color: $step-completed-bg-color;
58456
+ }
58457
+ }
58458
+ .e-step-label:not(.e-step-icon) .e-step-label-container {
58459
+ background-color: $stepper-outline-color;
58460
+ }
58461
+ .e-step-text-container {
58462
+ background-color: $stepper-outline-color;
58463
+ border-color: transparent;
58464
+ }
58465
+ .e-step-disabled .e-indicator {
58466
+ background: $step-disabled-bg-color;
58467
+ color: $step-disabled-color;
58468
+ }
58469
+ .e-step-disabled .e-text,
58470
+ .e-step-disabled .e-label,
58471
+ .e-step-disabled .e-step-validation-icon {
58472
+ color: $step-disabled-font-color;
58473
+ }
58474
+ &.e-vertical .e-step-text-only.e-step-text .e-step-label-optional,
58475
+ &.e-vertical .e-step-label-only.e-step-label .e-step-label-optional,
58476
+ &.e-vertical .e-step-icon:not(.e-step-text):not(.e-step-label) .e-step-label-optional,
58477
+ &.e-vertical.e-label-top .e-step-label-optional,
58478
+ &.e-vertical.e-label-bottom .e-step-label-optional {
58584
58479
  background-color: $stepper-outline-color;
58585
58480
  }
58586
-
58587
58481
  .e-stepper-progressbar {
58588
58482
  background-color: $step-progress-bg-color;
58589
-
58590
58483
  >.e-progressbar-value {
58591
58484
  background-color: $step-progress-value-bg-color;
58592
58485
  }
58593
58486
  }
58594
-
58595
- &:not(.e-steps-focus) .e-stepper-steps .e-step-container.e-step-selected:not(.e-step-text-only):not(.e-step-label-only) .e-step {
58487
+ &:not(.e-steps-focus) .e-step-selected .e-step {
58596
58488
  box-shadow: $step-selected-li-shadow;
58597
58489
  }
58598
-
58599
- .e-stepper-steps .e-step-container.e-step-focus .e-step,
58600
- .e-stepper-steps .e-step-container.e-step-label-only.e-step-focus .e-label,
58601
- .e-stepper-steps .e-step-container.e-step-text-only.e-step-focus .e-text,
58602
- .e-stepper-steps .e-step-container.e-step-template.e-step-focus,
58603
- &:not(.e-steps-focus) .e-stepper-steps .e-step-container:focus-visible .e-step,
58604
- &:not(.e-steps-focus) .e-stepper-steps .e-step-container.e-step-text-only:focus-visible .e-text,
58605
- &:not(.e-steps-focus) .e-stepper-steps .e-step-container.e-step-label-only:focus-visible .e-label {
58606
- box-shadow: $step-keyboard-selected-li-shadow !important; /* stylelint-disable-line declaration-no-important */
58490
+ .e-step-focus .e-step,
58491
+ .e-step-label-only.e-step-focus .e-label,
58492
+ .e-step-text-only.e-step-focus .e-text,
58493
+ .e-step-template.e-step-focus,
58494
+ &:not(.e-steps-focus) :focus-visible .e-step,
58495
+ &:not(.e-steps-focus) .e-step-text-only:focus-visible .e-text,
58496
+ &:not(.e-steps-focus) .e-step-label-only:focus-visible .e-label {
58497
+ box-shadow: $step-keyboard-selected-li-shadow;
58607
58498
  }
58608
58499
 
58609
- &:not(.e-steps-focus) .e-stepper-steps .e-step-container.e-step-valid.e-step-selected:not(.e-step-text-only):not(.e-step-label-only) .e-step,
58610
- .e-stepper-steps .e-step-container.e-step-valid.e-step-focus .e-step,
58611
- .e-stepper-steps .e-step-container.e-step-valid.e-step-label-only.e-step-focus .e-label,
58612
- .e-stepper-steps .e-step-container.e-step-valid.e-step-text-only.e-step-focus .e-text,
58613
- .e-stepper-steps .e-step-container.e-step-valid.e-step-template.e-step-focus {
58500
+ &:not(.e-steps-focus) .e-step-valid.e-step-selected .e-step,
58501
+ .e-step-valid.e-step-focus .e-step,
58502
+ .e-step-valid.e-step-label-only.e-step-focus .e-label,
58503
+ .e-step-valid.e-step-text-only.e-step-focus .e-text,
58504
+ .e-step-valid.e-step-template.e-step-focus {
58614
58505
  box-shadow: $step-valid-li-shadow;
58615
58506
  }
58616
58507
 
58617
- &:not(.e-steps-focus) .e-stepper-steps .e-step-container.e-step-error.e-step-selected:not(.e-step-text-only):not(.e-step-label-only) .e-step,
58618
- .e-stepper-steps .e-step-container.e-step-error.e-step-focus .e-step,
58619
- .e-stepper-steps .e-step-container.e-step-error.e-step-label-only.e-step-focus .e-label,
58620
- .e-stepper-steps .e-step-container.e-step-error.e-step-text-only.e-step-focus .e-text,
58621
- .e-stepper-steps .e-step-container.e-step-error.e-step-template.e-step-focus {
58508
+ &:not(.e-steps-focus) .e-step-error.e-step-selected .e-step,
58509
+ .e-step-error.e-step-focus .e-step,
58510
+ .e-step-error.e-step-label-only.e-step-focus .e-label,
58511
+ .e-step-error.e-step-text-only.e-step-focus .e-text,
58512
+ .e-step-error.e-step-template.e-step-focus {
58622
58513
  box-shadow: $step-error-li-shadow;
58623
58514
  }
58624
58515
 
58625
- .e-stepper-steps .e-step-container:not(.e-step-focus).e-step-notstarted:not(.e-step-text-only):not(.e-step-label-only) .e-step,
58626
- .e-stepper-steps .e-step-container:not(.e-step-focus).e-step-completed:not(.e-step-text-only):not(.e-step-label-only) .e-step,
58627
- &.e-steps-focus .e-stepper-steps .e-step-container:not(.e-step-focus).e-step-selected:not(.e-step-text-only):not(.e-step-label-only) .e-step {
58516
+ .e-step-container:not(.e-step-focus).e-step-notstarted .e-step,
58517
+ .e-step-container:not(.e-step-focus).e-step-completed .e-step,
58518
+ &.e-steps-focus .e-step-container:not(.e-step-focus).e-step-selected .e-step {
58628
58519
  box-shadow: $step-li-shadow;
58629
58520
  }
58630
58521
 
58631
- .e-stepper-steps .e-step-container.e-step-notstarted:not(.e-step-disabled) .e-step:hover,
58632
- .e-stepper-steps .e-step-container.e-step-notstarted:not(.e-step-disabled) .e-indicator:hover {
58633
- border-color: $step-hover-border-color !important; /* stylelint-disable-line declaration-no-important */
58522
+ .e-step-notstarted:not(.e-step-disabled) .e-step:hover,
58523
+ .e-step-notstarted:not(.e-step-disabled) .e-indicator:hover {
58524
+ border-color: $step-hover-border-color;
58634
58525
  }
58635
58526
 
58636
- .e-stepper-steps .e-step-container.e-step-notstarted:not(.e-step-disabled) .e-step:active,
58637
- .e-stepper-steps .e-step-container.e-step-notstarted:not(.e-step-disabled) .e-indicator:active {
58638
- border-color: $step-active-border-color !important; /* stylelint-disable-line declaration-no-important */
58527
+ .e-step-notstarted:not(.e-step-disabled) .e-step:active,
58528
+ .e-step-notstarted:not(.e-step-disabled) .e-indicator:active {
58529
+ border-color: $step-active-border-color;
58639
58530
  }
58640
58531
 
58641
- &:not(.e-step-type-label) .e-stepper-steps .e-step-container.e-step-notstarted:not(.e-step-text-only):not(.e-step-label-only) .e-indicator:hover,
58642
- &:not(.e-step-type-label) .e-stepper-steps .e-step-container.e-step-notstarted:not(.e-step-text-only):not(.e-step-label-only) .e-step:hover {
58643
- background: $step-hover-color !important; /* stylelint-disable-line declaration-no-important */
58532
+ &:not(.e-step-type-label) {
58533
+ .e-indicator:hover,
58534
+ .e-step:hover {
58535
+ color: $step-hover-text-color;
58536
+ background: $step-selected-hover-color;
58537
+ }
58644
58538
  }
58645
58539
 
58646
- &:not(.e-step-type-label) .e-stepper-steps .e-step-container.e-step-notstarted:not(.e-step-text-only):not(.e-step-label-only) .e-indicator:active,
58647
- &:not(.e-step-type-label) .e-stepper-steps .e-step-container.e-step-notstarted:not(.e-step-text-only):not(.e-step-label-only) .e-step:active {
58648
- background: $step-active-color !important; /* stylelint-disable-line declaration-no-important */
58540
+ &:not(.e-step-type-label) .e-step-notstarted .e-indicator:hover,
58541
+ &:not(.e-step-type-label) .e-step-notstarted .e-step:hover {
58542
+ color: $step-hover-not-text-color;
58649
58543
  }
58650
58544
 
58651
- &:not(.e-step-type-label) .e-stepper-steps .e-step-container {
58652
- &:not(.e-step-text-only):not(.e-step-label-only) .e-indicator:hover,
58653
- &:not(.e-step-text-only):not(.e-step-label-only) .e-step:hover {
58654
- color: $step-hover-text-color;
58655
- background: $step-selected-hover-color !important; /* stylelint-disable-line declaration-no-important */
58545
+ &:not(.e-step-type-label) {
58546
+ .e-step-selected .e-indicator:active,
58547
+ .e-step-selected .e-step:active {
58548
+ background: $step-selected-active-color;
58656
58549
  }
58657
- &.e-step-valid:not(.e-step-text-only):not(.e-step-label-only) .e-indicator:hover,
58658
- &.e-step-valid:not(.e-step-text-only):not(.e-step-label-only) .e-step:hover {
58659
- color: $step-hover-text-color !important; /* stylelint-disable-line declaration-no-important */
58660
- background: $step-valid-completed-bg-color !important; /* stylelint-disable-line declaration-no-important */
58550
+ .e-step-valid.e-step-selected .e-indicator:active,
58551
+ .e-step-valid.e-step-selected .e-step:active {
58552
+ background: $step-valid-completed-bg-color;
58661
58553
  }
58662
- &.e-step-error:not(.e-step-text-only):not(.e-step-label-only) .e-indicator:hover,
58663
- &.e-step-error:not(.e-step-text-only):not(.e-step-label-only) .e-step:hover {
58664
- color: $step-hover-text-color !important; /* stylelint-disable-line declaration-no-important */
58665
- background: $step-error-completed-bg-color !important; /* stylelint-disable-line declaration-no-important */
58554
+ .e-step-error.e-step-selected .e-indicator:active,
58555
+ .e-step-error.e-step-selected .e-step:active {
58556
+ background: $step-error-completed-bg-color;
58666
58557
  }
58667
58558
  }
58668
58559
 
58669
- &:not(.e-step-type-label) .e-stepper-steps .e-step-container.e-step-notstarted:not(.e-step-text-only):not(.e-step-label-only) .e-indicator:hover,
58670
- &:not(.e-step-type-label) .e-stepper-steps .e-step-container.e-step-notstarted:not(.e-step-text-only):not(.e-step-label-only) .e-step:hover {
58671
- color: $step-hover-not-text-color;
58560
+ &:not(.e-step-type-label) .e-step-notstarted .e-indicator:hover,
58561
+ &:not(.e-step-type-label) .e-step-notstarted .e-step:hover {
58562
+ background: $step-hover-color;
58672
58563
  }
58673
58564
 
58674
- &:not(.e-step-type-label) .e-stepper-steps .e-step-container {
58675
- &.e-step-selected:not(.e-step-text-only):not(.e-step-label-only) .e-indicator:active,
58676
- &.e-step-selected:not(.e-step-text-only):not(.e-step-label-only) .e-step:active {
58677
- background: $step-selected-active-color !important; /* stylelint-disable-line declaration-no-important */
58678
- }
58679
- &.e-step-valid.e-step-selected:not(.e-step-text-only):not(.e-step-label-only) .e-indicator:active,
58680
- &.e-step-valid.e-step-selected:not(.e-step-text-only):not(.e-step-label-only) .e-step:active {
58681
- background: $step-valid-completed-bg-color !important; /* stylelint-disable-line declaration-no-important */
58565
+ &:not(.e-step-type-label) .e-step-notstarted .e-indicator:active,
58566
+ &:not(.e-step-type-label) .e-step-notstarted .e-step:active {
58567
+ background: $step-active-color;
58568
+ }
58569
+
58570
+ &:not(.e-step-type-label) {
58571
+ .e-step-valid .e-indicator:hover,
58572
+ .e-step-valid .e-step:hover {
58573
+ color: $step-hover-text-color;
58574
+ background: $step-valid-completed-bg-color;
58682
58575
  }
58683
- &.e-step-error.e-step-selected:not(.e-step-text-only):not(.e-step-label-only) .e-indicator:active,
58684
- &.e-step-error.e-step-selected:not(.e-step-text-only):not(.e-step-label-only) .e-step:active {
58685
- background: $step-error-completed-bg-color !important; /* stylelint-disable-line declaration-no-important */
58576
+ .e-step-error .e-indicator:hover,
58577
+ .e-step-error .e-step:hover {
58578
+ color: $step-hover-text-color;
58579
+ background: $step-error-completed-bg-color;
58686
58580
  }
58687
58581
  }
58688
58582
  }
@@ -81430,7 +81324,7 @@ margin: $grid-group-animator-cell-margin;
81430
81324
  text-align: left;
81431
81325
  }
81432
81326
 
81433
- &.e-default table th:not([rowspan = '1']):not(.e-detailcell,.e-detailindentcell,.e-stackedheadercell) {
81327
+ &.e-default table th:not([rowspan = '1']):not(.e-detailcell,.e-detailindentcell,.e-stackedheadercell,.e-detailheadercell,.e-rowdragheader) {
81434
81328
  border-width: $grid-headercell-both-border-width;
81435
81329
  }
81436
81330
 
@@ -81456,7 +81350,7 @@ margin: $grid-group-animator-cell-margin;
81456
81350
  border-right-width: 1px;
81457
81351
  }
81458
81352
 
81459
- &.e-rtl.e-default table th:not([rowspan = '1']):not(.e-detailcell,.e-detailindentcell,.e-stackedheadercell) {
81353
+ &.e-rtl.e-default table th:not([rowspan = '1']):not(.e-detailcell,.e-detailindentcell,.e-stackedheadercell,.e-detailheadercell,.e-rowdragheader) {
81460
81354
  border-width: $grid-rtl-headercell-both-border-width;
81461
81355
  }
81462
81356
 
@@ -83341,6 +83235,14 @@ margin: $grid-group-animator-cell-margin;
83341
83235
  border-top: 1px solid $grid-header-border-color;
83342
83236
  }
83343
83237
 
83238
+ .e-gridcontent table tbody tr:first-child .e-normaledit .e-dragindentcell {
83239
+ border-top: 0 solid $grid-header-border-color;
83240
+ }
83241
+
83242
+ .e-detailrow .e-grid.e-default .e-normaledit .e-lastrowcell {
83243
+ border-bottom: 0;
83244
+ }
83245
+
83344
83246
  .e-ccdlg {
83345
83247
  .e-footer-content {
83346
83248
  border-color: $grid-columnchooser-footer-border-color;
@@ -88024,7 +87926,7 @@ $btn-grp-outline-focus-danger-color: inherit !default;
88024
87926
 
88025
87927
  //Focus state for Normal and Outline GroupButton
88026
87928
  .e-btn:focus,
88027
- input:focus+label.e-btn {
87929
+ input:focus-visible+label.e-btn {
88028
87930
  @include button-focus;
88029
87931
  @if $skin-name != 'bootstrap5' and $skin-name != 'bootstrap4' and $skin-name != 'tailwind' {
88030
87932
  box-shadow: none;