intelicoreact 1.0.29 → 1.0.30

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 (118) hide show
  1. package/dist/Atomic/FormElements/ActionAlert/ActionAlert.js +2 -2
  2. package/dist/Atomic/FormElements/ActionAlert/ActionAlert.scss +13 -9
  3. package/dist/Atomic/FormElements/AdvancedStatus/AdvancedStatus.scss +27 -22
  4. package/dist/Atomic/FormElements/Calendar/Calendar.scss +68 -45
  5. package/dist/Atomic/FormElements/CheckboxInput/CheckboxInput.scss +55 -30
  6. package/dist/Atomic/FormElements/CheckboxesLine/CheckboxesLine.scss +3 -3
  7. package/dist/Atomic/FormElements/CheckboxesLine/partial/AnyOuterClass.scss +1 -1
  8. package/dist/Atomic/FormElements/Dropdown/Dropdown.scss +100 -51
  9. package/dist/Atomic/FormElements/Dropdown/components/DropdownLoader.scss +27 -9
  10. package/dist/Atomic/FormElements/Input/Input.js +2 -0
  11. package/dist/Atomic/FormElements/Input/Input.scss +63 -38
  12. package/dist/Atomic/FormElements/InputCalendar/InputCalendar.js +1 -1
  13. package/dist/Atomic/FormElements/InputCalendar/InputCalendar.scss +7 -2
  14. package/dist/Atomic/FormElements/InputColor/InputColor.js +49 -0
  15. package/dist/Atomic/FormElements/InputColor/InputColor.scss +18 -0
  16. package/dist/Atomic/FormElements/InputDateRange/InputDateRange.scss +176 -130
  17. package/dist/Atomic/FormElements/InputMask/InputMask.scss +69 -57
  18. package/dist/Atomic/FormElements/InputMask2/InputMask2.js +4 -2
  19. package/dist/Atomic/FormElements/InputMask2/InputMask2.scss +80 -68
  20. package/dist/Atomic/FormElements/InputsRow/InputsRow.scss +10 -4
  21. package/dist/Atomic/FormElements/Label/Label.js +2 -2
  22. package/dist/Atomic/FormElements/Label/Label.scss +19 -15
  23. package/dist/Atomic/FormElements/MobileCalendar/MobileCalendar.js +41 -43
  24. package/dist/Atomic/FormElements/MobileCalendar/MobileCalendar.scss +41 -34
  25. package/dist/Atomic/FormElements/MultiSelect/MultiSelect.scss +5 -3
  26. package/dist/Atomic/FormElements/NumericInput/NumericInput.scss +63 -37
  27. package/dist/Atomic/FormElements/RadioGroup/RadioGroup.scss +5 -1
  28. package/dist/Atomic/FormElements/RadioInput/RadioInput.scss +27 -16
  29. package/dist/Atomic/FormElements/RadioRowSwitcher/RadioRowSwitcher.scss +72 -40
  30. package/dist/Atomic/FormElements/RangeCalendar/RangeCalendar.scss +38 -24
  31. package/dist/Atomic/FormElements/RangeInputs/RangeInputs.scss +19 -15
  32. package/dist/Atomic/FormElements/RangeList/RangeList.scss +56 -42
  33. package/dist/Atomic/FormElements/RangeList/partial/AnyOuterClass.scss +7 -10
  34. package/dist/Atomic/FormElements/RangeSlider/RangeSlider.js +6 -6
  35. package/dist/Atomic/FormElements/RangeSlider/RangeSlider.scss +71 -44
  36. package/dist/Atomic/FormElements/RangeSlider/RangeSlider.stories.scss +12 -8
  37. package/dist/Atomic/FormElements/SwitchableRow/SwitchableRow.scss +5 -6
  38. package/dist/Atomic/FormElements/SwitchableRow/partial/AnyOuterClass.scss +3 -3
  39. package/dist/Atomic/FormElements/Switcher/Switcher.scss +29 -21
  40. package/dist/Atomic/FormElements/Switcher/partial/AnyOuterClass.scss +4 -3
  41. package/dist/Atomic/FormElements/SwitcherCheckbox/SwitcherCheckbox.scss +10 -7
  42. package/dist/Atomic/FormElements/SwitcherCheckbox/partial/AnyOuterClass.scss +4 -3
  43. package/dist/Atomic/FormElements/SwitcherHide/SwitcherHide.scss +10 -7
  44. package/dist/Atomic/FormElements/SwitcherHide/partial/AnyOuterClass.scss +4 -3
  45. package/dist/Atomic/FormElements/SwitcherRadio/SwitcherRadio.scss +1 -0
  46. package/dist/Atomic/FormElements/SwitcherRadio/partial/AnyOuterClass.scss +4 -3
  47. package/dist/Atomic/FormElements/SwitcherRange/SwitcherRange.scss +19 -16
  48. package/dist/Atomic/FormElements/SwitcherRangeList/SwitcherRangeList.scss +1 -1
  49. package/dist/Atomic/FormElements/SwitcherRangeList/partial/AnyOuterClass.scss +10 -12
  50. package/dist/Atomic/FormElements/SwitcherTagsDropdown/SwitcherTagsDropdown.js +1 -1
  51. package/dist/Atomic/FormElements/SwitcherTagsDropdown/SwitcherTagsDropdown.scss +35 -33
  52. package/dist/Atomic/FormElements/SwitcherTagsDropdown/partial/AnyOuterClass.scss +4 -3
  53. package/dist/Atomic/FormElements/SwitcherTagsDropdown/partial/States.js +100 -100
  54. package/dist/Atomic/FormElements/SwitcherTextarea/SwitcherTextarea.scss +7 -4
  55. package/dist/Atomic/FormElements/SwitcherTextarea/partial/AnyOuterClass.scss +5 -4
  56. package/dist/Atomic/FormElements/TagsDropdown/TagsDropdown.js +9 -9
  57. package/dist/Atomic/FormElements/TagsDropdown/TagsDropdown.scss +86 -43
  58. package/dist/Atomic/FormElements/TextSwitcher/TextSwitcher.scss +40 -27
  59. package/dist/Atomic/FormElements/TextSwitcher/partial/AnyOuterClass.scss +2 -1
  60. package/dist/Atomic/FormElements/Textarea/Textarea.scss +18 -14
  61. package/dist/Atomic/FormElements/TieredCheckboxes/TieredCheckboxes.scss +9 -7
  62. package/dist/Atomic/FormElements/TimeRange/TimeRange.scss +3 -3
  63. package/dist/Atomic/FormElements/UserContacts/UserContacts.scss +0 -1
  64. package/dist/Atomic/FormElements/UserContacts/partial/AnyOuterClass.scss +11 -10
  65. package/dist/Atomic/FormElements/UserContacts/partial/defaultIcons.js +1 -0
  66. package/dist/Atomic/FormElements/WidgetPseudoTable/WidgetPseudoTable.js +1 -1
  67. package/dist/Atomic/FormElements/WidgetPseudoTable/WidgetPseudoTable.scss +24 -17
  68. package/dist/Atomic/FormElements/WidgetPseudoTable/partial/AnyOuterClass.scss +33 -28
  69. package/dist/Atomic/FormElements/WidgetWithSwitchableRows/WidgetWithSwitchableRows.scss +24 -17
  70. package/dist/Atomic/FormElements/WidgetWithSwitchableRows/partial/AnyOuterClass.scss +33 -28
  71. package/dist/Atomic/Layout/Header/Header.scss +44 -25
  72. package/dist/Atomic/Layout/MainMenu/MainMenu.scss +69 -35
  73. package/dist/Atomic/Layout/Spinner/Spinner.scss +30 -10
  74. package/dist/Atomic/UI/Accordion/Accordion.scss +75 -63
  75. package/dist/Atomic/UI/AccordionTable/AccordionTable.scss +68 -29
  76. package/dist/Atomic/UI/AdvancedTag/AdvancedTags.scss +59 -43
  77. package/dist/Atomic/UI/Alert/Alert.scss +28 -20
  78. package/dist/Atomic/UI/Arrow/Arrow.scss +3 -5
  79. package/dist/Atomic/UI/Button/Button.scss +53 -39
  80. package/dist/Atomic/UI/ButtonsBar/ButtonsBar.scss +2 -1
  81. package/dist/Atomic/UI/Chart/Chart.scss +14 -13
  82. package/dist/Atomic/UI/Chart/partial/AnyOuterClass.scss +20 -15
  83. package/dist/Atomic/UI/Chart/partial/ChartTypeSwitcherIcon/ChartTypeSwitcherIcon.scss +7 -2
  84. package/dist/Atomic/UI/Chart/partial/datasetSetters.js +0 -6
  85. package/dist/Atomic/UI/Chart/partial/optionsSetters.js +0 -5
  86. package/dist/Atomic/UI/CircleProgressBar/CircleProgressBar.scss +28 -22
  87. package/dist/Atomic/UI/DateTime/DateTime.js +2 -2
  88. package/dist/Atomic/UI/DateTime/DateTime.scss +1 -2
  89. package/dist/Atomic/UI/DateTime/partial/AnyOuterClass.scss +6 -5
  90. package/dist/Atomic/UI/DoubleString/DoubleString.scss +11 -7
  91. package/dist/Atomic/UI/DoubleString/partial/AnyOuterClass.scss +8 -6
  92. package/dist/Atomic/UI/ExampleChartIntegration/ExampleChartIntegration.js +1 -1
  93. package/dist/Atomic/UI/ExampleChartIntegration/partial/AnyOuterClass.scss +26 -17
  94. package/dist/Atomic/UI/Hint/Hint.js +7 -7
  95. package/dist/Atomic/UI/Hint/Hint.scss +38 -22
  96. package/dist/Atomic/UI/Modal/Modal.scss +90 -47
  97. package/dist/Atomic/UI/MonoAccordion/MonoAccordion.scss +17 -12
  98. package/dist/Atomic/UI/MonoAccordion/partial/AnyOuterClass.scss +8 -5
  99. package/dist/Atomic/UI/NavLine/NavLine.js +1 -1
  100. package/dist/Atomic/UI/NavLine/NavLine.scss +89 -54
  101. package/dist/Atomic/UI/NavLine/Tabs.js +72 -72
  102. package/dist/Atomic/UI/PageTitle/PageTitle.scss +41 -35
  103. package/dist/Atomic/UI/ProgressLine/ProgressLine.scss +113 -69
  104. package/dist/Atomic/UI/Status/Status.scss +21 -14
  105. package/dist/Atomic/UI/Table/Table.scss +70 -58
  106. package/dist/Atomic/UI/Table/TdTypes/TdTypes.scss +33 -29
  107. package/dist/Atomic/UI/Tag/Tag.scss +38 -24
  108. package/dist/Atomic/UI/TagList/TagList.js +1 -7
  109. package/dist/Atomic/UI/TagList/TagList.scss +11 -8
  110. package/dist/Atomic/UI/UserBox/UserBox.scss +14 -7
  111. package/dist/Functions/fieldValueFormatters.js +23 -18
  112. package/dist/Functions/usePasswordChecker.js +9 -2
  113. package/dist/Functions/utils.js +1 -1
  114. package/dist/Molecular/FormElement/FormElement.scss +7 -3
  115. package/dist/scss/_fonts.scss +143 -109
  116. package/dist/scss/_vars.scss +21 -21
  117. package/dist/scss/main.scss +33 -27
  118. package/package.json +1 -1
