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