Update flash message styling (#1140)

This commit is contained in:
RachelElysia 2021-06-18 14:54:50 -04:00 committed by GitHub
parent e984e6fc14
commit 3ed6573ff3
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -9,20 +9,22 @@
}
.flash-message {
@include position(absolute, 0 0 null 0);
@include position(fixed);
top: 80px;
left: 50%;
transform: translate(-50%, 0);
display: flex;
align-items: center;
justify-content: center;
color: $core-white;
padding: $pad-small;
color: $core-fleet-blue;
padding: 0 $pad-small 0 $pad-medium;
z-index: 3;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25);
background-color: #3d4758;
min-width: $min-width;
&--full-width {
left: 0;
}
background-color: $core-white;
margin: auto;
border: 1px solid $ui-fleet-blue-15;
box-sizing: border-box;
box-shadow: 0px 7px 3px -5px rgba(25, 33, 71, 0.1);
border-radius: 8px;
&--success {
.fleeticon {
@ -52,7 +54,7 @@
}
&__undo {
color: $core-white;
color: $core-vibrant-blue;
cursor: pointer;
font-size: $small;
text-decoration: underline;
@ -81,7 +83,7 @@
text-decoration: none;
.button::after {
content: url("../assets/images/icon-close-white-16x16@2x.png");
content: url("../assets/images/icon-close-fleet-blue-16x16@2x.png");
transform: scale(0.5);
border-radius: 0px;
z-index: 4;