@megafon/ui-core 3.0.0 → 3.0.1

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 (17) hide show
  1. package/CHANGELOG.md +30 -19
  2. package/README.md +2 -2
  3. package/dist/es/colors/colorsData.js +1 -1
  4. package/dist/es/components/Button/Button.css +3 -3
  5. package/dist/es/components/Logo/Logo.js +1 -1
  6. package/dist/es/components/NavArrow/NavArrow.css +1 -1
  7. package/dist/es/components/Notification/Notification.css +34 -25
  8. package/dist/es/components/Notification/Notification.js +4 -2
  9. package/dist/lib/colors/colorsData.js +1 -1
  10. package/dist/lib/components/Button/Button.css +3 -3
  11. package/dist/lib/components/Logo/Logo.js +1 -1
  12. package/dist/lib/components/NavArrow/NavArrow.css +1 -1
  13. package/dist/lib/components/Notification/Notification.css +34 -25
  14. package/dist/lib/components/Notification/Notification.js +4 -2
  15. package/package.json +4 -4
  16. package/styles/colors.css +2 -2
  17. package/styles/colorsDark.css +1 -1
package/CHANGELOG.md CHANGED
@@ -3,6 +3,21 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [3.0.1](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-core@3.0.0...@megafon/ui-core@3.0.1) (2022-02-11)
7
+
8
+
9
+ ### Bug Fixes
10
+
11
+ * **colors:** fix button hover purple color name and value ([c333348](https://github.com/MegafonWebLab/megafon-ui/commit/c3333489826338f49e4ecb1c1beb07ee9044167e))
12
+ * **colors:** fix typo in brandPurple color ([f7bdb49](https://github.com/MegafonWebLab/megafon-ui/commit/f7bdb4956247a4bf2112c130e960a98f8cea0696))
13
+ * **logo:** fix green color for vertical logo ([c9aed9d](https://github.com/MegafonWebLab/megafon-ui/commit/c9aed9db957cb9857cc20afa8dd824e241e12114))
14
+ * **notification:** fix styles ([7d93f3e](https://github.com/MegafonWebLab/megafon-ui/commit/7d93f3ea0e61af9647478af03f84e963d5d52e0f))
15
+ * revert mistake version ([cc8668a](https://github.com/MegafonWebLab/megafon-ui/commit/cc8668a9ff2bc5fde6bf93ca806d4406a5944107))
16
+
17
+
18
+
19
+
20
+
6
21
  # [3.0.0](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-core@2.5.0...@megafon/ui-core@3.0.0) (2022-02-09)
7
22
 
8
23
 
@@ -13,20 +28,12 @@ See [Conventional Commits](https://conventionalcommits.org) for commit guideline
13
28
  * **calendar/month:** add focus on month arrows, add enter press handlers ([caad017](https://github.com/MegafonWebLab/megafon-ui/commit/caad0176a9d272b19da11ddfac1830d863d090ae))
14
29
  * **checkbox:** add focus on custom checkbox, add enter press handler ([136872c](https://github.com/MegafonWebLab/megafon-ui/commit/136872c84c058502a46d5b6db5088bebd71ebdb8))
15
30
  * **checkbox:** add isChecked state, change type of onChange prop ([be62e30](https://github.com/MegafonWebLab/megafon-ui/commit/be62e30f43dcee4c43cab5425c4ddc0c6954f3f7))
16
- * **colors:** fix colors component ([a45d223](https://github.com/MegafonWebLab/megafon-ui/commit/a45d223e8af199df87c7b0a1fb8278093ecd54b9))
17
- * **colors:** remove unused classname modifiers ([2536f98](https://github.com/MegafonWebLab/megafon-ui/commit/2536f9878456979e1ea56615ca99eaa19b6ab7a3))
18
- * **colors:** remove unused method ([50ee358](https://github.com/MegafonWebLab/megafon-ui/commit/50ee358233787dd3f855abea071ea11aa9df9785))
19
- * **colors:** renabe green and purple to brandGreen and brandPurple to avoid postcss-colormin bug ([089dd42](https://github.com/MegafonWebLab/megafon-ui/commit/089dd42cd18db7fc83e690da45d09b88c636a6f7))
20
- * **colors:** rename green and purple to brandGreen and brandPurple ([e8ec148](https://github.com/MegafonWebLab/megafon-ui/commit/e8ec1488a249748ca6468bfa53eed56e9fcbb5e4))
21
- * **colors:** update color values on colors page when user switches theme ([8eb66de](https://github.com/MegafonWebLab/megafon-ui/commit/8eb66dec2ef9de5615ad8c921c422b6a9f00893a))
22
31
  * **components:** change tests for dataAttrs prop ([eae8ecb](https://github.com/MegafonWebLab/megafon-ui/commit/eae8ecb5104c050ec0e67357ed5edecdfb042838))
23
32
  * **core:** fix build ui-core ([fa9522a](https://github.com/MegafonWebLab/megafon-ui/commit/fa9522ac0931edb7ec772ad040557997db080687))
24
33
  * **core:** separated colors.css file ([3a0af6b](https://github.com/MegafonWebLab/megafon-ui/commit/3a0af6b31d711016faa92bc7402ce02c6d8710ae))
25
34
  * **less:** import base.less file through reference ([20bd43d](https://github.com/MegafonWebLab/megafon-ui/commit/20bd43d60f9cfac102c55ccdf183578702d2eb96))
26
35
  * **paragraph:** remove spbSky... values from color prop ([3a74e2b](https://github.com/MegafonWebLab/megafon-ui/commit/3a74e2ba23b41a1982f72cb1a869e0253c903180))
27
36
  * **switcher:** fix switcher design ([642d679](https://github.com/MegafonWebLab/megafon-ui/commit/642d679d6c48c4a96093220415a68c9444d8cb53))
28
- * color props values changes ([9e3dd31](https://github.com/MegafonWebLab/megafon-ui/commit/9e3dd31a8fd57012482c68c1173aae74028aa3a9))
29
- * remove deprecated props values ([d09c460](https://github.com/MegafonWebLab/megafon-ui/commit/d09c4606ce6e41f7144e18c2216d039d859288e2))
30
37
  * **textlink:** fix color prop type ([4e93cce](https://github.com/MegafonWebLab/megafon-ui/commit/4e93ccef6bcbb1a5e670089dfafe308c23fcbe1e))
31
38
  * **tooltip:** add check event function from ui-helpers ([18ef333](https://github.com/MegafonWebLab/megafon-ui/commit/18ef333ba78f7804731da2116b124cdc44a8dfcb))
32
39
 
@@ -35,30 +42,34 @@ See [Conventional Commits](https://conventionalcommits.org) for commit guideline
35
42
 
36
43
  * **accordion:** remove prop hasVerticalPaddings ([c1f0139](https://github.com/MegafonWebLab/megafon-ui/commit/c1f01398154497ed69fb2bb725077e3cc3b5c47e))
37
44
  * **colors:** css custom properties and color themes support ([16df5b7](https://github.com/MegafonWebLab/megafon-ui/commit/16df5b7b2644e15bb6c6e49e7347c0f8e4839e58))
45
+ * **colors:** rename green and purple to brandGreen and brandPurple to avoid postcss-colormin bug ([089dd42](https://github.com/MegafonWebLab/megafon-ui/commit/089dd42cd18db7fc83e690da45d09b88c636a6f7))
46
+ * **colors:** update color values on colors page when user switches theme ([8eb66de](https://github.com/MegafonWebLab/megafon-ui/commit/8eb66dec2ef9de5615ad8c921c422b6a9f00893a))
38
47
  * **components:** add dataAttrs props in new format ([e9cf812](https://github.com/MegafonWebLab/megafon-ui/commit/e9cf8122ac47f83a8e744e0695351d60aa711dbd))
39
48
  * **header:** made header as a functional component ([b983934](https://github.com/MegafonWebLab/megafon-ui/commit/b983934ced137ede35f64ce2dfe0c953c1690db0))
40
49
  * **radiobutton:** made radiobutton as a functional component ([b225e1d](https://github.com/MegafonWebLab/megafon-ui/commit/b225e1d5e1964fd1e7010a9051586fb627cc90c3))
41
50
  * **select:** made select as a functional component ([fc9cfc2](https://github.com/MegafonWebLab/megafon-ui/commit/fc9cfc25505952080bf90095ab183367915d27e6))
42
51
  * **styles:** export css version for base.less ([acdea73](https://github.com/MegafonWebLab/megafon-ui/commit/acdea73462713156dee077fde4c223879e356b4d))
52
+ * remove deprecated props values ([d09c460](https://github.com/MegafonWebLab/megafon-ui/commit/d09c4606ce6e41f7144e18c2216d039d859288e2))
53
+
43
54
 
44
55
 
45
56
  ### BREAKING CHANGES
46
57
 
47
- * **paragraph:** remove from color prop values: spbSky0, spbSky1, spbSky2
48
58
  * **accordion:** remove prop hasVerticalPaddings
49
- * ContentArea: prop color change values from 'base' to 'white' and from 'content' to 'default';
50
- remove depreacted value 'freshAsphalt'
51
- Paragraph: prop color change values from 'base' to 'white' and from 'contend' to 'default';
52
- remove deprecared values 'freshAsphalt' and 'clearWhite'
53
- StoreBanner: prop theme change value from 'black' to 'default'; remove deprecated value 'clearWhite'
54
- * ContentArea, Paragraph, StoreBanner and Breadcrumbs components from no don't have
55
- freshAsphalt and clearWhite as values for colorize props
56
- * **checkbox:** change type of onChange prop on (checked: boolean) => void
57
59
  * **accordion:** remove parameter 'title' in onClickAccordion prop
58
- * **tooltip:** change onOpen, onClose types; AccessibilityEventTypeNative from @megafon/ui-helpers
60
+ * **checkbox:** change type of onChange prop on (checked: boolean) => void
59
61
  * **colors:** green, green20, green80, purple, purple20 and purple80 colors now have 'brand'
60
62
  prefix (e.g. brandGreen)
61
- * **colors:** read commit description
63
+ * **contentarea**: prop color change values from 'base' to 'white' and from 'content' to 'default';
64
+ remove depreacted value 'freshAsphalt'
65
+ * **contentarea**, **paragraph**, **storebanner** and **breadcrumbs** components from no don't have
66
+ 'freshAsphalt' and 'clearWhite' as values for colorizing props
67
+ * **paragraph:** remove from color prop values: 'spbSky0', 'spbSky1', 'spbSky2'
68
+ * **paragraph**: prop color change values from 'base' to 'white' and from 'contend' to 'default';
69
+ remove deprecared values 'freshAsphalt' and 'clearWhite'
70
+ * **storebanner**: prop theme change value from 'black' to 'default'; remove deprecated value 'clearWhite'
71
+ * **tooltip:** change onOpen, onClose types; AccessibilityEventTypeNative from @megafon/ui-helpers
72
+ * **components:** for the components to work correctly, now it's needed to import colors.css file
62
73
 
63
74
 
64
75
 
package/README.md CHANGED
@@ -5,8 +5,8 @@ React UI components library.
5
5
  ## Getting started
6
6
 
7
7
  ```bash
8
- $ npm install --save @megafon/ui-core@beta
8
+ $ npm install --save @megafon/ui-core
9
9
  ```
10
10
  ```bash
11
- $ yarn add @megafon/ui-core@beta
11
+ $ yarn add @megafon/ui-core
12
12
  ```
package/dist/es/colors/colorsData.js CHANGED
@@ -73,7 +73,7 @@ var colors = {
73
73
  code: 'buttonHoverGreen'
74
74
  }, {
75
75
  name: 'Button Hov. P.',
76
- code: 'buttonhoverPurple'
76
+ code: 'buttonHoverPurple'
77
77
  }, {
78
78
  name: 'Button Down',
79
79
  code: 'buttonDown'
package/dist/es/components/Button/Button.css CHANGED
@@ -224,9 +224,9 @@
224
224
  fill: var(--stcWhite);
225
225
  }
226
226
  .mfui-button_no-touch.mfui-button_type_primary.mfui-button_theme_purple:not(.mfui-button_loading):hover {
227
- background-color: var(--buttonhoverPurple);
228
- -webkit-box-shadow: inset 0 0 0 1px var(--buttonhoverPurple);
229
- box-shadow: inset 0 0 0 1px var(--buttonhoverPurple);
227
+ background-color: var(--buttonHoverPurple);
228
+ -webkit-box-shadow: inset 0 0 0 1px var(--buttonHoverPurple);
229
+ box-shadow: inset 0 0 0 1px var(--buttonHoverPurple);
230
230
  }
231
231
  .mfui-button_no-touch.mfui-button_type_primary.mfui-button_theme_purple:not(.mfui-button_loading):active {
232
232
  background-color: var(--buttonDown);
package/dist/es/components/Logo/Logo.js CHANGED
@@ -25,7 +25,7 @@ var greenVerticalImg = function greenVerticalImg(props) {
25
25
  fill: "none",
26
26
  d: "M-213 356.4h169v128.5h-169z"
27
27
  }), /*#__PURE__*/React.createElement("g", {
28
- fill: "#00985F"
28
+ fill: "#00B956"
29
29
  }, /*#__PURE__*/React.createElement("path", {
30
30
  d: "M-124.9 372.3v32.4c0 1.4-1.2 2.5-2.6 2.5h-3.9c-.2 0-.3.2-.3.3v27.2c1 .1 1.9.1 2.9.1 17.4 0 31.5-14.1 31.5-31.5 0-15.8-12-29.1-27.6-31zm-.6 48.4c-2.2 0-3.9-1.8-3.9-3.9 0-2.2 1.8-3.9 3.9-3.9 2.2 0 3.9 1.8 3.9 3.9 0 2.2-1.8 3.9-3.9 3.9zm9.2 0c-2.2 0-3.9-1.8-3.9-3.9 0-2.2 1.8-3.9 3.9-3.9 2.2 0 3.9 1.8 3.9 3.9 0 2.2-1.7 3.9-3.9 3.9zm9.2 0c-2.2 0-3.9-1.8-3.9-3.9 0-2.2 1.8-3.9 3.9-3.9s3.9 1.8 3.9 3.9c0 2.2-1.7 3.9-3.9 3.9z"
31
31
  }), /*#__PURE__*/React.createElement("path", {
package/dist/es/components/NavArrow/NavArrow.css CHANGED
@@ -28,7 +28,7 @@
28
28
  background-color: var(--brandPurple);
29
29
  }
30
30
  .mfui-nav-arrow_theme_purple:hover:not(:disabled) {
31
- background-color: var(--buttonhoverPurple);
31
+ background-color: var(--buttonHoverPurple);
32
32
  }
33
33
  .mfui-nav-arrow_theme_dark {
34
34
  background-color: var(--stcBlack20);
package/dist/es/components/Notification/Notification.css CHANGED
@@ -126,31 +126,38 @@ h5 {
126
126
  }
127
127
  .mfui-notification__close {
128
128
  position: absolute;
129
- top: 12px;
130
- right: 12px;
129
+ top: 8px;
130
+ right: 8px;
131
131
  display: -webkit-box;
132
132
  display: -ms-flexbox;
133
133
  display: flex;
134
+ -webkit-box-align: center;
135
+ -ms-flex-align: center;
136
+ align-items: center;
137
+ -webkit-box-pack: center;
138
+ -ms-flex-pack: center;
139
+ justify-content: center;
140
+ width: 24px;
141
+ height: 24px;
134
142
  padding: 0;
135
143
  border: none;
136
144
  border-radius: 50%;
137
- background: transparent;
138
- cursor: pointer;
139
- }
140
- .mfui-notification__close:hover {
141
145
  background-color: var(--stcBlack5);
142
- }
143
- .mfui-notification__close-icon {
144
- width: 20px;
145
- height: 20px;
146
- fill: var(--content);
146
+ cursor: pointer;
147
147
  }
148
148
  @media screen and (min-width: 768px) {
149
- .mfui-notification__close-icon {
149
+ .mfui-notification__close {
150
+ top: 12px;
151
+ right: 12px;
150
152
  width: 32px;
151
153
  height: 32px;
152
154
  }
153
155
  }
156
+ .mfui-notification__close-icon {
157
+ width: 10px;
158
+ height: 10px;
159
+ fill: var(--stcBlack50);
160
+ }
154
161
  .mfui-notification_type_error .mfui-notification__icon-container {
155
162
  background-color: var(--fury20);
156
163
  }
@@ -182,36 +189,38 @@ h5 {
182
189
  .mfui-notification_colored .mfui-notification__icon-container {
183
190
  background-color: var(--stcWhite);
184
191
  }
185
- .mfui-notification_colored .mfui-notification__close:hover {
186
- background-color: var(--stcWhite);
192
+ .mfui-notification_colored.mfui-notification_type_success {
193
+ background-color: var(--brandGreen20);
187
194
  }
188
195
  .mfui-notification_colored.mfui-notification_type_success .mfui-notification__title,
189
- .mfui-notification_colored.mfui-notification_type_error .mfui-notification__title,
190
196
  .mfui-notification_colored.mfui-notification_type_success .mfui-notification__text,
197
+ .mfui-notification_colored.mfui-notification_type_success .mfui-notification__link {
198
+ color: var(--stcBlack);
199
+ }
200
+ .mfui-notification_colored.mfui-notification_type_success .mfui-notification__right-arrow {
201
+ fill: var(--stcBlack);
202
+ }
203
+ .mfui-notification_colored.mfui-notification_type_success .mfui-notification__icon-container {
204
+ background-color: var(--stcWhite);
205
+ }
206
+ .mfui-notification_colored.mfui-notification_type_error {
207
+ background-color: var(--fury80);
208
+ }
209
+ .mfui-notification_colored.mfui-notification_type_error .mfui-notification__title,
191
210
  .mfui-notification_colored.mfui-notification_type_error .mfui-notification__text,
192
- .mfui-notification_colored.mfui-notification_type_success .mfui-notification__link,
193
211
  .mfui-notification_colored.mfui-notification_type_error .mfui-notification__link {
194
212
  color: var(--stcWhite);
195
213
  }
196
- .mfui-notification_colored.mfui-notification_type_success .mfui-notification__right-arrow,
197
214
  .mfui-notification_colored.mfui-notification_type_error .mfui-notification__right-arrow {
198
215
  fill: var(--stcWhite);
199
216
  }
200
- .mfui-notification_colored.mfui-notification_type_success .mfui-notification__icon-container,
201
217
  .mfui-notification_colored.mfui-notification_type_error .mfui-notification__icon-container {
202
218
  background-color: var(--stcWhite20);
203
219
  }
204
- .mfui-notification_colored.mfui-notification_type_success .mfui-notification__icon-container svg,
205
220
  .mfui-notification_colored.mfui-notification_type_error .mfui-notification__icon-container svg {
206
221
  /* stylelint-disable-line max-nesting-depth */
207
222
  fill: var(--stcWhite);
208
223
  }
209
- .mfui-notification_colored.mfui-notification_type_success {
210
- background-color: var(--brandGreen);
211
- }
212
- .mfui-notification_colored.mfui-notification_type_error {
213
- background-color: var(--fury80);
214
- }
215
224
  .mfui-notification_colored.mfui-notification_type_info .mfui-notification__title,
216
225
  .mfui-notification_colored.mfui-notification_type_warning .mfui-notification__title,
217
226
  .mfui-notification_colored.mfui-notification_type_info .mfui-notification__text,
package/dist/es/components/Notification/Notification.js CHANGED
@@ -53,9 +53,11 @@ var InfoIcon = function InfoIcon(props) {
53
53
 
54
54
  var CancelIcon = function CancelIcon(props) {
55
55
  return /*#__PURE__*/React.createElement("svg", _extends({
56
- viewBox: "0 0 40 40"
56
+ viewBox: "0 0 10 10"
57
57
  }, props), /*#__PURE__*/React.createElement("path", {
58
- d: "M20 18.586l6.364-6.364 1.414 1.414L21.414 20l6.364 6.364-1.414 1.414L20 21.414l-6.364 6.364-1.414-1.414L18.586 20l-6.364-6.364 1.414-1.414L20 18.586z"
58
+ fillRule: "evenodd",
59
+ clipRule: "evenodd",
60
+ d: "M5 3.75L1.25 0 0 1.25 3.75 5 0 8.75 1.25 10 5 6.25 8.75 10 10 8.75 6.25 5 10 1.25 8.75 0 5 3.75z"
59
61
  }));
60
62
  };
61
63
 
package/dist/lib/colors/colorsData.js CHANGED
@@ -79,7 +79,7 @@ var colors = {
79
79
  code: 'buttonHoverGreen'
80
80
  }, {
81
81
  name: 'Button Hov. P.',
82
- code: 'buttonhoverPurple'
82
+ code: 'buttonHoverPurple'
83
83
  }, {
84
84
  name: 'Button Down',
85
85
  code: 'buttonDown'
package/dist/lib/components/Button/Button.css CHANGED
@@ -224,9 +224,9 @@
224
224
  fill: var(--stcWhite);
225
225
  }
226
226
  .mfui-button_no-touch.mfui-button_type_primary.mfui-button_theme_purple:not(.mfui-button_loading):hover {
227
- background-color: var(--buttonhoverPurple);
228
- -webkit-box-shadow: inset 0 0 0 1px var(--buttonhoverPurple);
229
- box-shadow: inset 0 0 0 1px var(--buttonhoverPurple);
227
+ background-color: var(--buttonHoverPurple);
228
+ -webkit-box-shadow: inset 0 0 0 1px var(--buttonHoverPurple);
229
+ box-shadow: inset 0 0 0 1px var(--buttonHoverPurple);
230
230
  }
231
231
  .mfui-button_no-touch.mfui-button_type_primary.mfui-button_theme_purple:not(.mfui-button_loading):active {
232
232
  background-color: var(--buttonDown);
package/dist/lib/components/Logo/Logo.js CHANGED
@@ -44,7 +44,7 @@ var greenVerticalImg = function greenVerticalImg(props) {
44
44
  fill: "none",
45
45
  d: "M-213 356.4h169v128.5h-169z"
46
46
  }), /*#__PURE__*/React.createElement("g", {
47
- fill: "#00985F"
47
+ fill: "#00B956"
48
48
  }, /*#__PURE__*/React.createElement("path", {
49
49
  d: "M-124.9 372.3v32.4c0 1.4-1.2 2.5-2.6 2.5h-3.9c-.2 0-.3.2-.3.3v27.2c1 .1 1.9.1 2.9.1 17.4 0 31.5-14.1 31.5-31.5 0-15.8-12-29.1-27.6-31zm-.6 48.4c-2.2 0-3.9-1.8-3.9-3.9 0-2.2 1.8-3.9 3.9-3.9 2.2 0 3.9 1.8 3.9 3.9 0 2.2-1.8 3.9-3.9 3.9zm9.2 0c-2.2 0-3.9-1.8-3.9-3.9 0-2.2 1.8-3.9 3.9-3.9 2.2 0 3.9 1.8 3.9 3.9 0 2.2-1.7 3.9-3.9 3.9zm9.2 0c-2.2 0-3.9-1.8-3.9-3.9 0-2.2 1.8-3.9 3.9-3.9s3.9 1.8 3.9 3.9c0 2.2-1.7 3.9-3.9 3.9z"
50
50
  }), /*#__PURE__*/React.createElement("path", {
package/dist/lib/components/NavArrow/NavArrow.css CHANGED
@@ -28,7 +28,7 @@
28
28
  background-color: var(--brandPurple);
29
29
  }
30
30
  .mfui-nav-arrow_theme_purple:hover:not(:disabled) {
31
- background-color: var(--buttonhoverPurple);
31
+ background-color: var(--buttonHoverPurple);
32
32
  }
33
33
  .mfui-nav-arrow_theme_dark {
34
34
  background-color: var(--stcBlack20);
package/dist/lib/components/Notification/Notification.css CHANGED
@@ -126,31 +126,38 @@ h5 {
126
126
  }
127
127
  .mfui-notification__close {
128
128
  position: absolute;
129
- top: 12px;
130
- right: 12px;
129
+ top: 8px;
130
+ right: 8px;
131
131
  display: -webkit-box;
132
132
  display: -ms-flexbox;
133
133
  display: flex;
134
+ -webkit-box-align: center;
135
+ -ms-flex-align: center;
136
+ align-items: center;
137
+ -webkit-box-pack: center;
138
+ -ms-flex-pack: center;
139
+ justify-content: center;
140
+ width: 24px;
141
+ height: 24px;
134
142
  padding: 0;
135
143
  border: none;
136
144
  border-radius: 50%;
137
- background: transparent;
138
- cursor: pointer;
139
- }
140
- .mfui-notification__close:hover {
141
145
  background-color: var(--stcBlack5);
142
- }
143
- .mfui-notification__close-icon {
144
- width: 20px;
145
- height: 20px;
146
- fill: var(--content);
146
+ cursor: pointer;
147
147
  }
148
148
  @media screen and (min-width: 768px) {
149
- .mfui-notification__close-icon {
149
+ .mfui-notification__close {
150
+ top: 12px;
151
+ right: 12px;
150
152
  width: 32px;
151
153
  height: 32px;
152
154
  }
153
155
  }
156
+ .mfui-notification__close-icon {
157
+ width: 10px;
158
+ height: 10px;
159
+ fill: var(--stcBlack50);
160
+ }
154
161
  .mfui-notification_type_error .mfui-notification__icon-container {
155
162
  background-color: var(--fury20);
156
163
  }
@@ -182,36 +189,38 @@ h5 {
182
189
  .mfui-notification_colored .mfui-notification__icon-container {
183
190
  background-color: var(--stcWhite);
184
191
  }
185
- .mfui-notification_colored .mfui-notification__close:hover {
186
- background-color: var(--stcWhite);
192
+ .mfui-notification_colored.mfui-notification_type_success {
193
+ background-color: var(--brandGreen20);
187
194
  }
188
195
  .mfui-notification_colored.mfui-notification_type_success .mfui-notification__title,
189
- .mfui-notification_colored.mfui-notification_type_error .mfui-notification__title,
190
196
  .mfui-notification_colored.mfui-notification_type_success .mfui-notification__text,
197
+ .mfui-notification_colored.mfui-notification_type_success .mfui-notification__link {
198
+ color: var(--stcBlack);
199
+ }
200
+ .mfui-notification_colored.mfui-notification_type_success .mfui-notification__right-arrow {
201
+ fill: var(--stcBlack);
202
+ }
203
+ .mfui-notification_colored.mfui-notification_type_success .mfui-notification__icon-container {
204
+ background-color: var(--stcWhite);
205
+ }
206
+ .mfui-notification_colored.mfui-notification_type_error {
207
+ background-color: var(--fury80);
208
+ }
209
+ .mfui-notification_colored.mfui-notification_type_error .mfui-notification__title,
191
210
  .mfui-notification_colored.mfui-notification_type_error .mfui-notification__text,
192
- .mfui-notification_colored.mfui-notification_type_success .mfui-notification__link,
193
211
  .mfui-notification_colored.mfui-notification_type_error .mfui-notification__link {
194
212
  color: var(--stcWhite);
195
213
  }
196
- .mfui-notification_colored.mfui-notification_type_success .mfui-notification__right-arrow,
197
214
  .mfui-notification_colored.mfui-notification_type_error .mfui-notification__right-arrow {
198
215
  fill: var(--stcWhite);
199
216
  }
200
- .mfui-notification_colored.mfui-notification_type_success .mfui-notification__icon-container,
201
217
  .mfui-notification_colored.mfui-notification_type_error .mfui-notification__icon-container {
202
218
  background-color: var(--stcWhite20);
203
219
  }
204
- .mfui-notification_colored.mfui-notification_type_success .mfui-notification__icon-container svg,
205
220
  .mfui-notification_colored.mfui-notification_type_error .mfui-notification__icon-container svg {
206
221
  /* stylelint-disable-line max-nesting-depth */
207
222
  fill: var(--stcWhite);
208
223
  }
209
- .mfui-notification_colored.mfui-notification_type_success {
210
- background-color: var(--brandGreen);
211
- }
212
- .mfui-notification_colored.mfui-notification_type_error {
213
- background-color: var(--fury80);
214
- }
215
224
  .mfui-notification_colored.mfui-notification_type_info .mfui-notification__title,
216
225
  .mfui-notification_colored.mfui-notification_type_warning .mfui-notification__title,
217
226
  .mfui-notification_colored.mfui-notification_type_info .mfui-notification__text,
package/dist/lib/components/Notification/Notification.js CHANGED
@@ -75,9 +75,11 @@ var InfoIcon = function InfoIcon(props) {
75
75
 
76
76
  var CancelIcon = function CancelIcon(props) {
77
77
  return /*#__PURE__*/_react["default"].createElement("svg", (0, _extends2["default"])({
78
- viewBox: "0 0 40 40"
78
+ viewBox: "0 0 10 10"
79
79
  }, props), /*#__PURE__*/_react["default"].createElement("path", {
80
- d: "M20 18.586l6.364-6.364 1.414 1.414L21.414 20l6.364 6.364-1.414 1.414L20 21.414l-6.364 6.364-1.414-1.414L18.586 20l-6.364-6.364 1.414-1.414L20 18.586z"
80
+ fillRule: "evenodd",
81
+ clipRule: "evenodd",
82
+ d: "M5 3.75L1.25 0 0 1.25 3.75 5 0 8.75 1.25 10 5 6.25 8.75 10 10 8.75 6.25 5 10 1.25 8.75 0 5 3.75z"
81
83
  }));
82
84
  };
83
85
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@megafon/ui-core",
3
- "version": "3.0.0",
3
+ "version": "3.0.1",
4
4
  "files": [
5
5
  "dist",
6
6
  "styles"
@@ -54,7 +54,7 @@
54
54
  "@babel/preset-env": "^7.8.6",
55
55
  "@babel/preset-react": "^7.8.3",
56
56
  "@babel/preset-typescript": "^7.8.3",
57
- "@megafon/ui-icons": "^1.0.0",
57
+ "@megafon/ui-icons": "^1.0.1",
58
58
  "@svgr/core": "^2.4.1",
59
59
  "@testing-library/react-hooks": "^7.0.1",
60
60
  "@types/enzyme": "^3.10.5",
@@ -86,7 +86,7 @@
86
86
  "dependencies": {
87
87
  "@babel/runtime": "^7.8.4",
88
88
  "@datepicker-react/hooks": "^2.7.0",
89
- "@megafon/ui-helpers": "^2.0.0",
89
+ "@megafon/ui-helpers": "^2.0.1",
90
90
  "@popperjs/core": "^2.5.3",
91
91
  "core-js": "^3.6.4",
92
92
  "date-fns": "^2.16.1",
@@ -97,5 +97,5 @@
97
97
  "react-popper": "^2.2.3",
98
98
  "swiper": "^6.5.6"
99
99
  },
100
- "gitHead": "6c0ceaf24ab250ae0d733395974991f0b58572b6"
100
+ "gitHead": "1affe80f981e92478c481a3f344c8d210d3028c8"
101
101
  }
package/styles/colors.css CHANGED
@@ -1,7 +1,7 @@
1
1
  :root {
2
2
  /* Basic Colors */
3
3
  --brandGreen: #00B956;
4
- --beandPurple: #731982;
4
+ --brandPurple: #731982;
5
5
  --base: #FFFFFF;
6
6
  --content: #333333;
7
7
  --spbSky0: #F6F6F6;
@@ -20,7 +20,7 @@
20
20
  --systemBlue: #34AAF2;
21
21
  --background: #FFFFFF;
22
22
  --buttonHoverGreen: #10E272;
23
- --buttonhoverPurple: #534455;
23
+ --buttonHoverPurple: #A500BF;
24
24
  --buttonDown: #404D46;
25
25
 
26
26
  /* Gradients */
package/styles/colorsDark.css CHANGED
@@ -21,7 +21,7 @@
21
21
  --systemBlue: #34AAF2;
22
22
  --background: #1F1F1F;
23
23
  --buttonHoverGreen: #10E272;
24
- --buttonhoverPurple: #534455;
24
+ --buttonHoverPurple: #A500BF;
25
25
  --buttonDown: #404D46;
26
26
 
27
27
  /* Gradients */