@syncfusion/ej2-navigations 24.2.8 → 25.1.37

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 (133) hide show
  1. package/CHANGELOG.md +9 -34
  2. package/dist/ej2-navigations.min.js +2 -2
  3. package/dist/ej2-navigations.umd.min.js +2 -2
  4. package/dist/ej2-navigations.umd.min.js.map +1 -1
  5. package/dist/es6/ej2-navigations.es2015.js +165 -137
  6. package/dist/es6/ej2-navigations.es2015.js.map +1 -1
  7. package/dist/es6/ej2-navigations.es5.js +165 -137
  8. package/dist/es6/ej2-navigations.es5.js.map +1 -1
  9. package/dist/global/ej2-navigations.min.js +2 -2
  10. package/dist/global/ej2-navigations.min.js.map +1 -1
  11. package/dist/global/index.d.ts +1 -1
  12. package/package.json +12 -12
  13. package/src/accordion/accordion-model.d.ts +3 -2
  14. package/src/accordion/accordion.d.ts +3 -2
  15. package/src/accordion/accordion.js +7 -7
  16. package/src/breadcrumb/breadcrumb.js +2 -1
  17. package/src/common/menu-base-model.d.ts +3 -2
  18. package/src/common/menu-base.d.ts +3 -2
  19. package/src/common/menu-base.js +101 -101
  20. package/src/menu/menu-model.d.ts +3 -2
  21. package/src/menu/menu.d.ts +3 -2
  22. package/src/menu/menu.js +1 -1
  23. package/src/stepper/stepper.js +1 -2
  24. package/src/tab/tab-model.d.ts +7 -21
  25. package/src/tab/tab.d.ts +7 -21
  26. package/src/tab/tab.js +5 -5
  27. package/src/toolbar/toolbar.d.ts +1 -0
  28. package/src/toolbar/toolbar.js +35 -13
  29. package/src/treeview/treeview-model.d.ts +4 -7
  30. package/src/treeview/treeview.d.ts +3 -3
  31. package/src/treeview/treeview.js +15 -9
  32. package/styles/accordion/_bds-definition.scss +180 -0
  33. package/styles/accordion/_material-definition.scss +1 -1
  34. package/styles/accordion/icons/_bds.scss +17 -0
  35. package/styles/accordion/material.css +1 -1
  36. package/styles/appbar/_bds-definition.scss +27 -0
  37. package/styles/bootstrap-dark.css +12 -4
  38. package/styles/bootstrap.css +12 -4
  39. package/styles/bootstrap4.css +12 -4
  40. package/styles/bootstrap5-dark.css +12 -4
  41. package/styles/bootstrap5.css +12 -4
  42. package/styles/breadcrumb/_bds-definition.scss +60 -0
  43. package/styles/breadcrumb/icons/_bds.scss +25 -0
  44. package/styles/carousel/_bds-definition.scss +27 -0
  45. package/styles/carousel/_layout.scss +5 -0
  46. package/styles/carousel/bootstrap-dark.css +6 -0
  47. package/styles/carousel/bootstrap.css +6 -0
  48. package/styles/carousel/bootstrap4.css +6 -0
  49. package/styles/carousel/bootstrap5-dark.css +6 -0
  50. package/styles/carousel/bootstrap5.css +6 -0
  51. package/styles/carousel/fabric-dark.css +6 -0
  52. package/styles/carousel/fabric.css +6 -0
  53. package/styles/carousel/fluent-dark.css +6 -0
  54. package/styles/carousel/fluent.css +6 -0
  55. package/styles/carousel/highcontrast-light.css +6 -0
  56. package/styles/carousel/highcontrast.css +6 -0
  57. package/styles/carousel/icons/_bds.scss +30 -0
  58. package/styles/carousel/material-dark.css +6 -0
  59. package/styles/carousel/material.css +6 -0
  60. package/styles/carousel/material3-dark.css +6 -0
  61. package/styles/carousel/material3.css +6 -0
  62. package/styles/carousel/tailwind-dark.css +6 -0
  63. package/styles/carousel/tailwind.css +6 -0
  64. package/styles/context-menu/_bds-definition.scss +65 -0
  65. package/styles/context-menu/icons/_bds.scss +33 -0
  66. package/styles/fabric-dark.css +12 -4
  67. package/styles/fabric.css +12 -4
  68. package/styles/fluent-dark.css +12 -4
  69. package/styles/fluent.css +12 -4
  70. package/styles/h-scroll/_bds-definition.scss +83 -0
  71. package/styles/h-scroll/icons/_bds.scss +49 -0
  72. package/styles/highcontrast-light.css +12 -4
  73. package/styles/highcontrast.css +12 -4
  74. package/styles/material-dark.css +12 -4
  75. package/styles/material.css +13 -5
  76. package/styles/material3-dark.css +12 -4
  77. package/styles/material3.css +12 -4
  78. package/styles/menu/_bds-definition.scss +66 -0
  79. package/styles/menu/icons/_bds.scss +134 -0
  80. package/styles/pager/_bds-definition.scss +152 -0
  81. package/styles/pager/icons/_bds.scss +50 -0
  82. package/styles/sidebar/_bds-definition.scss +45 -0
  83. package/styles/stepper/_bds-definition.scss +79 -0
  84. package/styles/stepper/_layout.scss +1 -0
  85. package/styles/stepper/bootstrap-dark.css +3 -0
  86. package/styles/stepper/bootstrap.css +3 -0
  87. package/styles/stepper/bootstrap4.css +3 -0
  88. package/styles/stepper/bootstrap5-dark.css +3 -0
  89. package/styles/stepper/bootstrap5.css +3 -0
  90. package/styles/stepper/fabric-dark.css +3 -0
  91. package/styles/stepper/fabric.css +3 -0
  92. package/styles/stepper/fluent-dark.css +3 -0
  93. package/styles/stepper/fluent.css +3 -0
  94. package/styles/stepper/highcontrast-light.css +3 -0
  95. package/styles/stepper/highcontrast.css +3 -0
  96. package/styles/stepper/icons/_bds.scss +5 -0
  97. package/styles/stepper/material-dark.css +3 -0
  98. package/styles/stepper/material.css +3 -0
  99. package/styles/stepper/material3-dark.css +3 -0
  100. package/styles/stepper/material3.css +3 -0
  101. package/styles/stepper/tailwind-dark.css +3 -0
  102. package/styles/stepper/tailwind.css +3 -0
  103. package/styles/tab/_bds-definition.scss +701 -0
  104. package/styles/tab/icons/_bds.scss +92 -0
  105. package/styles/tailwind-dark.css +14 -6
  106. package/styles/tailwind.css +12 -4
  107. package/styles/toolbar/_bds-definition.scss +215 -0
  108. package/styles/toolbar/_layout.scss +6 -7
  109. package/styles/toolbar/bootstrap-dark.css +3 -4
  110. package/styles/toolbar/bootstrap.css +3 -4
  111. package/styles/toolbar/bootstrap4.css +3 -4
  112. package/styles/toolbar/bootstrap5-dark.css +3 -4
  113. package/styles/toolbar/bootstrap5.css +3 -4
  114. package/styles/toolbar/fabric-dark.css +3 -4
  115. package/styles/toolbar/fabric.css +3 -4
  116. package/styles/toolbar/fluent-dark.css +3 -4
  117. package/styles/toolbar/fluent.css +3 -4
  118. package/styles/toolbar/highcontrast-light.css +3 -4
  119. package/styles/toolbar/highcontrast.css +3 -4
  120. package/styles/toolbar/icons/_bds.scss +16 -0
  121. package/styles/toolbar/material-dark.css +3 -4
  122. package/styles/toolbar/material.css +3 -4
  123. package/styles/toolbar/material3-dark.css +3 -4
  124. package/styles/toolbar/material3.css +3 -4
  125. package/styles/toolbar/tailwind-dark.css +3 -4
  126. package/styles/toolbar/tailwind.css +3 -4
  127. package/styles/treeview/_bds-definition.scss +132 -0
  128. package/styles/treeview/_tailwind-definition.scss +1 -1
  129. package/styles/treeview/_theme.scss +1 -1
  130. package/styles/treeview/icons/_bds.scss +43 -0
  131. package/styles/treeview/tailwind-dark.css +2 -2
  132. package/styles/v-scroll/_bds-definition.scss +49 -0
  133. package/styles/v-scroll/icons/_bds.scss +27 -0
