src/app/component/alert/alert.component.scss
@use '../../style/colour' as colour;
@use '../../style/mixin' as mxn;
div {
position: fixed;
top: 80px;
width: 100%;
display: flex;
justify-content: center;
flex-wrap: wrap;
dialog {
position: relative;
z-index: 10000;
width: 100%;
display: flex;
justify-content: center;
align-items: center;
background-color: #337222;
overflow: hidden;
padding: 1rem;
font-size: .9rem;
@include mxn.transition;
margin-bottom: .2rem;
cursor: pointer;
&.error {
background-color: colour.$error;
&:hover {
background-color: #882e2e;
}
}
&:not(.error):hover {
background-color: #25571a;
}
&:not(:only-child) {
border: 1px solid #000;
}
span {
color: #ffffff;
}
}
}