slicker alerts

This commit is contained in:
Felix Hamann 2018-07-06 00:41:21 +02:00
parent 8987f1d476
commit 46ef39f40d

View File

@ -35,8 +35,6 @@
position: relative;
display: inline-block;
background-color: var(--color-dark);
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
font-size: 1rem;
color: #f3f3f3;
z-index: 0;
@ -44,7 +42,6 @@
transition: all .3s ease-in-out;
padding-left: 20px;
margin-left: 20px;
box-shadow: 0 0 7px var(--color-dark);
animation: slide-in-alert .2s ease-out forwards;
+ .alert:not(.alert--invisible) {
@ -90,15 +87,18 @@
@media (min-width: 1024px) {
.alert {
min-width: 400px;
min-width: 350px;
}
}
.alert__content {
padding: 1.25em 1.5em;
padding: 8px 1.5em;
min-height: 40px;
position: relative;
display: inline-block;
display: flex;
font-weight: 600;
justify-content: flex-end;
align-items: center;
}
@media (max-width: 768px) {
@ -160,7 +160,6 @@
.alert-warning {
background-color: var(--color-warning);
color: var(--color-dark);
box-shadow: 0 0 7px var(--color-warning);
.alert__close {
color: var(--color-warning);
@ -176,7 +175,6 @@
.alert-error {
background-color: var(--color-error);
color: var(--color-lightwhite);
box-shadow: 0 0 7px var(--color-error);
.alert__close {
color: var(--color-error);