consul/ui-v2/app/styles/components/flash-message.scss

50 lines
855 B
SCSS

.flash-message {
@extend %flash-message;
}
%flash-message p.success strong {
@extend %with-passing;
}
%flash-message p.success {
border-color: $green;
background-color: rgba($green, 0.1);
}
%flash-message p {
color: $green;
}
%flash-message p.error strong {
@extend %with-critical;
}
%flash-message p.error {
border-color: $red;
background-color: rgba($red, 0.1);
}
%flash-message p.error {
color: $red;
}
%flash-message p {
border-radius: $radius-small;
border: 1px solid;
}
%flash-message {
display: flex;
position: relative;
justify-content: center;
}
%flash-message p {
bottom: -10px;
position: absolute;
padding: 9px 15px;
}
%flash-message p strong {
color: inherit;
}
%flash-message p strong {
position: relative;
display: inline-block;
padding-left: 20px;
}
%flash-message p strong::before {
left: 0;
}