Files
Livebeat/frontend/src/app/_alert/alert/alert.component.scss
Mondei1 ab1b90d020 Notification system in frontend
- Heatmap worker now reports progress
- Base for new altitude value
- Phones can be marked active
2020-11-13 19:04:45 +01:00

64 lines
1.1 KiB
SCSS

@keyframes appear {
from {
transform: translateY(-100px);
}
to {
transform: translateY(0);
}
}
.alert {
display: flex;
background-color: #000;
width: 100%;
height: 3rem;
padding-left: 1rem;
padding-right: 1rem;
margin-bottom: 1.5rem;
line-height: 0rem;
border-radius: 15px;
vertical-align: middle;
transition: 0.25s ease;
animation: appear 0.5s ease;
box-shadow:
0 4.5px 5.3px rgba(0, 0, 0, 0.121),
0 15px 17.9px rgba(0, 0, 0, 0.179),
0 67px 80px rgba(0, 0, 0, 0.3);
& .title {
font-weight: bolder;
padding-right: 1rem;
white-space: nowrap;
transform: translateY(50%);
}
& .message {
width: 100%;
text-align: center;
transform: translateY(50%);
}
& fa-icon {
transform: translateY(30%);
scale: 1.2;
}
}
.alert-success {
background-color: #0FAE4B !important;
}
.alert-danger {
background-color: #FA2400 !important;
}
.alert-warning {
background-color: #F3CC17 !important;
}
.fadeOut {
transform: scale(0.9);
opacity: 0;
}