@@ -0,0 +1,134 @@
1
+ @include export-module('menu-bds-icons') {
2
+
3
+ /*! menu layout */
4
+ .e-menu-wrapper,
5
+ .e-menu-container {
6
+ @at-root {
7
+ & ul {
8
+ &.e-vertical .e-menu-item {
9
+ & .e-caret {
10
+ &::before {
11
+ content: '\e748';
12
+ }
13
+ }
14
+ }
15
+
16
+ & .e-menu-item {
17
+ & .e-caret {
18
+ &::before {
19
+ content: '\e729';
20
+ }
21
+ }
22
+ }
23
+ }
24
+
25
+ & .e-ul .e-menu-item {
26
+ & .e-caret {
27
+ &::before {
28
+ content: '\e748';
29
+ }
30
+ }
31
+ }
32
+ }
33
+
34
+ &.e-hamburger {
35
+
36
+ & .e-menu-header {
37
+
38
+ & .e-menu-icon::before {
39
+ content: '\e799';
40
+ }
41
+ }
42
+
43
+ &.e-close-icon {
44
+ & .e-menu-header {
45
+
46
+ & .e-menu-icon::before {
47
+ content: '\e7e7';
48
+ }
49
+ }
50
+ }
51
+
52
+ & .e-vertical .e-menu-item .e-caret,
53
+ & .e-menu-item .e-caret {
54
+ &::before {
55
+ content: '\e729';
56
+ }
57
+ }
58
+ }
59
+
60
+ &.e-rtl.e-hamburger ul {
61
+ &.e-ul {
62
+ & .e-caret {
63
+ &::before {
64
+ content: '\e729';
65
+ }
66
+ }
67
+ }
68
+ }
69
+
70
+ & .e-menu-hscroll.e-hscroll .e-nav-left-arrow::before,
71
+ & .e-menu-hscroll.e-hscroll .e-nav-right-arrow::before {
72
+ content: '\e748';
73
+ }
74
+
75
+ & .e-menu-vscroll.e-vscroll .e-nav-up-arrow::before,
76
+ & .e-menu-vscroll.e-vscroll .e-nav-down-arrow::before {
77
+ content: '\e729';
78
+ }
79
+ }
80
+
81
+ .e-rtl.e-menu-wrapper ul,
82
+ .e-rtl.e-menu-container ul {
83
+ &.e-vertical {
84
+ & .e-caret {
85
+ &::before {
86
+ content: '\e765';
87
+ }
88
+ }
89
+ }
90
+
91
+ &.e-ul {
92
+ & .e-caret {
93
+ &::before {
94
+ content: '\e765';
95
+ }
96
+ }
97
+ }
98
+ }
99
+
100
+ .e-bigger .e-rtl.e-menu-wrapper ul,
101
+ .e-bigger.e-rtl.e-menu-wrapper ul,
102
+ .e-bigger .e-rtl.e-menu-container ul,
103
+ .e-bigger.e-rtl.e-menu-container ul {
104
+ &.e-vertical {
105
+ & .e-caret {
106
+ &::before {
107
+ content: '\e765';
108
+ }
109
+ }
110
+ }
111
+
112
+ &.e-ul {
113
+ & .e-caret {
114
+ &::before {
115
+ content: '\e765';
116
+ }
117
+ }
118
+ }
119
+ }
120
+
121
+ .e-bigger .e-rtl.e-menu-wrapper.e-hamburger ul,
122
+ .e-bigger.e-rtl.e-menu-wrapper.e-hamburger ul,
123
+ .e-bigger .e-rtl.e-menu-container.e-hamburger ul,
124
+ .e-bigger.e-rtl.e-menu-container.e-hamburger ul {
125
+
126
+ &.e-ul {
127
+ & .e-caret {
128
+ &::before {
129
+ content: '\e729';
130
+ }
131
+ }
132
+ }
133
+ }
134
+ }
@@ -0,0 +1,152 @@
1
+ @use 'sass:math';
2
+
3
+ $pager-numericitem-border-radius: 0 !default;
4
+ $pager-border-type: solid !default;
5
+ $pager-mobile-icon-size: 11px !default;
6
+ $pager-icon-width: 'auto' !default;
7
+ $pager-icon-height: 'auto' !default;
8
+ $pager-navigationicon-padding: 11px 9px 8px !default;
9
+ $pager-navigationicon-right: 0 !default;
10
+ $pager-navigationicon-top: -4px !default;
11
+ $pager-numericitem-margin-right: 0 !default;
12
+ $pager-messagebar-padding-bottom: 0 !default;
13
+ $pager-bigger-messagebar-padding-bottom: 8px !default;
14
+ $pager-content-opacity: 1 !default;
15
+ $pager-bigger-new-container-rtl-margin: 0 5px -6px 0 !default;
16
+ $pager-next-icon-margin-left: 0 !default;
17
+ $pager-container-rtl-margin: 0 0 -4px 0 !default;
18
+ $pager-rtl-navigation-icon-padding: 7.5px 7px 7.5px 7px !default;
19
+ $pager-rtl-numeric-margin: 0 !default;
20
+ $pager-item-hover-borders-width: 0 !default;
21
+ $pager-tripledot-font-size: 12px !default;
22
+ $pager-last-page-hover-border-radius: 0 8px 8px 0 !default;
23
+ $pager-first-page-hover-border-radius: 8px 0 0 8px !default;
24
+ $pager-rtl-parentmsgbar-margin-left: 6px !default;
25
+ $pager-rtl-parentmsgbar-padding-top: 6px !default;
26
+ $pager-bigger-nexticon-marign-left: math.div($pager-next-icon-margin-left, .75) !default;
27
+ $pager-bigger-current-item-border-radius: math.div($pager-numericitem-border-radius, .75) !default;
28
+ $pager-bigger-rtl-nexticon-marign-left: 0 !default;
29
+ $pager-bigger-rtl-nexticon-marign-right: math.div($pager-next-icon-margin-left, .75) !default;
30
+ $pager-device-padding: 19px 0 !default;
31
+ $pager-device-messabar-padding: 0 !default;
32
+ $pager-bigger-rtl-parentmsgbar-margin-left: 6px !default;
33
+ $pager-bigger-rtl-activeitem-padding: 7px 14px 7px 14px !default;
34
+ $pager-numericitem-min-width: 26px !default;
35
+ $pager-font-size: 14px !default;
36
+ $pager-font-line-height: 18px !default;
37
+ $pager-numeric-font-line-height: $pager-font-line-height !default;
38
+ $pager-bg-color: $content-bg-color !default;
39
+ $pager-border-color: $border-light !default;
40
+ $pager-color: $content-text-color-alt1 !default;
41
+ $pager-icon-size: 12px !default;
42
+ $pager-border-size: 1px !default;
43
+ $pager-numericitem-padding: 13px 12px 10px 12px !default;
44
+ $pager-numeric-hover-bg-color: $content-bg-color-hover !default;
45
+ $pager-numeric-txt-bg-color: $icon-color-disabled !default;
46
+ $pager-padding: 8px 8px 8px 8px !default;
47
+ $pager-numeric-font-weight: bold !default;
48
+ $pager-messagebar-padding-top: 6px !default;
49
+ $pager-number-hover-bg-color: $content-bg-color-hover !default;
50
+ $pager-font-family: $font-family !default;
51
+ $pager-font-weight: bold !default;
52
+ $pager-messagebar-padding-right: 0 !default;
53
+ $pager-tripledot-padding: 4.5px 9.2px 7px 9.2px !default;
54
+ $pager-numeric-icon-padding: 4.5px 11px 7px 11px !default;
55
+ $pager-pagecontainer-icon-padding: 10px 7px 10px 7px !default;
56
+ $pager-bigger-pagecontainer-icon-padding: 6px 10px 8px 8px !default;
57
+ $pager-hover-color: $content-text-color-hover !default;
58
+ $pager-mhover-color: $border !default;
59
+ $pager-pagermessage-weight: $font-weight-normal !default;
60
+ $pager-active-color: $content-text-color !default;
61
+ $pager-active-bg-color: $content-bg-color-selected !default;
62
+ $pager-last-border-size: 1px !default;
63
+ $page-content-color: $content-text-color-alt1 !default;
64
+ $pager-container-margin: 0 0 -4px !default;
65
+ $pager-bigger-numeric-item-margin: 0 !default;
66
+ $pager-bigger-icon-font-size: 16px !default;
67
+ $pager-bigger-font-size: $text-sm !default;
68
+ $pager-bigger-padding: 12px !default;
69
+ $pager-bigger-pagercontainer-margin: 0 0 -6px 0 !default;
70
+ $pager-bigger-pagercontainer-icons-padding: 10px 10px 11px !default;
71
+ $pager-bigger-pagercontainer-icons-marign-right: 0 !default;
72
+ $pager-bigger-current-item-padding: 7px 14px 6.5px !default;
73
+ $pager-letter-spacing: 0 !default;
74
+ $pager-bigger-icons-align: middle !default;
75
+ $pager-bigger-messagebar-padding-right: 0 !default;
76
+ $pager-bigger-messagebar-padding-top: 8px !default;
77
+ $pager-last-content-icon: 'e235' !default;
78
+ $pager-next-content-icon: 'e236' !default;
79
+ $pager-prev-content-icon: 'e237' !default;
80
+ $pager-first-content-icon: 'e238' !default;
81
+ $pager-icon-color: $icon-color !default;
82
+ $pager-hover-bg-color: $content-bg-color-hover !default;
83
+ $pager-dropdown-margin-top: -18px !default;
84
+ $pager-dropdown-margin-left: 10px !default;
85
+ $pager-dropdown-margin-right: 8px !default;
86
+ $pager-dropdown-overflow: unset !default;
87
+ $pager-bigger-dropdown-constant-margin: 1px !default;
88
+ $pager-bigger-dropdown-margin: -35px 10px 0 18px !default;
89
+ $pager-dropdown-height: 32px !default;
90
+ $pager-dropdown-width: 90px !default;
91
+ $pager-bigger-dropdown-width: 90px !default;
92
+ $pager-constant-margin: 6px 0 4px 8px !default;
93
+ $pager-bigger-letter-spacing: 7px 11.8px 6.5px !default;
94
+ $pager-tripledot-rtl-margin-top: 0 !default;
95
+ $pager-tripledot-rtl-padding: 4.5px 8.7px 5px 8.7px !default;
96
+ $pager-rtl-pagerconstant-margin-top: 6px 8px 3px 8px !default;
97
+ $pager-rtl-pagerdropdown-margin: -18px 16px 0 0 !default;
98
+ $pager-tripledot-rtl-bigger-margin-top: 0 !default;
99
+ $pager-bigger-rtl-numeric-margin: 0 !default;
100
+ $pager-bigger-container-rtl-margin: 0 0 -4px 0 !default;
101
+ $pager-activeitem-padding: 4.5px 11px 7px 11px !default;
102
+ $pager-bigger-activeitem-padding: 7px 14px !default;
103
+ $pager-rtl-pagerdropdown-bigger-margin: -18.5px 16px 0 0 !default;
104
+ $pager-rtl-pagerconstant-bigger-margin-top: 6px 16px 2px 0 !default;
105
+ $pager-bigger-rtl-parentmsgbar-margin-top: 0 !default;
106
+ $pager-bigger-rtl-pagercontainer-margin-top: 5px !default;
107
+ $pager-bigger-device-rtl-parentmsgbar-margin-top: 5px !default;
108
+ $pager-rtl-pagermsgbar-device-margin-top: 10px !default;
109
+ $pager-bigger-constant-margin-left: 16px !default;
110
+ $pager-rtl-last-content-icon: 'e238' !default;
111
+ $pager-rtl-first-content-icon: 'e235' !default;
112
+ $pager-rtl-prev-content-icon: 'e236' !default;
113
+ $pager-rtl-next-content-icon: 'e237' !default;
114
+ $pager-rtl-first-last-icon-hover-border-radius: 0 6px 6px 0 !default;
115
+ $pager-item-hover-border-width: 0 1px 0 0 !default;
116
+ $pager-item-hover-border-color: $pager-border-color !default;
117
+ $pager-bigger-current-item-hover-padding: $pager-bigger-current-item-padding !default;
118
+ $pager-numeric-icon-hover-padding: $pager-numeric-icon-padding !default;
119
+ $pager-bigger-rtl-activeitem-hover-padding: $pager-bigger-rtl-activeitem-padding !default;
120
+ $pager-activeitem-hover-padding: $pager-activeitem-padding !default;
121
+ $pager-bigger-dropdown-margin-top: -18.5px !default;
122
+ $pager-rtl-nxtpage-margin: 0 !default;
123
+ $pager-disabled-icons-opacity: 1 !default;
124
+ $pager-current-item-font-weight: $font-weight-medium !default;
125
+ $pager-bigger-dropdown-heigh: 38px !default;
126
+ $pager-external-msg-padding: 6px !default;
127
+ $pager-rtl-bigger-tripledot-font-size: $pager-tripledot-font-size !default;
128
+ $pager-current-item-font-weight: normal !default;
129
+ $pager-skin: $skin-name !default;
130
+ $pager-container-border-radius: 6px !default;
131
+ $pager-bigger-tripledot-font-size: 14px !default;
132
+ $pager-focus-bg-color: $content-bg-color-hover !default;
133
+ $pager-focus-tripledot-padding: 4.5px 8.7px 7px 8.7px !default;
134
+ $pager-focus-tripledot-line-height: 18px !default;
135
+ $pager-focus-active-box-shadow: none !default;
136
+ $pager-focus-shadow: 0 0 0 .5px $border inset !default;
137
+ $pager-bigger-adaptive-pagermsgbar-margin-top: -2px !default;
138
+ $pager-bigger-adaptive-dropdown-margin: 0 2px 0 4px !default;
139
+ $pager-bigger-adaptive-dropdown-min-width: 90px !default;
140
+ $pager-bigger-adaptive-constant-top: 2px !default;
141
+ $pager-rtl-adaptive-constant-top: -1px 10px 0 8px !default;
142
+ $pager-rtl-e-bigger-adaptive-dropdown-margin: 2px 4px 0 2px !default;
143
+ $pager-rtl-e-bigger-adaptive-pagermsgbar-margin-top: 0 !default;
144
+ $pager-bigger-adaptive-pager-padding: 6px !default;
145
+ $pager-adaptive-pagermsgbar-margin-top: -4px !default;
146
+ $pager-adaptive-dropdown-margin: 2px 2px 0 4px !default;
147
+ $pager-rtl-adaptive-pagermsgbar-margin-top: -5px !default;
148
+ $pager-rtl-adaptive-dropdown-margin: 2px 4px 0 2px !default;
149
+ $pager-adaptive-constant-pagesizeall-top: 10px !default;
150
+ $pager-bigger-adaptive-constant-pagesizeall-top: 9px !default;
151
+ $pager-rtl-adaptive-constant-pagesizeall-top: 10px !default;
152
+ $pager-rtl-e-bigger-adaptive-constant-pagesizeall-top: 12px !default;
@@ -0,0 +1,50 @@
1
+ @include export-module('pager-bds-icons') {
2
+
3
+ /* !componenticons */
4
+
5
+ #{&}.e-pager,
6
+ .e-grid-menu {
7
+
8
+ .e-icon-last::before {
9
+ content: '\e7a9';
10
+ }
11
+
12
+ .e-icon-first::before {
13
+ content: '\e744';
14
+ }
15
+
16
+ .e-icon-prev::before {
17
+ content: '\e765';
18
+ }
19
+
20
+ .e-icon-next::before {
21
+ content: '\e748';
22
+ }
23
+
24
+ &.e-rtl {
25
+ & .e-icon-last.e-lastpage::before,
26
+ & .e-icon-last.e-lastpage:hover,
27
+ & .e-icon-last.e-lastpagedisabled::before {
28
+ content: '\e744';
29
+ }
30
+
31
+ & .e-icon-first.e-firstpage::before,
32
+ & .e-icon-first.e-firstpage:hover,
33
+ & .e-icon-first.e-firstpagedisabled::before {
34
+ content: '\e7a9';
35
+ }
36
+
37
+ & .e-icon-prev.e-prevpage::before,
38
+ & .e-icon-prev.e-prevpage:hover,
39
+ & .e-icon-prev.e-prevpagedisabled::before {
40
+ content: '\e748';
41
+ }
42
+
43
+ & .e-icon-next.e-nextpage::before,
44
+ & .e-icon-next.e-nextpage:hover,
45
+ & .e-icon-next.e-nextpagedisabled::before {
46
+ content: '\e765';
47
+ }
48
+ }
49
+ }
50
+ }
@@ -0,0 +1,45 @@
1
+ $sidebar-box-shadow: $shadow-none !default;
2
+
3
+ //color variables
4
+ $sidebar-background: $content-bg-color !default;
5
+ $sidebar-border: $border-light !default;
6
+ $sidebar-overlay: $overlay-bg-color !default;
7
+
8
+ .e-sidebar {
9
+ /* stylelint-disable property-no-vendor-prefix */
10
+ -webkit-tap-highlight-color: transparent;
11
+ background: $sidebar-background;
12
+ height: 100%;
13
+ overflow: auto;
14
+ position: fixed;
15
+ top: 0;
16
+ transition: none;
17
+ vertical-align: middle;
18
+ visibility: hidden;
19
+ will-change: transform;
20
+
21
+ /* stylelint-disable */
22
+ &.e-right {
23
+ @if ($skin-name == 'tailwind') {
24
+ border-left: 1px solid $sidebar-border !important;
25
+ }
26
+ @else {
27
+ border-left: 1px solid $sidebar-border;
28
+ }
29
+ left: auto;
30
+ right: 0;
31
+ top: 0;
32
+ }
33
+
34
+ &.e-left {
35
+ @if ($skin-name == 'tailwind') {
36
+ border-right: 1px solid $sidebar-border !important;
37
+ }
38
+ @else {
39
+ border-right: 1px solid $sidebar-border;
40
+ }
41
+ left: 0;
42
+ right: auto;
43
+ top: 0;
44
+ }
45
+ }
@@ -0,0 +1,79 @@
1
+ $stepper-ol-padding: 0 !default;
2
+ $stepper-step-radius: 9999px !default;
3
+ $stepper-step-width: 32px !default;
4
+ $stepper-icon-size: 16px !default;
5
+ $stepper-progress-bar-height: 1.6px !default;
6
+ $stepper-progress-value-height: 100% !default;
7
+ $stepper-progress-position: 50% !default;
8
+ $stepper-temp-outline-width: 2px solid !default;
9
+ $stepper-label-top: 1em !default;
10
+ $stepper-label-bottom: 4.5em !default;
11
+ $stepper-label-position: 2.5em !default;
12
+ $stepper-validation-position: .25em !default;
13
+ $stepper-text-padding: 0 6px !default;
14
+ $stepper-icon-text-padding: 0 8px !default;
15
+ $stepper-text-vert-padding: 6px 0 !default;
16
+ $stepper-text-radius: 15px !default;
17
+ $stepper-text-block: 5px !default;
18
+ $stepper-optional-top: 2em !default;
19
+ $stepper-label-optional: 3em !default;
20
+ $stepper-top-label-optional: 3.5em !default;
21
+ $stepper-text-postion: 10px !default;
22
+ $stepper-icon-padding: 0 3px 0 4px !default;
23
+ $stepper-optional-size: 12px !default;
24
+ $step-border: 2px solid !default;
25
+ $stepper-label-order: -1 !default;
26
+ $stepper-font-weight: 600 !default;
27
+ $stepper-text-size: 14px !default;
28
+ $stepper-tooltip-tip-bottom-height: 8px !default;
29
+
30
+ $stepper-small-step-width: 28px !default;
31
+ $stepper-small-icon-size: 14px !default;
32
+ $stepper-small-optional-size: 10px !default;
33
+ $stepper-small-text-size: 12px !default;
34
+
35
+ $stepper-bigger-step-width: 40px !default;
36
+ $stepper-bigger-icon-size: 18px !default;
37
+ $stepper-bigger-optional-size: 14px !default;
38
+ $stepper-bigger-text-size: 16px !default;
39
+
40
+ $stepper-bigger-small-step-width: 36px !default;
41
+ $stepper-bigger-small-icon-size: 16px !default;
42
+ $stepper-bigger-small-optional-size: 12px !default;
43
+ $stepper-bigger-small-text-size: 14px !default;
44
+
45
+ $step-selected-li-shadow: 0 0 0 2px $content-bg-color, 0 0 0 4px $primary, 0 0 0 8px $content-bg-color !default;
46
+ $step-keyboard-selected-li-shadow: 0 0 0 2px $content-bg-color, 0 0 0 4px $content-text-color, 0 0 0 8px $content-bg-color !default;
47
+ $step-valid-li-shadow: 0 0 0 2px $content-bg-color, 0 0 0 4px $success-border-color, 0 0 0 8px $content-bg-color !default;
48
+ $step-error-li-shadow: 0 0 0 2px $content-bg-color, 0 0 0 4px $border-error, 0 0 0 8px $content-bg-color !default;
49
+ $step-li-shadow: 0 0 0 8px $content-bg-color !default;
50
+
51
+ $step-border-color: $border !default;
52
+ $step-hover-text-color: $primary-text-color !default;
53
+ $step-hover-not-text-color: $content-text-color-alt2 !default;
54
+ $step-hover-border-color: $border-dark !default;
55
+ $step-active-border-color: $border-dark !default;
56
+ $stepper-outline-color: $content-bg-color !default;
57
+ $step-color: $content-text-color-alt2 !default;
58
+ $step-optional-color: $content-text-color-alt2 !default;
59
+ $step-bg-color: $content-bg-color !default;
60
+ $step-completed-color: $primary-text-color !default;
61
+ $step-completed-bg-color: $primary !default;
62
+ $step-progress-bg-color: $border !default;
63
+ $step-progress-value-bg-color: $primary !default;
64
+ $step-disabled-bg-color: $border-light !default;
65
+ $step-disabled-font-color: $content-text-color-disabled !default;
66
+ $step-disabled-color: $content-text-color-disabled !default;
67
+ $stepper-text-color: $content-text-color !default;
68
+ $step-valid-icon-only-color: $success-border-color !default;
69
+ $step-error-icon-only-color: $border-error !default;
70
+ $step-valid-completed-color: $primary-text-color !default;
71
+ $step-valid-completed-bg-color: $success-border-color !default;
72
+ $step-error-icon-color: $primary-text-color !default;
73
+ $step-error-completed-color: $border-error !default;
74
+ $step-error-completed-bg-color: $border-error !default;
75
+ $step-indicator-color: $content-bg-color !default;
76
+ $step-hover-color: $content-bg-color !default;
77
+ $step-active-color: $content-bg-color !default;
78
+ $step-selected-hover-color: $primary-bg-color-hover !default;
79
+ $step-selected-active-color: $primary-bg-color-pressed !default;
@@ -89,6 +89,7 @@
89
89
  }
