@steroidsjs/bootstrap 3.0.0-beta.86 → 3.0.0-beta.87

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 (67) hide show
  1. package/content/Accordion/AccordionItemView.scss +6 -6
  2. package/content/Alert/AlertView.scss +15 -15
  3. package/content/Avatar/AvatarView.scss +11 -11
  4. package/content/Badge/BadgeView.scss +20 -20
  5. package/content/Calendar/CalendarView.scss +24 -24
  6. package/content/Calendar/CaptionElement.scss +12 -12
  7. package/content/Card/CardView.scss +10 -10
  8. package/content/Detail/DetailView.scss +12 -12
  9. package/content/DropDown/DropDownView.scss +3 -3
  10. package/content/Menu/MenuItemView.scss +4 -4
  11. package/content/Menu/MenuView.scss +3 -3
  12. package/form/AutoCompleteField/AutoCompleteFieldView.scss +34 -34
  13. package/form/Button/ButtonView.scss +24 -24
  14. package/form/CheckboxField/CheckboxFieldView.scss +24 -24
  15. package/form/DateField/DateFieldView.scss +2 -2
  16. package/form/DateRangeField/DateRangeFieldView.scss +2 -2
  17. package/form/DateTimeField/DateTimeFieldView.scss +2 -2
  18. package/form/DateTimeRangeField/DateTimeRangeFieldView.scss +2 -2
  19. package/form/DropDownField/DropDownFieldView.scss +44 -44
  20. package/form/DropDownFieldItem/DropDownFieldItemView.scss +12 -12
  21. package/form/FieldLayout/FieldLayoutView.scss +26 -26
  22. package/form/FieldList/FieldListItemView.scss +2 -2
  23. package/form/FieldList/FieldListView.scss +9 -9
  24. package/form/FieldSet/FieldSetView.scss +2 -2
  25. package/form/FileField/FileFieldItemView.scss +17 -17
  26. package/form/FileField/FileFieldView.scss +2 -2
  27. package/form/ImageField/ImageFieldView.scss +2 -2
  28. package/form/InputField/InputFieldView.scss +32 -32
  29. package/form/NumberField/NumberFieldView.scss +22 -22
  30. package/form/PasswordField/PasswordFieldView.scss +21 -21
  31. package/form/RadioField/RadioFieldView.scss +25 -25
  32. package/form/RateField/RateFieldView.scss +9 -9
  33. package/form/SliderField/SliderFieldView.scss +16 -16
  34. package/form/SwitcherField/SwitcherFieldView.scss +18 -18
  35. package/form/TextField/TextFieldView.scss +21 -21
  36. package/form/TimeField/TimeFieldView.scss +2 -2
  37. package/form/TimeField/TimePanelView.scss +11 -11
  38. package/form/TimeRangeField/TimeRangeFieldView.scss +2 -2
  39. package/layout/Header/HeaderView.scss +14 -14
  40. package/layout/Loader/LoaderView.scss +2 -2
  41. package/layout/ProgressBar/CircleProgressBarView.scss +8 -8
  42. package/layout/ProgressBar/LineProgressBarView.scss +9 -9
  43. package/layout/Sidebar/FooterIcons/FooterIcons.scss +1 -1
  44. package/layout/Sidebar/SidebarLogo/SidebarLogo.scss +7 -7
  45. package/layout/Sidebar/SidebarUser/SidebarUser.scss +5 -5
  46. package/layout/Sidebar/SidebarView.scss +8 -8
  47. package/layout/Skeleton/SkeletonView.scss +6 -6
  48. package/layout/Tooltip/TooltipView.scss +2 -2
  49. package/list/Empty/EmptyView.scss +2 -2
  50. package/list/FlexGrid/FlexGridView.scss +4 -4
  51. package/list/Grid/GridView.scss +14 -14
  52. package/list/Grid/views/ContentColumnView/ContentColumnView.scss +8 -8
  53. package/list/Grid/views/DiagramColumnView/DiagramColumnView.scss +12 -12
  54. package/list/List/ListView.scss +2 -2
  55. package/list/Pagination/PaginationButtonView.scss +14 -14
  56. package/list/Steps/StepItemView.scss +13 -13
  57. package/list/Steps/StepsView.scss +2 -2
  58. package/modal/Modal/ModalView.scss +12 -12
  59. package/nav/Breadcrubms/BreadcrumbsView.scss +5 -5
  60. package/nav/ButtonGroup/ButtonGroupView.scss +4 -4
  61. package/nav/Nav/NavBarView.scss +4 -4
  62. package/nav/Nav/NavIconView.scss +5 -5
  63. package/nav/Nav/NavTabsView.scss +8 -8
  64. package/nav/Tree/TreeView.scss +6 -6
  65. package/package.json +1 -1
  66. package/typography/Text/TextView.scss +4 -4
  67. package/typography/Title/TitleView.scss +4 -4
