@formixru/b2b-ui 3.1.0 → 3.3.0

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 (9) hide show
  1. package/package.json +3 -4
  2. package/src/components/button/index.scss +6 -2
  3. package/src/components/sidebar/index.scss +0 -20
  4. package/src/components/slider-nav/index.scss +10 -10
  5. package/src/components/tabs/index.js +53 -79
  6. package/src/components/total/index.scss +14 -15
  7. package/src/components/warning-message/index.scss +16 -60
  8. package/src/components/warning-message/index.vue +2 -1
  9. package/src/variables.scss +20 -24
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@formixru/b2b-ui",
3
- "version": "3.1.0",
3
+ "version": "3.3.0",
4
4
  "type": "module",
5
5
  "repository": {
6
6
  "type": "git",
@@ -26,6 +26,7 @@
26
26
  "@advdominion/eslint-config": "^1.1.2",
27
27
  "@advdominion/get-scrollbar-width": "^2.0.1",
28
28
  "@advdominion/pluralize": "^1.0.2",
29
+ "@advdominion/scroll-to": "^1.0.0",
29
30
  "@advdominion/tooltip": "^6.0.0",
30
31
  "@floating-ui/dom": "^1.7.4",
31
32
  "@popperjs/core": "^2.11.8",
@@ -70,6 +71,7 @@
70
71
  "peerDependencies": {
71
72
  "@advdominion/get-scrollbar-width": "^2.0.0",
72
73
  "@advdominion/pluralize": "^1.0.0",
74
+ "@advdominion/scroll-to": "^1.0.0",
73
75
  "@advdominion/tooltip": "^6.0.0",
74
76
  "color": "^5.0.0",
75
77
  "dayjs": "^1.0.0",
@@ -98,8 +100,5 @@
98
100
  "workerDirectory": [
99
101
  ".storybook/static"
100
102
  ]
101
- },
102
- "dependencies": {
103
- "@advdominion/scroll-to": "^1.0.0"
104
103
  }
105
104
  }
package/src/components/button/index.scss CHANGED
@@ -193,8 +193,8 @@ $b: '.button';
193
193
  }
194
194
 
195
195
  &_narrow {
196
- min-width: 4px * 18;
197
- padding: 0 4px * 4;
196
+ min-width: 72px;
197
+ padding: 0 16px;
198
198
  }
199
199
 
200
200
  &_small {
@@ -211,6 +211,10 @@ $b: '.button';
211
211
 
212
212
  &_only-icon {
213
213
  @include only-icon;
214
+
215
+ &#{$b}_small {
216
+ @include only-icon($button-small-height);
217
+ }
214
218
  }
215
219
 
216
220
  &__icon {
package/src/components/sidebar/index.scss CHANGED
@@ -55,7 +55,6 @@ $b: '.sidebar';
55
55
  display: flex;
56
56
  height: 4px * 14;
57
57
  justify-content: center;
58
- position: relative;
59
58
  transition-duration: var(--duration-micro-s);
60
59
  transition-property: background-color, color;
61
60
  transition-timing-function: var(--easing-standard);
@@ -81,25 +80,6 @@ $b: '.sidebar';
81
80
  }
82
81
  }
83
82
 