90
90
 
91
91
  &.e-horizontal {
92
+ display: block;
92
93
  .e-stepper-steps {
93
94
  flex-direction: row;
94
95
  }
@@ -87,6 +87,9 @@
87
87
  -ms-flex-direction: column;
88
88
  flex-direction: column;
89
89
  }
90
+ .e-stepper.e-horizontal {
91
+ display: block;
92
+ }
90
93
  .e-stepper.e-horizontal .e-stepper-steps {
91
94
  -ms-flex-direction: row;
92
95
  flex-direction: row;
@@ -87,6 +87,9 @@
87
87
  -ms-flex-direction: column;
88
88
  flex-direction: column;
89
89
  }
90
+ .e-stepper.e-horizontal {
91
+ display: block;
92
+ }
90
93
  .e-stepper.e-horizontal .e-stepper-steps {
91
94
  -ms-flex-direction: row;
92
95
  flex-direction: row;
@@ -87,6 +87,9 @@
87
87
  -ms-flex-direction: column;
88
88
  flex-direction: column;
89
89
  }
90
+ .e-stepper.e-horizontal {
91
+ display: block;
92
+ }
90
93
  .e-stepper.e-horizontal .e-stepper-steps {
91
94
  -ms-flex-direction: row;
92
95
  flex-direction: row;
@@ -87,6 +87,9 @@
87
87
  -ms-flex-direction: column;
88
88
  flex-direction: column;
89
89
  }