package/layout/Sidebar/SidebarLogo/SidebarLogo.scss CHANGED
@@ -1,11 +1,11 @@
1
- @use "../../../scss/variables" as vars;
1
+ @use "../../../scss/variables";
2
2
 
3
3
  .SidebarLogo {
4
4
  padding: 19px 12px 8px 12px;
5
5
  display: flex;
6
6
  flex-flow: row nowrap;
7
7
  justify-content: space-between;
8
- border-bottom: 1px solid vars.$element-border-color;
8
+ border-bottom: 1px solid variables.$element-border-color;
9
9
 
10
10
  &__left {
11
11
  display: flex;
@@ -18,10 +18,10 @@
18
18
  }
19
19
 
20
20
  &__label {
21
- font-size: vars.$font-size-base;
22
- font-weight: vars.$font-weight-lg;
23
- line-height: vars.$line-height-base;
24
- color: vars.$sidebar-label-color;
21
+ font-size: variables.$font-size-base;
22
+ font-weight: variables.$font-weight-lg;
23
+ line-height: variables.$line-height-base;
24
+ color: variables.$sidebar-label-color;
25
25
  opacity: 0;
26
26
  transition: opacity 150ms ease-in-out;
27
27
 
@@ -46,7 +46,7 @@
46
46
  transition: opacity 150ms ease-in-out;
47
47
 
48
48
  svg path, rect, circle {
49
- stroke: vars.$icon-color;
49
+ stroke: variables.$icon-color;
50
50
  }
51
51
  }
52
52
  }
package/layout/Sidebar/SidebarUser/SidebarUser.scss CHANGED
@@ -1,4 +1,4 @@
1
- @use "style/variables" as vars;
1
+ @use "style/variables";
2
2
 