@@ -1,59 +1,79 @@
1
1
  @mixin fill-parent {
2
- left: 0;
3
2
  top: 0;
3
+ left: 0;
4
+
4
5
  width: 100%;
5
6
  height: 100%;
6
7
  }
7
8
 
8
9
  .loader-box {
9
10
  position: absolute;
10
- @include fill-parent;
11
- background: #fff;
12
- opacity: 0.1;
13
11
  z-index: 100;
12
+
13
+ opacity: 0.1;
14
+ background: #FFF;
15
+
16
+ @include fill-parent;
14
17
  }
18
+
15
19
  .lds-ring {
16
- display: inline-block;
17
20
  position: relative;
21
+
22
+ display: inline-block;
23
+
18
24
  width: 100px;
19
25
  height: 100px;
20
26
  }
27
+
21
28
  .lds-ring.lds-ring_little {
22
29
  width: 30px;
23
30
  height: 30px;
24
31
  }
32
+
25
33
  .lds-ring div {
26
- box-sizing: border-box;
27
- display: block;
28
34
  position: absolute;
35
+
36
+ display: block;
37
+
38
+ box-sizing: border-box;
29
39
  width: 84px;
30
40
  height: 84px;
31
41
  margin: 8px;
42
+
43
+ animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
44
+
32
45
  border: 8px solid #000;
46
+ border-color: #000 transparent transparent;
33
47
  border-radius: 50%;
34
- animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
35
- border-color: #000 transparent transparent transparent;
36
48
  }
