Use base instead of mantle Fix session transparency More rounding for session and lock osds
58 lines
1.4 KiB
SCSS
58 lines
1.4 KiB
SCSS
@use "sass:color";
|
|
@use "scheme";
|
|
@use "lib";
|
|
@use "font";
|
|
|
|
.session {
|
|
background-color: rgba(0, 0, 0, 0.3);
|
|
|
|
.inner {
|
|
@include lib.rounded(10);
|
|
@include lib.border(scheme.$flamingo, 0.5, 2);
|
|
@include lib.shadow;
|
|
@include font.mono;
|
|
|
|
background-color: scheme.$mantle;
|
|
color: scheme.$text;
|
|
padding: lib.s(18) lib.s(20);
|
|
|
|
@include lib.spacing(10, true);
|
|
|
|
& > * {
|
|
@include lib.spacing(20);
|
|
}
|
|
|
|
.item {
|
|
font-size: lib.s(14);
|
|
|
|
@include lib.spacing($vertical: true);
|
|
|
|
button {
|
|
@include lib.rounded(100);
|
|
@include lib.element-decel(300ms);
|
|
|
|
background-color: color.change(scheme.$surface0, $alpha: 0.4);
|
|
min-width: lib.s(100);
|
|
min-height: lib.s(100);
|
|
font-size: lib.s(32);
|
|
|
|
&:hover {
|
|
background-color: color.change(scheme.$surface1, $alpha: 0.4);
|
|
}
|
|
|
|
&:focus {
|
|
background-color: color.mix(scheme.$flamingo, scheme.$base, 70%);
|
|
color: color.change(scheme.$base, $alpha: 1);
|
|
}
|
|
|
|
&:active {
|
|
background-color: color.mix(scheme.$flamingo, scheme.$base, 50%);
|
|
}
|
|
}
|
|
|
|
.label {
|
|
font-weight: 500;
|
|
}
|
|
}
|
|
}
|
|
}
|