90
+ .e-stepper.e-horizontal {
91
+ display: block;
92
+ }
90
93
  .e-stepper.e-horizontal .e-stepper-steps {
91
94
  -ms-flex-direction: row;
92
95
  flex-direction: row;
@@ -87,6 +87,9 @@
87
87
  -ms-flex-direction: column;
88
88
  flex-direction: column;
89
89
  }
90
+ .e-stepper.e-horizontal {
91
+ display: block;
92
+ }
90
93
  .e-stepper.e-horizontal .e-stepper-steps {
91
94
  -ms-flex-direction: row;
92
95
  flex-direction: row;
@@ -87,6 +87,9 @@
87
87
  -ms-flex-direction: column;
88
88
  flex-direction: column;
89
89
  }
90
+ .e-stepper.e-horizontal {
91
+ display: block;
92
+ }
90
93
  .e-stepper.e-horizontal .e-stepper-steps {
91
94
  -ms-flex-direction: row;
92
95
  flex-direction: row;
@@ -87,6 +87,9 @@
87
87
  -ms-flex-direction: column;
88
88
  flex-direction: column;
89
89
  }
90
+ .e-stepper.e-horizontal {
91
+ display: block;
92
+ }
90
93
  .e-stepper.e-horizontal .e-stepper-steps {
91
94
  -ms-flex-direction: row;
92
95
  flex-direction: row;
@@ -87,6 +87,9 @@
87
87
  -ms-flex-direction: column;
88
88
  flex-direction: column;
89
89
  }
