193 lines
3.4 KiB
SCSS
193 lines
3.4 KiB
SCSS
@use "sass:color";
|
|
@use "lib";
|
|
@use "scheme";
|
|
@use "font";
|
|
|
|
.bar {
|
|
@include font.mono;
|
|
|
|
font-size: lib.s(14);
|
|
|
|
.module {
|
|
@include lib.rounded(8);
|
|
|
|
background-color: scheme.$base;
|
|
}
|
|
|
|
label.icon {
|
|
font-size: lib.s(18);
|
|
}
|
|
|
|
.os-icon {
|
|
@include lib.border(scheme.$yellow);
|
|
|
|
color: scheme.$yellow;
|
|
font-size: lib.s(14);
|
|
}
|
|
|
|
.active-window {
|
|
color: scheme.$pink;
|
|
}
|
|
|
|
.media-playing {
|
|
color: scheme.$lavender;
|
|
|
|
icon {
|
|
font-size: lib.s(16);
|
|
}
|
|
}
|
|
|
|
.workspaces > * {
|
|
@include lib.rounded(100);
|
|
@include lib.element-decel;
|
|
|
|
min-width: lib.s(8);
|
|
min-height: lib.s(8);
|
|
background-color: scheme.$surface1;
|
|
|
|
&.occupied {
|
|
background-color: scheme.$overlay1;
|
|
}
|
|
|
|
&.focused {
|
|
background-color: scheme.$mauve;
|
|
}
|
|
}
|
|
|
|
.tray {
|
|
font-size: lib.s(15);
|
|
color: scheme.$text;
|
|
}
|
|
|
|
.status-icons {
|
|
color: scheme.$rosewater;
|
|
}
|
|
|
|
.pkg-updates {
|
|
color: scheme.$blue;
|
|
}
|
|
|
|
.notif-count {
|
|
color: scheme.$mauve;
|
|
}
|
|
|
|
.battery {
|
|
color: scheme.$teal;
|
|
|
|
&.charging {
|
|
color: scheme.$success;
|
|
}
|
|
|
|
&.low {
|
|
color: scheme.$error;
|
|
}
|
|
}
|
|
|
|
.date-time {
|
|
color: scheme.$peach;
|
|
}
|
|
|
|
.power {
|
|
@include lib.border(scheme.$red);
|
|
@include lib.element-decel;
|
|
@include font.icon;
|
|
|
|
color: scheme.$red;
|
|
font-weight: bold;
|
|
font-size: lib.s(16);
|
|
}
|
|
|
|
&.horizontal {
|
|
margin: 10px 10px 0 10px;
|
|
|
|
@include lib.spacing(10);
|
|
|
|
& > * {
|
|
@include lib.spacing(10);
|
|
}
|
|
|
|
.module {
|
|
padding: lib.s(3) lib.s(8);
|
|
|
|
@include lib.spacing;
|
|
}
|
|
|
|
.os-icon {
|
|
padding-right: lib.s(12);
|
|
}
|
|
|
|
.media-playing {
|
|
@include lib.spacing(8);
|
|
}
|
|
|
|
.workspaces {
|
|
padding: lib.s(3) lib.s(18);
|
|
|
|
@include lib.spacing(10);
|
|
|
|
& > .focused {
|
|
min-width: lib.s(30);
|
|
}
|
|
}
|
|
|
|
.tray {
|
|
@include lib.spacing(10);
|
|
}
|
|
|
|
.status-icons .bluetooth {
|
|
@include lib.spacing(10);
|
|
|
|
// The spacing doesn't look right for some reason so this
|
|
& > :first-child:not(:last-child) {
|
|
margin-right: lib.s(5);
|
|
}
|
|
}
|
|
}
|
|
|
|
&.vertical {
|
|
margin: 10px 0 10px 10px;
|
|
|
|
@include lib.spacing(10, true);
|
|
|
|
& > * {
|
|
@include lib.spacing(10, true);
|
|
}
|
|
|
|
.module {
|
|
padding: lib.s(8);
|
|
|
|
@include lib.spacing($vertical: true);
|
|
}
|
|
|
|
.os-icon > * {
|
|
margin-left: lib.s(-5);
|
|
}
|
|
|
|
.media-playing {
|
|
@include lib.spacing(8, true);
|
|
}
|
|
|
|
.workspaces {
|
|
padding: lib.s(18) lib.s(3);
|
|
|
|
@include lib.spacing(10, true);
|
|
|
|
& > .focused {
|
|
min-height: lib.s(30);
|
|
}
|
|
}
|
|
|
|
.tray {
|
|
@include lib.spacing(10, true);
|
|
}
|
|
|
|
.status-icons .bluetooth {
|
|
@include lib.spacing(10, true);
|
|
|
|
// The spacing doesn't look right for some reason so this
|
|
& > :first-child:not(:last-child) {
|
|
margin-bottom: lib.s(5);
|
|
}
|
|
}
|
|
}
|
|
}
|