You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

49 lines
963 B

.alert {
background-color: #FFF;
border-right: 3px solid mc('grey', '500');
position: fixed;
top: 60px;
margin-left: 10px;
right: 10px;
max-width: 500px;
z-index: 1000;
display: flex;
box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
animation-duration: .6s;
&-icon {
width: 50px;
height: 50px;
background-color: mc('grey', '500');
color: #FFF;
display: flex;
align-items: center;
justify-content: center;
font-size: 24px;
}
&-msg {
padding: 0 15px;
display: flex;
align-items: center;
justify-content: flex-start;
border-top: 1px solid mc('grey', '200');
font-size: 14px;
font-weight: 500;
}
@each $color, $colorvalue in $material-colors {
&.is-#{$color} {
border-right-color: mc($color, '500');
.alert-icon {
background-color: mc($color, '500');
}
.alert-msg {
color: mc($color, '900');
}
}
}
}