insomnia/app/css/components/toast.less
2016-08-29 10:58:59 -07:00

41 lines
736 B
Plaintext

@import '../constants/dimensions';
@import '../constants/colors';
@import '../constants/animations';
.toast {
opacity: 0;
position: absolute;
z-index: 100;
bottom: @padding-md;
right: @padding-md;
background: @bg-light;
color: @font-light-bg;
box-shadow: 0 0 1rem rgba(0, 0, 0, 0.2);
display: flex;
flex-direction: row;
border-radius: @radius-md;
&.toast--show {
opacity: 1;
transition: opacity 2s 5s ease-in;
}
.toast__message,
.toast__action {
padding: @padding-sm @padding-md;
height: auto;
}
.toast__action {
color: @font-light-bg;
font-weight: bold;
font-size: @font-size-sm;
border-left: 1px solid @hl-md;
&:hover {
background: @hl-xs;
}
}
}