84
- &[data-notification] {
85
- &::before {
86
- align-items: center;
87
- background-color: $sidebar-notification-bg;
88
- border-radius: 50%;
89
- color: $sidebar-notification-color;
90
- content: attr(data-notification);
91
- display: flex;
92
- height: 4px * 4;
93
- justify-content: center;
94
- position: absolute;
95
- right: 4px * 3;
96
- top: 4px * 3;
97
- width: 4px * 4;
98
-
99
- @include font($sidebar-notification-font);
100
- }
101
- }
102
-
103
83
  &[data-sidebar-close] {
104
84
  background-color: $sidebar-close-bg;
105
85
  color: $sidebar-close-color;
package/src/components/slider-nav/index.scss CHANGED
@@ -10,21 +10,21 @@ $b: '.slider-nav';
10
10
  border-radius: $slider-nav-button-radius;
11
11
  cursor: pointer;
12
12
  display: flex;
13
- height: 4px * 8;
13
+ height: 32px;
14
14
  justify-content: center;
15
15
  opacity: 1;
16
16
  transition-duration: var(--duration-micro-s);
17
- transition-property: border-color, color, opacity;
17
+ transition-property: background-color, border-color, color, opacity;
18
18
  transition-timing-function: var(--easing-standard);
19
- width: 4px * 8;
19
+ width: 32px;
20
20
 
21
21
  @media (--tablet-portrait-down) {
22
22
  display: none;
23
23
  }
24
24
 
25
25
  @media (--tablet-landscape-up) {
26
- height: 4px * 12;
27
- width: 4px * 12;
26
+ height: 48px;
27
+ width: 48px;
28
28
  }
29
29
 
30
30
  &_disabled {
@@ -65,16 +65,16 @@ $b: '.slider-nav';
65
65
 
66
66
  &__icon {
67
67
  fill: currentcolor;
68
- height: 4px * 4;
69
- width: 4px * 4;
68
+ height: 16px;
69
+ width: 16px;
70
70
 
71
71
  @media (--tablet-landscape-up) {
72
- height: 4px * 6;
73
- width: 4px * 6;
72
+ height: 24px;
73
+ width: 24px;
74
74
  }
75
75
 
76
76
  #{$b}__button_prev & {
77
- transform: translateX(-2px);
77
+ transform: translateX(-1px);
78
78
  }
79
79
 
80
80
  #{$b}__button_next & {
package/src/components/tabs/index.js CHANGED
@@ -1,11 +1,8 @@
1
- /* globals BX */
2
-
3
1
  import { scrollTo } from '@advdominion/scroll-to';
4
2
 
5
3
  import { cssVar } from '../../utils/css-var.js';
6
- import { errorHandler } from '../../utils/error-handler.js';
7
4
  import { isInViewport } from '../../utils/is-in-viewport.js';
8
- import { hide as hideLoader, show as showLoader } from '../loader/index.js';
5
+ import { request } from '../request/index.js';
9
6
 
10
7
  const setLeftWidth = async ($line, $el) => {
11
8
  const $label = $el.querySelector('.tabs__label');
@@ -42,6 +39,34 @@ const initTabsContent = ($b) => {
42
39
  }
43
40
  };
44
41
 
42
+ const changeTab = ($el) => {
43
+ const $b = $el.closest('.tabs');
44
+ const $items = $b.querySelectorAll('.tabs__item');
45
+ const $content = $b.querySelectorAll('.tabs__content');
46
+
47
+ const index = [...$items].indexOf($el);
48
+
49
+ for (const [i, $item] of $items.entries()) {
50
+ $item.disabled = i === index;
51
+ }
52
+
53
+ for (const [i, $c] of $content.entries()) {
54
+ if (i === index) {
55
+ $c.hidden = false;
56
+ for (const $el of $c.querySelectorAll('.swiper')) {
57
+ $el.swiper?.update();
58
+ }
59
+ for (const $el of $c.querySelectorAll('.tabs')) {
60
+ setInitLineStyles($el);
61
+ }
62
+ // Инициализируем полученный HTML
63
+ initTabsContent($content[index]);
64
+ } else {
65
+ $c.hidden = true;
66
+ }
67
+ }
68
+ };
69
+
45
70
  export const init = async ($b) => {
46
71
  const $nav = $b.querySelector('.tabs__nav');
47
72
  const $list = $nav.querySelector('.tabs__list');
@@ -55,71 +80,14 @@ export const init = async ($b) => {
55
80
  const index = [...$items].indexOf($el);
56
81
  if ($el.tagName === 'BUTTON') {
57
82
  if ($el.dataset.tabsFetch && $content[index].innerHTML.trim() === '') {
58
- showLoader();
59
- try {
60
- const response = await fetch($el.dataset.tabsFetch, {
61
- method: 'GET',
62
- headers: {
63
- 'X-Requested-With': 'XMLHttpRequest',
64
- 'X-Session-Id': BX.message('bitrix_sessid'),
65
- },
66
- });
67
- if (!response.ok) {
68
- throw response;
69
- }
70
- const data = await response.text();
71
- hideLoader();
72
- // Вставляем полученный HTML
73
- $content[index].innerHTML = data;
74
- // Переключаем таб
75
- for (const i of $items) i.disabled = false;
76
- $el.disabled = true;
77
- for (const [i, c] of $content.entries()) {
78
- if (i === index) {
79
- c.hidden = false;
80
- for (const swiperEl of c.querySelectorAll('.swiper')) {
81
- if (swiperEl.swiper) {
82
- swiperEl.swiper.update();
83
- }
84
- }
85
- for (const tabsEl of c.querySelectorAll('.tabs')) {
86
- setInitLineStyles(tabsEl);
87
- }
88
- // Инициализируем полученный HTML
89
- initTabsContent($content[index]);
90
- } else {
91
- c.hidden = true;
92
- }
93
- }
94
- } catch (error) {
95
- hideLoader();
96
- if (error.status === 401) {
97
- location.reload();
98
- } else {
99
- errorHandler(error);
100
- }
101
- }
83
+ const { content } = await request({ url: $el.dataset.tabsFetch });
84
+ // Вставляем полученный HTML
85
+ $content[index].innerHTML = content;
86
+ // Переключаем таб
87
+ changeTab($el);
102
88
  } else {
103
89
  // Переключаем таб
104
- for (const i of $items) i.disabled = false;
105
- $el.disabled = true;
106
- for (const [i, c] of $content.entries()) {
107
- if (i === index) {
108
- c.hidden = false;
109
- for (const swiperEl of c.querySelectorAll('.swiper')) {
110
- if (swiperEl.swiper) {
111
- swiperEl.swiper.update();
112
- }
113
- }
114
- for (const tabsEl of c.querySelectorAll('.tabs')) {
115
- setInitLineStyles(tabsEl);
116
- }
117
- // Инициализируем полученный HTML
118
- initTabsContent($content[index]);
119
- } else {
120
- c.hidden = true;
121
- }
122
- }
90
+ changeTab($el);
123
91
  }
124
92
 
125
93
  if ($nav.swiper) {
@@ -134,41 +102,47 @@ export const init = async ($b) => {
134
102
 
135
103
  if ($nav.swiper) {
136
104
  $nav.swiper.destroy();
137
- for (const i of $items) i.removeEventListener('click', handleItemClick);
105
+ for (const $item of $items) {
106
+ $item.removeEventListener('click', handleItemClick);
107
+ }
138
108
  }
139
109
 
140
110
  const { default: Swiper } = await import('swiper');
141
111
 
142
112
  $nav.classList.add('swiper');
143
113
  $list.classList.add('swiper-wrapper');
144
- for (const i of $items) i.classList.add('swiper-slide');
114
+ for (const $item of $items) {
115
+ $item.classList.add('swiper-slide');
116
+ }
145
117
 
146
118
  new Swiper($nav, {
147
119
  speed: cssVar('--duration-effect-s'),
148
120
  slidesPerView: 'auto',
149
121
  freeMode: true,
150
122
  on: {
151
- init() {
123
+ init(swiper) {
152
124
  setInitLineStyles($b); // Устанавливаем стили для линии при загрузке страницы
153
- if (!this.isBeginning) {
125
+ if (!swiper.isBeginning) {
154
126
  $nav.classList.toggle('tabs__nav_shadow-start', true);
155
127
  }
156
- if (!this.isEnd) {
128
+ if (!swiper.isEnd) {
157
129
  $nav.classList.toggle('tabs__nav_shadow-end', true);
158
130
  }
159
131
  },
160
- sliderMove() {
161
- $nav.classList.toggle('tabs__nav_shadow-start', !this.isBeginning);
162
- $nav.classList.toggle('tabs__nav_shadow-end', !this.isEnd);
132
+ sliderMove(swiper) {
133
+ $nav.classList.toggle('tabs__nav_shadow-start', !swiper.isBeginning);
134
+ $nav.classList.toggle('tabs__nav_shadow-end', !swiper.isEnd);
163
135
  },
164
- transitionStart() {
165
- $nav.classList.toggle('tabs__nav_shadow-start', !this.isBeginning);
166
- $nav.classList.toggle('tabs__nav_shadow-end', !this.isEnd);
136
+ transitionStart(swiper) {
137
+ $nav.classList.toggle('tabs__nav_shadow-start', !swiper.isBeginning);
138
+ $nav.classList.toggle('tabs__nav_shadow-end', !swiper.isEnd);
167
139
  },
168
140
  },
169
141
  });
170
142
 
171
- for (const i of $items) i.addEventListener('click', handleItemClick);
143
+ for (const $item of $items) {
144
+ $item.addEventListener('click', handleItemClick);
145
+ }
172
146
  };
173
147
 
174
148
  document.body.addEventListener('click', async (e) => {
package/src/components/total/index.scss CHANGED
@@ -7,7 +7,7 @@ $b: '.total';
7
7
  border-radius: $total-radius;
8
8
  display: flex;
9
9
  flex-direction: column;
10
- padding: 4px * 6 4px * 4;
10
+ padding: 24px 16px;
11
11
 
12
12
  @include dark-border;
13
13
  @include font($total-font);
@@ -16,8 +16,7 @@ $b: '.total';
16
16
  align-items: center;
17
17
  flex-direction: row;
18
18
  justify-content: space-between;
19
- padding-left: 4px * 8;
20
- padding-right: 4px * 8;
19
+ padding: 24px;
21
20
  }
22
21
 
23
22
  &_shadow {
@@ -35,11 +34,11 @@ $b: '.total';
35
34
  &__wrapper {
36
35
  display: flex;
37
36
  flex-direction: column;
38
- margin-top: 4px * 6;
37
+ margin-top: 24px;
39
38
 
40
39
  @media (--tablet-landscape-up) {
41
40
  flex-direction: row;
42
- margin-left: 4px * 8;
41
+ margin-left: 32px;
43
42
  margin-top: 0;
44
43
  }
45
44
  }
@@ -56,18 +55,18 @@ $b: '.total';
56
55
  justify-content: space-between;
57
56
 
58
57
  &:not(:first-child) {
59
- margin-top: 4px * 3;
58
+ margin-top: 12px;
60
59
  }
61
60
  }
62
61
 
63
62
  &__specs-label {
64
63
  color: $total-specs-label-color;
65
- margin-right: 4px * 6;
64
+ margin-right: 24px;
66
65
 
67
66
  @include font($total-specs-label-font);
68
67
 
69
68
  @media (--tablet-landscape-up) {
70
- max-width: 4px * 25;
69
+ max-width: 100px;
71
70
  }
72
71
  }
73
72
 
@@ -87,13 +86,13 @@ $b: '.total';
87
86
  justify-content: center;
88
87
 
89
88
  &:not(:first-child) {
90
- margin-top: 4px * 3;
89
+ margin-top: 12px;
91
90
 
92
91
  @media (--tablet-landscape-up) {
93
92
  border-left: $total-amount-list-separator-width solid $total-amount-list-separator-color;
94
- margin-left: 4px * 6;
93
+ margin-left: 24px;
95
94
  margin-top: 0;
96
- padding-left: 4px * 6;
95
+ padding-left: 24px;
97
96
  }
98
97
  }
99
98
  }
@@ -104,7 +103,7 @@ $b: '.total';
104
103
  justify-content: space-between;
105
104
 
106
105
  &:not(:first-child) {
107
- margin-top: 4px * 4;
106
+ margin-top: 16px;
108
107
  }
109
108
 
110
109
  &_big {
@@ -114,7 +113,7 @@ $b: '.total';
114
113
 
115
114
  &__amount-label {
116
115
  color: $total-amount-label-color;
117
- margin-right: 4px * 6;
116
+ margin-right: 24px;
118
117
 
119
118
  @include font($total-amount-label-font);
120
119
  }
@@ -153,10 +152,10 @@ $b: '.total';
153
152
  }
154
153
 
155
154
  &__promocode {
156
- margin-top: 4px * 4;
155
+ margin-top: 16px;
157
156
 
158
157
  @media (--tablet-landscape-up) {
159
- width: 4px * 85;
158
+ width: 340px;
160
159
  }
161
160
  }
162
161
  }
package/src/components/warning-message/index.scss CHANGED
@@ -7,6 +7,7 @@ $b: '.warning-message';
7
7
  background-color: $warning-message-bg;
8
8
  border-radius: $warning-message-radius;
9
9
  box-shadow: $warning-message-shadow;
10
+ color: $warning-message-color;
10
11
  display: flex;
11
12
  padding: 16px 16px 24px;
12
13
 
@@ -26,34 +27,43 @@ $b: '.warning-message';
26
27
  }
27
28
 
28
29
  &_success {
30
+ color: $warning-message-success-color;
29
31
  }
30
32
 
31
33
  &_info {
34
+ color: $warning-message-info-color;
32
35
  }
33
36
 
34
37
  &_light-info {
38
+ color: $warning-message-light-info-color;
35
39
  }
36
40
 
37
41
  &_error {
42
+ color: $warning-message-error-color;
38
43
  }
39
44
 
40
45
  &_solid {
41
- background-color: $warning-message-color;
46
+ background-color: $warning-message-solid-bg;
47
+ color: $warning-message-solid-color;
42
48
 
43
49
  &#{$b}_success {
44
- background-color: $warning-message-success-color;
50
+ background-color: $warning-message-solid-success-bg;
51
+ color: $warning-message-solid-success-color;
45
52
  }
46
53
 
47
54
  &#{$b}_info {
48
- background-color: $warning-message-info-color;
55
+ background-color: $warning-message-solid-info-bg;
56
+ color: $warning-message-solid-info-color;
49
57
  }
50
58
 
51
59
  &#{$b}_light-info {
52
- background-color: $warning-message-light-info-color;
60
+ background-color: $warning-message-solid-light-info-bg;
61
+ color: $warning-message-solid-light-info-color;
53
62
  }
54
63
 
55
64
  &#{$b}_error {
56
- background-color: $warning-message-error-color;
65
+ background-color: $warning-message-solid-error-bg;
66
+ color: $warning-message-solid-error-color;
57
67
  }
58
68
  }
59
69
 
@@ -138,49 +148,11 @@ $b: '.warning-message';
138
148
  }
139
149
 
140
150
  &__title {
141
- color: $warning-message-color;
142
-
143
151
  @include font($warning-message-title-font);
144
152
 
145
153
  #{$b}_small & {
146
154
  @include font($warning-message-small-title-font);
147
155
  }
148
-
149
- #{$b}_solid & {
150
- color: $warning-message-solid-color;
151
- }
152
-
153
- #{$b}_success & {
154
- color: $warning-message-success-color;
155
- }
156
-
157
- #{$b}_solid#{$b}_success & {
158
- color: $warning-message-solid-success-color;
159
- }
160
-
161
- #{$b}_info & {
162
- color: $warning-message-info-color;
163
- }
164
-
165
- #{$b}_solid#{$b}_info & {
166
- color: $warning-message-solid-info-color;
167
- }
168
-
169
- #{$b}_light-info & {
170
- color: $warning-message-light-info-color;
171
- }
172
-
173
- #{$b}_solid#{$b}_light-info & {
174
- color: $warning-message-solid-light-info-color;
175
- }
176
-
177
- #{$b}_error & {
178
- color: $warning-message-error-color;
179
- }
180
-
181
- #{$b}_solid#{$b}_error & {
182
- color: $warning-message-solid-error-color;
183
- }
184
156
  }
