145 lines
2.2 KiB
SCSS
145 lines
2.2 KiB
SCSS
@import 'css/colors';
|
|
|
|
/* MIXIN */
|
|
|
|
@mixin border-radius {
|
|
border-radius: $border-radius;
|
|
}
|
|
|
|
@mixin border-inactive {
|
|
border-width: $border-width;
|
|
border-style: solid;
|
|
border-color: $base03;
|
|
}
|
|
|
|
@mixin border-active {
|
|
border-width: $border-width;
|
|
border-style: solid;
|
|
border-color: $base04;
|
|
}
|
|
|
|
@mixin background-base {
|
|
background-color: $base01;
|
|
}
|
|
@mixin background-base2 {
|
|
background-color: $base02;
|
|
}
|
|
@mixin background-active {
|
|
background-color: $base04;
|
|
}
|
|
@mixin background-accent {
|
|
background-color: $base0C;
|
|
}
|
|
@mixin color-base {
|
|
color: $base07;
|
|
}
|
|
@mixin color-inactive {
|
|
color: $base02;
|
|
}
|
|
@mixin color-active {
|
|
color: $base04;
|
|
}
|
|
@mixin color-accent {
|
|
color: $base0C;
|
|
}
|
|
@mixin color-body {
|
|
color: $base05;
|
|
}
|
|
|
|
@mixin panel-base {
|
|
@include border-radius;
|
|
@include border-inactive;
|
|
@include background-base;
|
|
@include color-base;
|
|
}
|
|
|
|
@mixin mod-edge {
|
|
border-right-style: none;
|
|
border-bottom-right-radius: 0;
|
|
border-top-right-radius: 0;
|
|
}
|
|
|
|
/* GENERAL */
|
|
|
|
* {
|
|
all: unset;
|
|
font-family: "IBM Plex Mono";
|
|
transition: 200ms ease;
|
|
}
|
|
|
|
tooltip {
|
|
@include border-active;
|
|
@include border-radius;
|
|
@include background-base;
|
|
|
|
label {
|
|
font-size: 1rem;
|
|
}
|
|
}
|
|
|
|
.icon,
|
|
.icon label { font-family: Material Design Icons; }
|
|
|
|
.icon-text {
|
|
padding: 4pt;
|
|
font-size: 6pt;
|
|
font-weight: 900;
|
|
}
|
|
|
|
/* WORKSPACE COLORS - emitted dynamically by scripts/workspaces as class names */
|
|
.grey { color: $base02; }
|
|
.red { color: $base0F; }
|
|
.orange { color: $base08; }
|
|
.green { color: $base0B; }
|
|
.blue { color: $base0C; }
|
|
|
|
/* WINDOW WRAPPER CSS */
|
|
|
|
.winevent {
|
|
@include panel-base;
|
|
}
|
|
.winevent:hover {
|
|
@include border-active;
|
|
}
|
|
|
|
.wininner {
|
|
padding: $gaps-window;
|
|
}
|
|
.winouter {
|
|
margin: $gaps-screen;
|
|
}
|
|
|
|
/* MODULE WRAPPER CSS */
|
|
|
|
.modevent {
|
|
@include panel-base;
|
|
@include mod-edge;
|
|
}
|
|
.modevent:hover {
|
|
@include border-active;
|
|
@include mod-edge;
|
|
}
|
|
|
|
.modinner {
|
|
padding: $gaps-screen 0 $gaps-screen $gaps-window;
|
|
}
|
|
.modouter {
|
|
margin: $gaps-screen 0;
|
|
}
|
|
|
|
/* IMPORTS EXTERNAL */
|
|
|
|
@import 'css/sys';
|
|
@import 'css/net';
|
|
@import 'css/clock';
|
|
@import 'css/radio';
|
|
@import 'css/powermenu';
|
|
@import 'css/systray';
|
|
|
|
|
|
/* BAR */
|
|
|
|
.bar label {
|
|
font-size: 1.2rem;
|
|
}
|