56 lines
1.1 KiB
SCSS
56 lines
1.1 KiB
SCSS
@import "../base";
|
|
@import "./config";
|
|
|
|
.root {
|
|
z-index: $z-index-higher;
|
|
position: fixed;
|
|
bottom: 0;
|
|
left: $snackbar-horizontal-offset;
|
|
right: $snackbar-horizontal-offset;
|
|
margin: 0 auto;
|
|
display: flex;
|
|
align-items: center;
|
|
padding: $snackbar-vertical-offset $snackbar-horizontal-offset;
|
|
margin-top: $snackbar-vertical-offset;
|
|
color: $snackbar-color;
|
|
background-color: $snackbar-background-color;
|
|
border-radius: $snackbar-border-radius;
|
|
transition: all $animation-duration $animation-curve-default $animation-duration;
|
|
&.accept .button {
|
|
color: green;
|
|
}
|
|
&.warning .button {
|
|
color: orange;
|
|
}
|
|
&.cancel .button {
|
|
color: red;
|
|
}
|
|
&:not(.active) {
|
|
transform: translateY(100%);
|
|
}
|
|
&.active {
|
|
transform: translateY(0%);
|
|
}
|
|
}
|
|
|
|
.icon {
|
|
margin-right: $snackbar-vertical-offset;
|
|
}
|
|
|
|
.label {
|
|
flex-grow: 1;
|
|
font-size: $font-size-small;
|
|
}
|
|
|
|
.button {
|
|
min-width: inherit;
|
|
margin-top: - $snackbar-vertical-offset / 2;
|
|
margin-bottom: - $snackbar-vertical-offset / 2;
|
|
margin-right: - $snackbar-horizontal-offset / 2;
|
|
margin-left: $snackbar-button-offset;
|
|
color: white;
|
|
> abbr {
|
|
line-height: inherit;
|
|
}
|
|
}
|