49
+
37
50
  .lds-ring_little div {
38
51
  top: -10px;
52
+
39
53
  width: 30px !important;
40
54
  height: 30px !important;
55
+
41
56
  border: 4px solid #000 !important;
42
- border-color: #000 transparent transparent transparent !important;
57
+ border-color: #000 transparent transparent !important;
43
58
  }
59
+
44
60
  .lds-ring div:nth-child(1) {
45
61
  animation-delay: -0.45s;
46
62
  }
63
+
47
64
  .lds-ring div:nth-child(2) {
48
65
  animation-delay: -0.3s;
49
66
  }
67
+
50
68
  .lds-ring div:nth-child(3) {
51
69
  animation-delay: -0.15s;
52
70
  }
71
+
53
72
  @keyframes lds-ring {
54
73
  0% {
55
74
  transform: rotate(0deg);
56
75
  }
76
+
57
77
  100% {
58
78
  transform: rotate(360deg);
59
79
  }
@@ -1,75 +1,87 @@
1
- @import '../../../scss/vars';
2
- @import '../../../scss/mixins';
1
+ @import "../../../scss/vars";
2
+ @import "../../../scss/mixins";
3
3
 
4
4
  .accordion {
5
- &--item {
6
- border: 1px solid $color--border;
5
+ &--item {
6
+ border: 1px solid $color--border;
7
7
 
8
- &:not(:first-child) {
9
- border-top: none;
10
- }
8
+ &:not(:first-child) {
9
+ border-top: none;
11
10
  }
11
+ }
12
12
 
13
- &--title-box {
14
- display: flex;
15
- align-items: center;
16
- justify-content: space-between;
17
- cursor: pointer;
18
- padding: 10px 15px;
19
- height: 20px;
20
-
21
- &:hover {
22
- background-color: $color--gray-gentel;
23
- }
13
+ &--title-box {
14
+ display: flex;
15
+ align-items: center;
16
+ justify-content: space-between;
17
+
18
+ height: 20px;
19
+ padding: 10px 15px;
20
+
21
+ cursor: pointer;
22
+
23
+ &:hover {
24
+ background-color: $color--gray-gentel;
24
25
  }
26
+ }
25
27
 
26
- &--title {
27
- font-size: 13px;
28
- user-select: none;
29
- color: $color--text;
30
-
31
- &-chevron {
32
- transition: all 0.2s ease-out;
33
- min-height: 16px;
34
- min-width: 16px;
35
- cursor: pointer;
36
-
37
- &-open {
38
- transition: all 0.2s ease-out;
39
- transform: rotate(90deg);
40
- }
41
- }
28
+ &--title {
29
+ user-select: none;
30
+
31
+ color: $color--text;
32
+
33
+ font-size: 13px;
34
+
35
+ &-chevron {
36
+ min-width: 16px;
37
+ min-height: 16px;
38
+
39
+ cursor: pointer;
40
+ transition: all 0.2s ease-out;
41
+
42
+ &-open {
43
+ transition: all 0.2s ease-out;
44
+ transform: rotate(90deg);
45
+ }
42
46
  }
47
+ }
48
+
49
+ &--content {
50
+ display: flex;
51
+ overflow: hidden;
52
+ align-items: flex-start;
53
+ flex-direction: column;
54
+ justify-content: center;
55
+
56
+ max-height: 1000px;
57
+
58
+ transition: all 0.25s ease-out;
59
+
60
+ opacity: 0;
61
+ background: #FFF;
62
+
63
+ font-size: 13px;
64
+
65
+ @include custom-scroll;
66
+
67
+ &-is-open {
68
+ padding: 10px 15px;
69
+
70
+ transition: all 0.25s ease-out;
71
+
72
+ opacity: 1;
73
+ }
74
+
75
+ &-item {
76
+ width: calc(100% - 40px);
77
+ padding: 7.5px 20px;
78
+
79
+ a {
80
+ color: #1E1E2D;
43
81
 
44
- &--content {
45
- background: #fff;
46
- transition: all 0.25s ease-out;
47
- display: flex;
48
- flex-direction: column;
49
- justify-content: center;
50
- align-items: flex-start;
51
- overflow: hidden;
52
82
  font-size: 13px;
53
- opacity: 0;
54
- max-height: 1000px;
55
-
56
- &-is-open {
57
- transition: all 0.25s ease-out;
58
- padding: 10px 15px;
59
- opacity: 1;
60
- }
61
-
62
- &-item {
63
- padding: 7.5px 20px;
64
- width: calc(100% - 40px);
65
-
66
- a {
67
- font-size: 13px;
68
- font-weight: 300;
69
- color: #1e1e2d;
70
- }
71
- }
72
-
73
- @include custom-scroll;
83
+ font-weight: 300;
84
+ }
74
85
  }
86
+ }
75
87
  }
@@ -4,12 +4,14 @@
4
4
  align-items: flex-start;
5
5
  flex-direction: column;
6
6
  justify-content: flex-start;
7
+
7
8
  width: 100%;
8
9
  min-width: 700px;
9
10
 
10
11
  &__header {
11
12
  display: flex;
12
13
  flex-wrap: nowrap;
14
+
13
15
  width: 100%;
14
16
  height: 32px;
15
17
  }
@@ -17,22 +19,28 @@
17
19
  &__header-item {
18
20
  display: flex;
19
21
  align-items: center;
22
+
20
23
  padding: 5px 10px;
24
+
21
25
  user-select: none;
22
26
  white-space: nowrap;
23
27
  text-transform: uppercase;
24
- color: #757f8c;
25
- background-color: #ebeff2;
28
+
29
+ color: #757F8C;
30
+ background-color: #EBEFF2;
31
+
26
32
  font-size: 11px;
27
33
  font-weight: 500;
28
34
 
29
35
  &:first-child {
30
36
  padding-left: 15px;
37
+
31
38
  border-top-left-radius: 8px;
32
39
  }
33
40
 
34
41
  &:last-child {
35
42
  padding-right: 15px;
43
+
36
44
  border-top-right-radius: 8px;
37
45
  }
38
46
  }
@@ -43,7 +51,7 @@
43
51
 
44
52
  &__body-accordion {
45
53
  &:not(:first-child) {
46
- border-top: 1px solid #ebeff2;
54
+ border-top: 1px solid #EBEFF2;
47
55
  }
48
56
 
49
57
  &:last-child {
@@ -56,11 +64,13 @@
56
64
  &--closed {
57
65
  .mono-accordion__head {
58
66
  transition: all 0.3s ease-out;
67
+
59
68
  box-shadow: 0 5px 8px rgb(255 255 255 / 12%) !important;
60
69
  }
61
70
 
62
71
  .mono-accordion__container {
63
72
  transition: all 0.3s ease-out;
73
+
64
74
  opacity: 0;
65
75
  }
66
76
 
@@ -75,6 +85,7 @@
75
85
 
76
86
  &__tr {
77
87
  display: flex;
88
+
78
89
  width: 100%;
79
90
 
80
91
  &:last-child {
@@ -86,8 +97,11 @@
86
97
 
87
98
  &__td {
88
99
  padding: 11.5px 0;
100
+
89
101
  white-space: nowrap;
90
- border-bottom: 1px solid #ebeff2;
102
+
103
+ border-bottom: 1px solid #EBEFF2;
104
+
91
105
  font-size: 14px;
92
106
  font-weight: 400;
93
107
 
@@ -104,9 +118,10 @@
104
118
  }
105
119
 
106
120
  &--name {
107
- text-overflow: ellipsis;
108
- white-space: nowrap;
109
121
  overflow: hidden;
122
+
123
+ white-space: nowrap;
124
+ text-overflow: ellipsis;
110
125
  }
111
126
  }
112
127
 
@@ -122,6 +137,7 @@
122
137
 
123
138
  .accordion-table__tr {
124
139
  justify-content: flex-end;
140
+
125
141
  background-color: unset !important;
126
142
  }
127
143
 
@@ -136,41 +152,49 @@
136
152
 
137
153
  &__statistics-td {
138
154
  padding: 15px 0;
155
+
139
156
  white-space: nowrap;
157
+
140
158
  font-size: 14px;
141
159
  font-weight: 400;
142
160
 
143
161
  &:not(:last-child) {
144
- padding-right: 53px;
145
162
  display: flex;
146
163
  align-items: center;
164
+
165
+ padding-right: 53px;
147
166
  }
148
167
  }
149
168
 
150
169
  &__statistics-td-value {
151
- white-space: nowrap;
152
170
  overflow: hidden;
153
- text-overflow: ellipsis;
171
+
154
172
  margin: 0;
173
+
174
+ white-space: nowrap;
175
+ text-overflow: ellipsis;
155
176
  }
156
177
 
157
178
  &__statistics-td-value-wrapper {
158
179
  display: flex;
180
+
159
181
  min-width: 0;
160
182
  }
161
183
 
162
184
  &__tr-promo-wrapper {
163
- margin-left: 50px;
164
185
  margin-right: 15px;
165
- border-bottom: 1px solid #ebeff2;
186
+ margin-left: 50px;
187
+
188
+ border-bottom: 1px solid #EBEFF2;
166
189
  }
167
190
 
168
191
  &__tr-with-promo {
169
192
  flex-direction: column;
170
193
 
171
194
  .accordion-table__td {
172
- border-bottom: none;
173
195
  padding: 15px 0 8px;
196
+
197
+ border-bottom: none;
174
198
  }
175
199
  }
176
200
 
@@ -181,43 +205,51 @@
181
205
  }
182
206
 
183
207
  &__tr-promo {
184
- background-color: #fff4e5;
185
- border: 1px solid #ffce9f;
186
- border-radius: 8px;
187
- height: 16px;
188
208
  display: flex;
189
209
  align-items: center;
210
+
211
+ width: 40%;
212
+ height: 16px;
213
+ margin-bottom: 10px;
190
214
  padding: 4px 8px;
215
+
216
+ letter-spacing: 0.2px;
217
+
218
+ color: #3B414B;
219
+ border: 1px solid #FFCE9F;
220
+ border-radius: 8px;
221
+ background-color: #FFF4E5;
222
+
191
223
  font-size: 12px;
192
224
  font-weight: 400;
193
225
  line-height: 18px;
194
- letter-spacing: 0.2px;
195
- color: #3b414b;
196
- margin-bottom: 10px;
197
- width: 40%;
198
226
  }
199
227
 
200
228
  &__status-icon {
201
- color: #fa564c;
202
- margin-right: 5px;
203
229
  margin-top: 2px;
230
+ margin-right: 5px;
231
+
232
+ color: #FA564C;
204
233
  }
205
234
 
206
235
  .tr-promo-icon {
207
- color: #ff7d00;
236
+ color: #FF7D00;
208
237
  }
209
238
 
210
239
  .tr-promo-label {
211
- font-weight: 600;
212
- color: #ff7d00;
213
240
  margin-right: 8px;
241
+
242
+ color: #FF7D00;
243
+
244
+ font-weight: 600;
214
245
  }
215
246
 
216
247
  .accordion-label-box {
217
248
  &__label {
249
+ margin-left: 15px;
250
+
218
251
  user-select: none;
219
252
  white-space: nowrap;
220
- margin-left: 15px;
221
253
  }
222
254
 
223
255
  &__icon {
@@ -225,8 +257,10 @@
225
257
  max-width: 15px;
226
258
  min-height: 16px;
227
259
  max-height: 16px;
260
+
228
261
  transition: all 0.2s ease-out;
229
- color: #757f8c;
262
+
263
+ color: #757F8C;
230
264
 
231
265
  &--open {
232
266
  transform: rotate(180deg);
@@ -235,6 +269,7 @@
235
269
 
236
270
  &__status {
237
271
  white-space: nowrap;
272
+
238
273
  font-size: 12px;
239
274
  font-weight: 400;
240
275
  }
@@ -244,15 +279,19 @@
244
279
  &__head {
245
280
  position: relative;
246
281
  z-index: 2;
282
+
247
283
  padding: 14.5px 15px 14.5px 20px;
248
- background-color: #ffff;
284
+
285
+ background-color: #FFFF;
249
286
  box-shadow: 0 5px 8px rgb(39 73 113 / 12%);
250
287
  }
251
288
 
252
289
  &__container {
253
290
  position: relative;
291
+
254
292
  flex-direction: row;
255
- background-color: #ffff;
293
+
294
+ background-color: #FFFF;
256
295
  }
257
296
 
258
297
  &__content-wrapper {
@@ -1,63 +1,74 @@
1
1
  .advanced-tags {
2
+ position: relative;
3
+
2
4
  display: inline-flex;
3
- background-color: #e2e5ec;
4
- height: 24px;
5
5
  align-items: center;
6
6
  justify-content: center;
7
- border-radius: 2px;
8
- padding: 2px 8px;
9
- margin-right: 4px;
10
- font-size: 10px;
11
- position: relative;
7
+
8
+ height: 24px;
12
9
  margin-top: 2.5px;
10
+ margin-right: 4px;
13
11
  margin-bottom: 2.5px;
12
+ padding: 2px 8px;
14
13
 
15
- &--error {
16
- background-color: #fce2e8;
17
- }
14
+ border-radius: 2px;
15
+ background-color: #E2E5EC;
18
16
 
17
+ font-size: 10px;
19
18
 
19
+ &--error {
20
+ background-color: #FCE2E8;
21
+ }
20
22
 
21
23
  &--warning-icon {
22
- min-height: 16px;
23
24
  min-width: 16px;
25
+ min-height: 16px;
26
+
27
+ color: #F06D8D;
28
+
24
29
  font-size: 17px;
25
- color: #f06d8d;
26
30
  }
27
31
 
28
32
  &--warning-icon-wrapper {
29
- cursor: pointer;
30
33
  display: flex;
34
+
35
+ cursor: pointer;
31
36
  }
32
37
 
33
38
  &__warn-text {
34
39
  position: absolute;
35
- background-color: #6b81dd;
36
- color: #fff;
37
- font-size: 10px;
38
- line-height: 16px;
39
- border-radius: 4px;
40
- max-width: 270px;
40
+ z-index: 2;
41
+
41
42
  min-width: 80px;
43
+ max-width: 270px;
42
44
  padding: 8px;
43
- z-index: 2;
44
45
 
45
- &:before {
46
- content: '';
46
+ color: #FFF;
47
+ border-radius: 4px;
48
+ background-color: #6B81DD;
49
+
50
+ font-size: 10px;
51
+ line-height: 16px;
52
+
53
+ &::before {
47
54
  position: absolute;
55
+
48
56
  width: 8.5px;
49
57
  height: 8.5px;
50
- background-color: #6b81dd;
58
+
59
+ content: "";
51
60
  transform: rotate(45deg);
61
+
62
+ background-color: #6B81DD;
52
63
  }
53
64
 
54
65
  &--warnLeft {
55
66
  top: 30px;
56
67
  left: 4px;
57
68
 
58
- &:before {
59
- left: 8px;
69
+ &::before {
60
70
  top: -4px;
71
+ left: 8px;
61
72
  }
62
73
 
63
74
  &--to-top {
@@ -68,53 +79,58 @@
68
79
  &--warnRight {
69
80
  top: 30px;
70
81
 
71
- &:before {
72
- right: 10px;
82
+ &::before {
73
83
  top: -4px;
84
+ right: 10px;
74
85
  }
75
86
 
76
87
  &--to-top {
77
88
  top: -50px;
78
89
  }
79
90
  }
80
-
81
91
  }
82
92
 
83
93
  &--showMore {
84
- background-color: #ffedc8;
85
94
  cursor: pointer;
86
95
  user-select: none;
87
- }
88
96
 
97
+ background-color: #FFEDC8;
98
+ }
89
99
 
90
100
  &__counter {
91
- text-align: center;
92
- margin-right: -8px;
93
- padding: 0 8px 0;
94
- width: fit-content;
95
101
  position: relative;
96
102
 
103
+ width: fit-content;
104
+ margin-right: -8px;
105
+ padding: 0 8px;
106
+
107
+ text-align: center;
108
+
97
109
  &::after {
98
- content: '';
99
110
  position: absolute;
100
- height: 27px;
111
+ top: -4px;
112
+ left: 0;
113
+
101
114
  width: 2px;
102
- background-color: #9AA0B9;
115
+ height: 27px;
116
+
117
+ content: "";
118
+
103
119
  opacity: 0.2;
104
- left: 0;
105
- top: -4px;
120
+ background-color: #9AA0B9;
106
121
  }
107
122
 
108
123
  &--null {
109
- color: #9AA0B9;
110
124
  opacity: 0.7;
125
+ color: #9AA0B9;
111
126
  }
112
127
 
113
128
  &--bold {
114
- font-family: 'Roboto';
115
- font-weight: 700;
116
- font-size: 11px;
117
129
  color: #1E1E2D;
130
+
131
+ font-family: Roboto, sans-serif;
132
+ font-size: 11px;
133
+ font-weight: 700;
118
134
  }
119
135
  }
120
136