Refactor CSS classes

This commit is contained in:
Amine Ben hammou
2019-07-03 02:18:13 +01:00
committed by M. Shull
parent bae579e7be
commit 2804d1770a
2 changed files with 5 additions and 10 deletions

View File

@@ -22,28 +22,23 @@
.mailpoet_base_notice { .mailpoet_base_notice {
background: #fff; background: #fff;
border-left: 4px solid transparent;
box-shadow: 0 1px 1px 0 rgba(0, 0, 0, .1); box-shadow: 0 1px 1px 0 rgba(0, 0, 0, .1);
margin: 5px 0 15px; margin: 5px 0 15px;
padding: 1px 12px; padding: 1px 12px;
} }
.mailpoet_success_notice { .mailpoet_success_notice {
@extend .mailpoet_base_notice; border-left: 4px solid #46b450;
border-left-color: #46b450;
} }
.mailpoet_error_notice { .mailpoet_error_notice {
@extend .mailpoet_base_notice; border-left: 4px solid #dc3232;
border-left-color: #dc3232;
} }
.mailpoet_warning_notice { .mailpoet_warning_notice {
@extend .mailpoet_base_notice; border-left: 4px solid #ffb900;
border-left-color: #ffb900;
} }
.mailpoet_info_notice { .mailpoet_info_notice {
@extend .mailpoet_base_notice; border-left: 4px solid #00a0d2;
border-left-color: #00a0d2;
} }

View File

@@ -22,7 +22,7 @@ const Notice = (props) => {
if (hidden) return null; if (hidden) return null;
return ReactDOM.createPortal( return ReactDOM.createPortal(
<div ref={elementRef} className={`mailpoet_${props.type}_notice`}>{props.children}</div>, <div ref={elementRef} className={`mailpoet_base_notice mailpoet_${props.type}_notice`}>{props.children}</div>,
document.getElementById('mailpoet_notices') document.getElementById('mailpoet_notices')
); );
}; };