90
+ .e-stepper.e-horizontal {
91
+ display: block;
92
+ }
90
93
  .e-stepper.e-horizontal .e-stepper-steps {
91
94
  -ms-flex-direction: row;
92
95
  flex-direction: row;
@@ -87,6 +87,9 @@
87
87
  -ms-flex-direction: column;
88
88
  flex-direction: column;
89
89
  }
90
+ .e-stepper.e-horizontal {
91
+ display: block;
92
+ }
90
93
  .e-stepper.e-horizontal .e-stepper-steps {
91
94
  -ms-flex-direction: row;
92
95
  flex-direction: row;
@@ -87,6 +87,9 @@
87
87
  -ms-flex-direction: column;
88
88
  flex-direction: column;
89
89
  }
90
+ .e-stepper.e-horizontal {
91
+ display: block;
92
+ }
90
93
  .e-stepper.e-horizontal .e-stepper-steps {
91
94
  -ms-flex-direction: row;
92
95
  flex-direction: row;
@@ -87,6 +87,9 @@
87
87
  -ms-flex-direction: column;
88
88
  flex-direction: column;
89
89
  }
90
+ .e-stepper.e-horizontal {
91
+ display: block;
92
+ }
90
93
  .e-stepper.e-horizontal .e-stepper-steps {
91
94
  -ms-flex-direction: row;
92
95
  flex-direction: row;
@@ -0,0 +1,5 @@
1
+ @include export-module('stepper-bds-icons') {
2
+ .e-step-indicator::before {
3
+ content: '\e8db';
4
+ }
5
+ }
@@ -87,6 +87,9 @@
87
87
  -ms-flex-direction: column;
88
88
  flex-direction: column;
89
89
  }
