47 lines
881 B
SCSS
47 lines
881 B
SCSS
|
.htk-toast {
|
||
|
|
z-index: 210;
|
||
|
|
display: block;
|
||
|
|
position: fixed;
|
||
|
|
left: 50%;
|
||
|
|
top: 4em;
|
||
|
|
width: 21em;
|
||
|
|
margin-left: -10.5em;
|
||
|
|
text-align: center;
|
||
|
|
overflow: auto;
|
||
|
|
max-height: 40em;
|
||
|
|
overflow: visible;
|
||
|
|
|
||
|
|
& > div {
|
||
|
|
margin: .5em 0;
|
||
|
|
padding: .5em 2%;
|
||
|
|
border-radius: 0.1em;
|
||
|
|
box-shadow: 0 0 0.4em rgba(1, 1, 1, 0.6);
|
||
|
|
width: 96%;
|
||
|
|
|
||
|
|
opacity: 0;
|
||
|
|
transform: translateZ(0) translateY(-1em);
|
||
|
|
-webkit-transform: translateZ(0) translateY(-1em);
|
||
|
|
|
||
|
|
transition-property: opacity, transform;
|
||
|
|
transition-duration: 200ms;
|
||
|
|
transition-timing-function: ease-out;
|
||
|
|
|
||
|
|
&.show {
|
||
|
|
opacity: 1;
|
||
|
|
transform: translateZ(0) translateY(0em);
|
||
|
|
-webkit-transform: translateZ(0) translateY(0em);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
& > .message {
|
||
|
|
background-color: #BBFFBB;
|
||
|
|
color: #363;
|
||
|
|
}
|
||
|
|
& > .warning {
|
||
|
|
background-color: #FFE0B2;
|
||
|
|
color: #C30;
|
||
|
|
}
|
||
|
|
& > .error {
|
||
|
|
background-color: #FFCDD2;
|
||
|
|
color: #A00;
|
||
|
|
}
|
||
|
|
}
|