6fd9336522
Cause dynamic scheme mixes up the colours, need to use intensity of colour to differentiate
52 lines
1 KiB
SCSS
52 lines
1 KiB
SCSS
@use "sass:color";
|
|
@use "scheme";
|
|
@use "lib";
|
|
@use "font";
|
|
|
|
@mixin popup($colour, $alpha) {
|
|
@include lib.border($colour, $alpha);
|
|
|
|
border-right: none;
|
|
|
|
.separator {
|
|
background-color: $colour;
|
|
}
|
|
|
|
.image {
|
|
@include lib.border($colour, 0.05);
|
|
}
|
|
}
|
|
|
|
.notifpopups {
|
|
min-width: lib.s(425);
|
|
padding-left: lib.s(10); // So notifications can overshoot for init animation
|
|
|
|
// For shadow
|
|
& > :last-child .wrapper {
|
|
padding-bottom: lib.s(15);
|
|
}
|
|
|
|
.notification {
|
|
.wrapper {
|
|
padding-top: lib.s(10);
|
|
padding-left: lib.s(15); // For shadow
|
|
}
|
|
|
|
.inner {
|
|
@include lib.rounded(8, $tr: 0, $br: 0);
|
|
@include lib.shadow;
|
|
|
|
&.low {
|
|
@include popup(scheme.$overlay0, 0.3);
|
|
}
|
|
|
|
&.normal {
|
|
@include popup(scheme.$lavender, 0.3);
|
|
}
|
|
|
|
&.critical {
|
|
@include popup(scheme.$red, 0.8);
|
|
}
|
|
}
|
|
}
|
|
}
|