90
+ .e-stepper.e-horizontal {
91
+ display: block;
92
+ }
90
93
  .e-stepper.e-horizontal .e-stepper-steps {
91
94
  -ms-flex-direction: row;
92
95
  flex-direction: row;
@@ -87,6 +87,9 @@
87
87
  -ms-flex-direction: column;
88
88
  flex-direction: column;
89
89
  }
90
+ .e-stepper.e-horizontal {
91
+ display: block;
92
+ }
90
93
  .e-stepper.e-horizontal .e-stepper-steps {
91
94
  -ms-flex-direction: row;
92
95
  flex-direction: row;
@@ -142,6 +142,9 @@
142
142
  -ms-flex-direction: column;
143
143
  flex-direction: column;
144
144
  }
145
+ .e-stepper.e-horizontal {
146
+ display: block;
147
+ }
145
148
  .e-stepper.e-horizontal .e-stepper-steps {
146
149
  -ms-flex-direction: row;
147
150
  flex-direction: row;
@@ -198,6 +198,9 @@
198
198
  -ms-flex-direction: column;
199
199
  flex-direction: column;
200
200
  }
201
+ .e-stepper.e-horizontal {
202
+ display: block;
203
+ }
201
204
  .e-stepper.e-horizontal .e-stepper-steps {
202
205
  -ms-flex-direction: row;
203
206
  flex-direction: row;
@@ -87,6 +87,9 @@
87
87
  -ms-flex-direction: column;
88
88
  flex-direction: column;
89
89
  }
90
+ .e-stepper.e-horizontal {
91
+ display: block;
92
+ }
90
93
  .e-stepper.e-horizontal .e-stepper-steps {
91
94
  -ms-flex-direction: row;
92
95
  flex-direction: row;
@@ -87,6 +87,9 @@
87
87
  -ms-flex-direction: column;
88
88
  flex-direction: column;
89
89
  }
90
+ .e-stepper.e-horizontal {
91
+ display: block;
92
+ }
90
93
  .e-stepper.e-horizontal .e-stepper-steps {
91
94
  -ms-flex-direction: row;
92
95
  flex-direction: row;