185
157
 
186
158
  &__descr {
@@ -197,23 +169,7 @@ $b: '.warning-message';
197
169
  }
198
170
 
199
171
  #{$b}_solid & {
200
- color: $warning-message-solid-descr-color;
201
- }
202
-
203
- #{$b}_solid#{$b}_success & {
204
- color: $warning-message-solid-success-descr-color;
205
- }
206
-
207
- #{$b}_solid#{$b}_info & {
208
- color: $warning-message-solid-info-descr-color;
209
- }
210
-
211
- #{$b}_solid#{$b}_light-info & {
212
- color: $warning-message-solid-light-info-descr-color;
213
- }
214
-
215
- #{$b}_solid#{$b}_error & {
216
- color: $warning-message-solid-error-descr-color;
172
+ color: inherit;
217
173
  }
218
174
  }
219
175
 
package/src/components/warning-message/index.vue CHANGED
@@ -84,7 +84,8 @@ const icon = computed(() => {
84
84
  icon = 'check';
85
85
  break;
86
86
  }
87
- case 'info': {
87
+ case 'info':
88
+ case 'light-info': {
88
89
  icon = 'info';
89
90
  break;
90
91
  }
package/src/variables.scss CHANGED
@@ -939,10 +939,6 @@ $sidebar-active-button-label-color: $sidebar-active-button-color !default;
939
939
  $sidebar-close-bg: $sidebar-button-bg !default;
940
940
  $sidebar-close-color: $color-grey-20 !default;
941
941
 
942
- $sidebar-notification-bg: $color-error !default;
943
- $sidebar-notification-color: $color-white !default;
944
- $sidebar-notification-font: ('font-weight': bold, 'font-size': $font-size-3xs, 'line-height': 1) !default;
945
-
946
942
  $sidebar-header-separator-color: autocolor(('light': $color-grey-alpha-80, 'dark': $color-grey-alpha-i-90), $sidebar-bg) !default;
947
943
  $sidebar-header-separator-width: 1px !default;
948
944
  $sidebar-header-icon-border-color: $color-primary !default;
@@ -1029,15 +1025,20 @@ $warning-message-color: $color-warning !default;
1029
1025
 
1030
1026
  $warning-message-small-shadow: $shadow-s !default;
1031
1027
 
1032
- $warning-message-solid-color: $font-color-inverted !default;
1033
-
1034
1028
  $warning-message-success-color: $color-success !default;
1035
- $warning-message-solid-success-color: $warning-message-solid-color !default;
1036
1029
  $warning-message-info-color: $color-primary !default;
1030
+ $warning-message-light-info-color: $color-primary-70 !default;
1031
+ $warning-message-error-color: $color-error !default;
1032
+
1033
+ $warning-message-solid-bg: $warning-message-color !default;
1034
+ $warning-message-solid-color: $font-color-inverted !default;
1035
+ $warning-message-solid-success-bg: $warning-message-success-color !default;
1036
+ $warning-message-solid-success-color: $warning-message-solid-color !default;
1037
+ $warning-message-solid-info-bg: $warning-message-info-color !default;
1037
1038
  $warning-message-solid-info-color: $warning-message-solid-color !default;
1038
- $warning-message-light-info-color: $color-primary-80 !default;
1039
+ $warning-message-solid-light-info-bg: $color-primary-80 !default;
1039
1040
  $warning-message-solid-light-info-color: $font-color-secondary !default;
1040
- $warning-message-error-color: $color-error !default;
1041
+ $warning-message-solid-error-bg: $warning-message-error-color !default;
1041
1042
  $warning-message-solid-error-color: $warning-message-solid-color !default;
1042
1043
 
1043
1044
  $warning-message-title-font: ('font-weight': bold, 'font-size': $font-size-l, 'line-height': $line-height-s) !default;
@@ -1047,22 +1048,17 @@ $warning-message-descr-font: ('font-size': $font-size, 'line-height': $line-heig
1047
1048
  $warning-message-small-descr-font: ('font-size': $font-size-xs, 'line-height': $line-height) !default;
1048
1049
 
1049
1050
  $warning-message-descr-color: $font-color-secondary !default;
1050
- $warning-message-solid-descr-color: $warning-message-solid-color !default;
1051
- $warning-message-solid-success-descr-color: $warning-message-solid-success-color !default;
1052
- $warning-message-solid-info-descr-color: $warning-message-solid-info-color !default;
1053
- $warning-message-solid-light-info-descr-color: $warning-message-solid-light-info-color !default;
1054
- $warning-message-solid-error-descr-color: $warning-message-solid-error-color !default;
1055
-
1056
- $warning-message-icon-color: $warning-message-solid-color !default;
1057
- $warning-message-solid-icon-color: $warning-message-icon-color !default;
1058
- $warning-message-success-icon-color: $warning-message-solid-success-color !default;
1059
- $warning-message-solid-success-icon-color: $warning-message-success-icon-color !default;
1060
- $warning-message-info-icon-color: $warning-message-solid-info-color !default;
1061
- $warning-message-solid-info-icon-color: $warning-message-info-icon-color !default;
1062
- $warning-message-light-info-icon-color: $color-primary-70 !default;
1051
+
1052
+ $warning-message-icon-color: $warning-message-color !default;
1053
+ $warning-message-solid-icon-color: $warning-message-solid-color !default;
1054
+ $warning-message-success-icon-color: $warning-message-success-color !default;
1055
+ $warning-message-solid-success-icon-color: $warning-message-solid-success-color !default;
1056
+ $warning-message-info-icon-color: $warning-message-info-color !default;
1057
+ $warning-message-solid-info-icon-color: $warning-message-solid-info-color !default;
1058
+ $warning-message-light-info-icon-color: $warning-message-light-info-color !default;
1063
1059
  $warning-message-solid-light-info-icon-color: $color-primary !default;
1064
- $warning-message-error-icon-color: $warning-message-solid-error-color !default;
1065
- $warning-message-solid-error-icon-color: $warning-message-error-icon-color !default;
1060
+ $warning-message-error-icon-color: $warning-message-error-color !default;
1061
+ $warning-message-solid-error-icon-color: $warning-message-solid-error-color !default;
1066
1062
 
1067
1063
  /********** Панель пустого состояния (.empty-list) **********/
1068
1064