3
3
  .SidebarUser {
4
4
  display: flex;
@@ -23,10 +23,10 @@
23
23
  &__name {
24
24
  width: 128px;
25
25
 
26
- font-size: vars.$font-size-sm;
27
- font-weight: vars.$font-weight-sm;
28
- line-height: vars.$line-height-sm;
29
- color: vars.$sidebar-label-color;
26
+ font-size: variables.$font-size-sm;
27
+ font-weight: variables.$font-weight-sm;
28
+ line-height: variables.$line-height-sm;
29
+ color: variables.$sidebar-label-color;
30
30
  opacity: 0;
31
31
  transition: opacity 150ms ease-in-out;
32
32
  }
package/layout/Sidebar/SidebarView.scss CHANGED
@@ -1,4 +1,4 @@
1
- @use "../../scss/variables" as vars;
1
+ @use "../../scss/variables";
2
2
 
3
3
  :root {
4
4
  --sidebar-text-color: #00000099;
@@ -49,7 +49,7 @@ $sidebar-badge-border-color: var(--sidebar-badge-border-color);
49
49
  padding: 8px;
50
50
  max-width: 72px;
51
51
  transition: max-width 250ms ease-in-out;
52
- background-color: vars.$element-background-color;
52
+ background-color: variables.$element-background-color;
53
53
 
54
54
  &__header {
55
55
  margin-bottom: 80px;
@@ -57,9 +57,9 @@ $sidebar-badge-border-color: var(--sidebar-badge-border-color);
57
57
 
58
58
  .ButtonView .ButtonView__link .ButtonView__text {
59
59
  color: $sidebar-text-color;
60
- font-size: vars.$font-size-sm;
61
- font-weight: vars.$font-weight-sm;
62
- line-height: vars.$line-height-sm;
60
+ font-size: variables.$font-size-sm;
61
+ font-weight: variables.$font-weight-sm;
62
+ line-height: variables.$line-height-sm;
63
63
  transition: color 150ms ease-in-out;
64
64
  opacity: 0;
65
65
  }
@@ -94,12 +94,12 @@ $sidebar-badge-border-color: var(--sidebar-badge-border-color);
94
94
  &-item {
95
95
  position: relative;
96
96
  width: 100%;
97
- border-radius: vars.$radius-large;
97
+ border-radius: variables.$radius-large;
98
98
 
99
99
  svg path,
100
100
  rect,
101
101
  circle {
102
- stroke: vars.$icon-color;
102
+ stroke: variables.$icon-color;
103
103
  }
104
104
 
105
105
  transition: background-color 150ms ease-in-out;
@@ -243,7 +243,7 @@ $sidebar-badge-border-color: var(--sidebar-badge-border-color);
243
243
  }
244
244
 
245
245
  &__footer {
246
- border-top: 1px solid vars.$element-border-color;
246
+ border-top: 1px solid variables.$element-border-color;
247
247
  }
248
248
 
249
249
  &__trigger {
package/layout/Skeleton/SkeletonView.scss CHANGED
@@ -1,8 +1,8 @@
1
- @use "../../scss/variables" as vars;
1
+ @use "../../scss/variables";
2
2
 
3
3
  .SkeletonView{
4
4
  $root: &;
5
- background-color: vars.$grey-darker;
5
+ background-color: variables.$grey-darker;
6
6
  border-radius: 4px;
7
7
  position: relative;
8
8
  overflow: hidden;
@@ -37,13 +37,13 @@
37
37
 
38
38
  @keyframes pulse {
39
39
  0% {
40
- background-color: vars.$grey-darker;
40
+ background-color: variables.$grey-darker;
41
41
  }
42
42
  50% {
43
- background-color: vars.$grey-light;
43
+ background-color: variables.$grey-light;
44
44
  }
45
45
  100% {
46
- background-color: vars.$grey-darker;
46
+ background-color: variables.$grey-darker;
47
47
  }
48
48
  }
49
49
 
@@ -56,7 +56,7 @@
56
56
  content: "";
57
57
  position: absolute;
58
58
  transform: translateX(-100%);
59
- background: linear-gradient(90deg, transparent, rgba(vars.$grey-light, 0.3), transparent);
59
+ background: linear-gradient(90deg, transparent, rgba(variables.$grey-light, 0.3), transparent);
60
60
  animation: wave-animation 1.6s linear 0.5s infinite;
61
61
  }
62
62
  }
package/layout/Tooltip/TooltipView.scss CHANGED
@@ -1,5 +1,5 @@
1
1
  @use 'sass:math';
2
- @use "../../scss/variables" as vars;
2
+ @use "../../scss/variables";
3
3
 
4
4
  $tooltip-arrow-width: 10px;
5
5
  $tooltip-arrow-height: 10px;
@@ -122,7 +122,7 @@ $tooltip-background-color: rgba(65, 65, 65, 0.95);
122
122
  }
123
123
 
124
124
  &__content{
125
- color: vars.$white;
125
+ color: variables.$white;
126
126
  font-size: 14px;
127
127
  line-height: 24px;
128
128
  }
package/list/Empty/EmptyView.scss CHANGED
@@ -1,7 +1,7 @@
1
- @use "../../scss/variables" as vars;
1
+ @use "../../scss/variables";
2
2
 
3
3
  .EmptyView {
4
4
  text-align: center;
5
5
  padding: 20px;
6
- color: vars.$text-color;
6
+ color: variables.$text-color;
7
7
  }
package/list/FlexGrid/FlexGridView.scss CHANGED
@@ -1,4 +1,4 @@
1
- @use "../../scss/variables" as vars;
1
+ @use "../../scss/variables";
2
2
 
3
3
 
4
4
  $justifyValues: center, end, start, stretch, flex-start, flex-end, left, right, space-between, space-around, space-evenly;
@@ -47,13 +47,13 @@ $colMaxValue: 12;
47
47
  @include col(col, $root);
48
48
  @include col(offset, $root, margin-inline-start);
49
49
 
50
- @media (max-width: vars.$desktop-width) {
50
+ @media (max-width: variables.$desktop-width) {
51
51
  @include col(lg, $root);
52
52
  }
53
- @media (max-width: vars.$tablet-width) {
53
+ @media (max-width: variables.$tablet-width) {
54
54
  @include col(md, $root);
55
55
  }
56
- @media (max-width: vars.$mobile-width) {
56
+ @media (max-width: variables.$mobile-width) {
57
57
  @include col(sm, $root);
58
58
  }
59
59
  }
package/list/Grid/GridView.scss CHANGED
@@ -1,4 +1,4 @@
1
- @use "../../scss/variables" as vars;
1
+ @use "../../scss/variables";
2
2
 
3
3
  :root {
4
4
  --grid-header-background-color: var(--light-gray);
@@ -35,16 +35,16 @@ $grid-td-alternating-color: var(--grid-td-alternating-color);
35
35
  border-spacing: 0;
36
36
  border-collapse: separate;
37
37
  border: 1px solid $grid-border-color;
38
- border-radius: vars.$radius-large;
38
+ border-radius: variables.$radius-large;
39
39
  margin: 24px 0;
40
40
 
41
41
  th,
42
42
  td {
43
- color: vars.$text-color;
43
+ color: variables.$text-color;
44
44
  background-color: $grid-td-background-color;
45
45
  }
46
46
  th {
47
- font-weight: vars.$font-weight-lg;
47
+ font-weight: variables.$font-weight-lg;
48
48
  background-color: $grid-header-background-color;
49
49
  }
50
50
 
@@ -63,20 +63,20 @@ $grid-td-alternating-color: var(--grid-td-alternating-color);
63
63
 
64
64
  thead > tr > th {
65
65
  &:first-child {
66
- border-top-left-radius: vars.$radius-large;
66
+ border-top-left-radius: variables.$radius-large;
67
67
  }
68
68
  &:last-child {
69
- border-top-right-radius: vars.$radius-large;
69
+ border-top-right-radius: variables.$radius-large;
70
70
  }
71
71
  }
72
72
 
73
73
  tbody > tr:last-child > td {
74
74
  &:first-child {
75
- border-bottom-left-radius: vars.$radius-large;
75
+ border-bottom-left-radius: variables.$radius-large;
76
76
  }
77
77
 
78
78
  &:last-child {
79
- border-bottom-right-radius: vars.$radius-large;
79
+ border-bottom-right-radius: variables.$radius-large;
80
80
  }
81
81
  }
82
82
  }
@@ -90,8 +90,8 @@ $grid-td-alternating-color: var(--grid-td-alternating-color);
90
90
  &_size {
91
91
  &_lg {
92
92
  #{$root}__table {
93
- font-size: vars.$font-size-lg;
94
- line-height: vars.$line-height-lg;
93
+ font-size: variables.$font-size-lg;
94
+ line-height: variables.$line-height-lg;
95
95
  }
96
96
 
97
97
  th,
@@ -102,8 +102,8 @@ $grid-td-alternating-color: var(--grid-td-alternating-color);
102
102
 
103
103
  &_md {
104
104
  #{$root}__table {
105
- font-size: vars.$font-size-base;
106
- line-height: vars.$line-height-base;
105
+ font-size: variables.$font-size-base;
106
+ line-height: variables.$line-height-base;
107
107
  }
108
108
 
109
109
  th,
@@ -114,8 +114,8 @@ $grid-td-alternating-color: var(--grid-td-alternating-color);
114
114
 
115
115
  &_sm {
116
116
  #{$root}__table {
117
- font-size: vars.$font-size-sm;
118
- line-height: vars.$line-height-sm;
117
+ font-size: variables.$font-size-sm;
118
+ line-height: variables.$line-height-sm;
119
119
  }
120
120
 
121
121
  th,
package/list/Grid/views/ContentColumnView/ContentColumnView.scss CHANGED
@@ -1,4 +1,4 @@
1
- @use "../../../../scss/variables" as vars;
1
+ @use "../../../../scss/variables";
2
2
 
3
3
  :root {
4
4
  --grid-icon-color: #323232;
@@ -28,7 +28,7 @@ $grid-icon-color: var(--grid-icon-color);
28
28
  }
29
29
 
30
30
  &__subtitle {
31
- color: vars.$element-placeholder-color;
31
+ color: variables.$element-placeholder-color;
32
32
  }
33
33
 
34
34
  &__picture {
@@ -55,8 +55,8 @@ $grid-icon-color: var(--grid-icon-color);
55
55
  &_size {
56
56
  &_lg {
57
57
  #{$root}__subtitle {
58
- font-size: vars.$font-size-base;
59
- line-height: vars.$line-height-base;
58
+ font-size: variables.$font-size-base;
59
+ line-height: variables.$line-height-base;
60
60
  }
61
61
 
62
62
  #{$root}__avatar-wrapper {
@@ -67,15 +67,15 @@ $grid-icon-color: var(--grid-icon-color);
67
67
 
68
68
  &_md {
69
69
  #{$root}__subtitle {
70
- font-size: vars.$font-size-sm;
71
- line-height: vars.$line-height-sm;
70
+ font-size: variables.$font-size-sm;
71
+ line-height: variables.$line-height-sm;
72
72
  }
73
73
  }
74
74
 
75
75
  &_sm {
76
76
  #{$root}__subtitle {
77
- font-size: vars.$font-size-xs;
78
- line-height: vars.$line-height-xs;
77
+ font-size: variables.$font-size-xs;
78
+ line-height: variables.$line-height-xs;
79
79
  }
80
80
  }
81
81
  }
package/list/Grid/views/DiagramColumnView/DiagramColumnView.scss CHANGED
@@ -1,4 +1,4 @@
1
- @use "../../../../scss/variables" as vars;
1
+ @use "../../../../scss/variables";
2
2
 
3
3
  .DiagramColumnView {
4
4
  $root: &;
@@ -40,10 +40,10 @@
40
40
  }
41
41
 
42
42
  &__diagram {
43
- font-weight: vars.$font-weight-lg;
44
- font-size: vars.$font-size-xs;
45
- line-height: vars.$line-height-xs;
46
- color: vars.$text-color;
43
+ font-weight: variables.$font-weight-lg;
44
+ font-size: variables.$font-size-xs;
45
+ line-height: variables.$line-height-xs;
46
+ color: variables.$text-color;
47
47
  width: 100%;
48
48
  }
49
49
 
@@ -66,7 +66,7 @@
66
66
  top: 0;
67
67
 
68
68
  &_color {
69
- @each $color, $color-map in vars.$diagram-colors {
69
+ @each $color, $color-map in variables.$diagram-colors {
70
70
  &_#{$color} {
71
71
  background-color: map-get($color-map, color-themed);
72
72
  border-right: 1px solid map-get($color-map, color);
@@ -105,7 +105,7 @@
105
105
  bottom: 0;
106
106
 
107
107
  &_color {
108
- @each $color, $color-map in vars.$diagram-colors {
108
+ @each $color, $color-map in variables.$diagram-colors {
109
109
  &_#{$color} {
110
110
  background-color: map-get($color-map, color-themed);
111
111
  border-top: 1px solid map-get($color-map, color);
@@ -133,10 +133,10 @@
133
133
  #{$root}__subtitle {
134
134
  margin: 0 auto;
135
135
 
136
- font-weight: vars.$font-weight-sm;
137
- font-size: vars.$font-size-base;
138
- line-height: vars.$line-height-base;
139
- color: vars.$element-placeholder-color;
136
+ font-weight: variables.$font-weight-sm;
137
+ font-size: variables.$font-size-base;
138
+ line-height: variables.$line-height-base;
139
+ color: variables.$element-placeholder-color;
140
140
  }
141
141
  }
142
142
 
@@ -150,7 +150,7 @@
150
150
  border-radius: 100%;
151
151
 
152
152
  &_color {
153
- @each $color, $color-map in vars.$diagram-colors {
153
+ @each $color, $color-map in variables.$diagram-colors {
154
154
  &_#{$color} {
155
155
  border: 2px solid map-get($color-map, color);
156
156
  }
package/list/List/ListView.scss CHANGED
@@ -1,7 +1,7 @@
1
- @use "../../scss/variables" as vars;
1
+ @use "../../scss/variables";
2
2
 
3
3
  .ListView {
4
- color: vars.$text-color;
4
+ color: variables.$text-color;
5
5
 
6
6
  .FormView {
7
7
  margin-bottom: 10px;
package/list/Pagination/PaginationButtonView.scss CHANGED
@@ -1,4 +1,4 @@
1
- @use "../../scss/variables" as vars;
1
+ @use "../../scss/variables";
2
2
 
3
3
  :root {
4
4
  --pagination-border-color: var(--gray);
@@ -27,7 +27,7 @@ $pagination-background-color-disabled: var(--pagination-background-color-disable
27
27
 
28
28
  display: flex;
29
29
  flex-flow: row nowrap;
30
- color: vars.$text-color;
30
+ color: variables.$text-color;
31
31
 
32
32
  &_size {
33
33
  &_lg {
@@ -35,7 +35,7 @@ $pagination-background-color-disabled: var(--pagination-background-color-disable
35
35
  #{$root}__page {
36
36
  &-button {
37
37
  padding: 12px 18px;
38
- font-size: vars.$font-size-lg;
38
+ font-size: variables.$font-size-lg;
39
39
  line-height: 24px;
40
40
 
41
41
  &_hasIcon {
@@ -73,7 +73,7 @@ $pagination-background-color-disabled: var(--pagination-background-color-disable
73
73
  #{$root}__page {
74
74
  &-button {
75
75
  padding: 8px 14px;
76
- font-size: vars.$font-size-base;
76
+ font-size: variables.$font-size-base;
77
77
  line-height: 24px;
78
78
 
79
79
  &_hasIcon {
@@ -111,7 +111,7 @@ $pagination-background-color-disabled: var(--pagination-background-color-disable
111
111
  #{$root}__page {
112
112
  &-button {
113
113
  padding: 4px 12px;
114
- font-size: vars.$font-size-sm;
114
+ font-size: variables.$font-size-sm;
115
115
  line-height: 25px;
116
116
 
117
117
  &_hasIcon {
@@ -153,7 +153,7 @@ $pagination-background-color-disabled: var(--pagination-background-color-disable
153
153
  display: inline-block;
154
154
  cursor: pointer;
155
155
 
156
- background-color: vars.$element-background-color;
156
+ background-color: variables.$element-background-color;
157
157
  border: 1px solid $pagination-border-color;
158
158
  border-right: none;
159
159
 
@@ -167,7 +167,7 @@ $pagination-background-color-disabled: var(--pagination-background-color-disable
167
167
  height: 100%;
168
168
  pointer-events: none;
169
169
  border-radius: inherit;
170
- border: 4px solid vars.$light-gray;
170
+ border: 4px solid variables.$light-gray;
171
171
  opacity: 0;
172
172
  }
173
173
 
@@ -176,12 +176,12 @@ $pagination-background-color-disabled: var(--pagination-background-color-disable
176
176
  }
177
177
 
178
178
  &_active {
179
- background-color: vars.$primary;
180
- color: vars.$white;
179
+ background-color: variables.$primary;
180
+ color: variables.$white;
181
181
  }
182
182
 
183
183
  &_hasIcon:not(#{$pageRoot}_disabled):active {
184
- background-color: vars.$primary;
184
+ background-color: variables.$primary;
185
185
 
186
186
  #{$pageRoot}-icon {
187
187
  path {
@@ -191,7 +191,7 @@ $pagination-background-color-disabled: var(--pagination-background-color-disable
191
191
  }
192
192
 
193
193
  &:not(#{$pageRoot}_disabled):not(#{$pageRoot}_active):hover {
194
- border-color: vars.$element-border-color-hover;
194
+ border-color: variables.$element-border-color-hover;
195
195
  background-color: $pagination-hover-background-color;
196
196
  }
197
197
 
@@ -246,8 +246,8 @@ $pagination-background-color-disabled: var(--pagination-background-color-disable
246
246
  }
247
247
 
248
248
  &_disabled {
249
- background-color: vars.$element-background-color-disabled;
250
- color: vars.$element-placeholder-color-disabled;
249
+ background-color: variables.$element-background-color-disabled;
250
+ color: variables.$element-placeholder-color-disabled;
251
251
 
252
252
  cursor: not-allowed;
253
253
 
@@ -258,7 +258,7 @@ $pagination-background-color-disabled: var(--pagination-background-color-disable
258
258
  #{$pageRoot}-icon {
259
259
  pointer-events: none;
260
260
  path {
261
- stroke: vars.$element-placeholder-color-disabled;
261
+ stroke: variables.$element-placeholder-color-disabled;
262
262
  }
263
263
  }
264
264
  }
package/list/Steps/StepItemView.scss CHANGED
@@ -1,4 +1,4 @@
1
- @use "../../scss/variables" as vars;
1
+ @use "../../scss/variables";
2
2
 
3
3
  .StepItemView{
4
4
  $root: &;
@@ -15,31 +15,31 @@
15
15
  }
16
16
 
17
17
  &__icon{
18
- background-color: rgba(vars.$white, .2);
18
+ background-color: rgba(variables.$white, .2);
19
19
  padding: 5px;
20
20
  border-radius: 10px;
21
21
  }
22
22
 
23
23
  &_wait{
24
24
  #{$root}__icon{
25
- background-color: vars.$grey-darker;
25
+ background-color: variables.$grey-darker;
26
26
  svg{
27
- fill:vars.$white;
27
+ fill:variables.$white;
28
28
  }
29
29
  }
30
30
 
31
31
  #{$root}__title, #{$root}__subtitle, #{$root}__description{
32
- color: vars.$grey-darker;
32
+ color: variables.$grey-darker;
33
33
  }
34
34
 
35
35
  #{$root}__divider{
36
- border-top-color: vars.$grey-darker;
36
+ border-top-color: variables.$grey-darker;
37
37
  }
38
38
  }
39
39
 
40
40
  &_active{
41
41
  #{$root}__body{
42
- background-color: vars.$primary;
42
+ background-color: variables.$primary;
43
43
  }
44
44
 
45
45
  #{$root}__icon svg{
@@ -51,13 +51,13 @@
51
51
  }
52
52
 
53
53
  #{$root}__divider{
54
- border-top-color: vars.$primary;
54
+ border-top-color: variables.$primary;
55
55
  }
56
56
  }
57
57
 
58
58
  &_finish{
59
59
  #{$root}__body{
60
- background-color: vars.$success;
60
+ background-color: variables.$success;
61
61
  }
62
62
 
63
63
  #{$root}__icon svg{
@@ -69,13 +69,13 @@
69
69
  }
70
70
 
71
71
  #{$root}__divider{
72
- border-top-color: vars.$success;
72
+ border-top-color: variables.$success;
73
73
  }
74
74
  }
75
75
 
76
76
  &_error{
77
77
  #{$root}__body{
78
- background-color: vars.$danger;
78
+ background-color: variables.$danger;
79
79
  }
80
80
 
81
81
  #{$root}__icon svg{
@@ -87,7 +87,7 @@
87
87
  }
88
88
 
89
89
  #{$root}__divider{
90
- border-top-color: vars.$danger;
90
+ border-top-color: variables.$danger;
91
91
  }
92
92
  }
93
93
 
@@ -116,7 +116,7 @@
116
116
  &__icon{
117
117
  margin-right: 5px;
118
118
 
119
- color: vars.$white;
119
+ color: variables.$white;
120
120
  font-size: 12px;
121
121
  font-weight: 500;
122
122
 
package/list/Steps/StepsView.scss CHANGED
@@ -1,4 +1,4 @@
1
- @use "../../scss/variables" as vars;
1
+ @use "../../scss/variables";
2
2
 
3
3
  .StepsView{
4
4
  width: 100%;
@@ -8,7 +8,7 @@
8
8
  justify-content: center;
9
9
  align-items: center;
10
10
  flex-shrink: 1;
11
- background: vars.$secondary-light;
11
+ background: variables.$secondary-light;
12
12
  overflow: auto;
13
13
  padding: 5px;
14
14
 
package/modal/Modal/ModalView.scss CHANGED
@@ -1,4 +1,4 @@
1
- @use "../../scss/variables" as vars;
1
+ @use "../../scss/variables";
2
2
 
3
3
  :root {
4
4
  --modal-background-color: #ffffff;
@@ -31,15 +31,15 @@ $modal-background-color: var(--modal-background-color);
31
31
  margin: auto;
32
32
  overflow: visible;
33
33
  background-color: $modal-background-color;
34
- color: vars.$text-color;
34
+ color: variables.$text-color;
35
35
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
36
36
 
37
37
  &_size {
38
38
  &_lg {
39
39
  border-radius: 16px;
40
40
 
41
- font-size: vars.$font-size-lg;
42
- line-height: vars.$line-height-lg;
41
+ font-size: variables.$font-size-lg;
42
+ line-height: variables.$line-height-lg;
43
43
 
44
44
  #{$root}__header {
45
45
  padding: 24px;
@@ -54,10 +54,10 @@ $modal-background-color: var(--modal-background-color);
54
54
  }
55
55
  }
56
56
  &_md {
57
- border-radius: vars.$radius-large;
57
+ border-radius: variables.$radius-large;
58
58
 
59
- font-size: vars.$font-size-base;
60
- line-height: vars.$line-height-base;
59
+ font-size: variables.$font-size-base;
60
+ line-height: variables.$line-height-base;
61
61
 
62
62
  #{$root}__header {
63
63
  padding: 21px 20px;
@@ -72,10 +72,10 @@ $modal-background-color: var(--modal-background-color);
72
72
  }
73
73
  }
74
74
  &_sm {
75
- border-radius: vars.$radius-small;
75
+ border-radius: variables.$radius-small;
76
76
 
77
- font-size: vars.$font-size-sm;
78
- line-height: vars.$line-height-sm;
77
+ font-size: variables.$font-size-sm;
78
+ line-height: variables.$line-height-sm;
79
79
 
80
80
  #{$root}__header {
81
81
  padding: 19px 16px;
@@ -106,7 +106,7 @@ $modal-background-color: var(--modal-background-color);
106
106
  &__title {
107
107
  font-size: inherit;
108
108
  line-height: inherit;
109
- font-weight: vars.$font-weight-lg;
109
+ font-weight: variables.$font-weight-lg;
110
110
  }
111
111
 
112
112
  &__close {
@@ -116,7 +116,7 @@ $modal-background-color: var(--modal-background-color);
116
116
 
117
117
  svg {
118
118
  path {
119
- stroke: vars.$text-color;
119
+ stroke: variables.$text-color;
120
120
  }
121
121
  }
122
122
  }