retrozinndev
171 lines
2.5 KiB
SCSS
171 lines
2.5 KiB
SCSS
@use "./wal";
|
|
@use "./mixins";
|
|
|
|
.bar-container {
|
|
padding: 6px;
|
|
padding-bottom: 0px;
|
|
|
|
& * {
|
|
all: unset;
|
|
transition: 120ms linear;
|
|
|
|
menu {
|
|
padding: 4px;
|
|
background: wal.$background;
|
|
border-radius: 14px;
|
|
|
|
& > separator {
|
|
margin: 0 4px;
|
|
color: wal.$background;
|
|
}
|
|
|
|
& > menuitem {
|
|
padding: 8px 0px;
|
|
border-radius: 10px;
|
|
font-size: 12px;
|
|
font-weight: 600;
|
|
|
|
&:hover {
|
|
background: wal.$color1;
|
|
}
|
|
}
|
|
}
|
|
|
|
button {
|
|
padding: 6px 8px;
|
|
border-radius: 12px;
|
|
|
|
&:hover {
|
|
background: wal.$color1;
|
|
}
|
|
}
|
|
}
|
|
|
|
& > .bar-centerbox > * {
|
|
background: rgba($color: wal.$background, $alpha: .6);
|
|
padding: 6px;
|
|
border-radius: 18px;
|
|
|
|
& > * {
|
|
margin: 0 2px;
|
|
|
|
&:first-child {
|
|
margin-left: 0;
|
|
}
|
|
|
|
&:last-child {
|
|
margin-right: 0;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.bar-container label {
|
|
font-size: 12px;
|
|
font-family: "Cantarell", "Noto Sans";
|
|
font-weight: 500;
|
|
}
|
|
|
|
.workspaces {
|
|
padding: 2px 2px;
|
|
& button {
|
|
all: unset;
|
|
border-radius: 16px;
|
|
transition: 80ms linear;
|
|
padding: 0 12px;
|
|
background: wal.$color1;
|
|
margin: 1px 2px;
|
|
|
|
&.focus {
|
|
background: wal.$foreground;
|
|
padding: 0 20px;
|
|
}
|
|
}
|
|
}
|
|
|
|
.focused-window {
|
|
padding: 0 6px;
|
|
|
|
& > .icon {
|
|
margin-right: 6px;
|
|
}
|
|
|
|
& > .text-content {
|
|
& > .class {
|
|
font-size: 9px;
|
|
font-weight: 500;
|
|
font-family: monospace;
|
|
color: adjust-hue($color: wal.$foreground, $degrees: 100deg);
|
|
margin-top: 1px;
|
|
}
|
|
|
|
& > .title {
|
|
font-size: 11.5px;
|
|
font-weight: 500;
|
|
margin-top: -2px;
|
|
}
|
|
}
|
|
}
|
|
|
|
.logo button {
|
|
$padding-inline: 12px;
|
|
padding-left: $padding-inline;
|
|
padding-right: calc($padding-inline + 3.9px);
|
|
|
|
& label {
|
|
font-size: 14px;
|
|
}
|
|
}
|
|
|
|
.media-eventbox {
|
|
& > .media > box {
|
|
border-radius: 12px;
|
|
background: wal.$color2;
|
|
padding: 0 6px;
|
|
|
|
& .icon {
|
|
margin-right: 6px;
|
|
font-size: 14px;
|
|
}
|
|
}
|
|
}
|
|
|
|
.tray {
|
|
padding: 0 6px;
|
|
|
|
& .item {
|
|
all: unset;
|
|
|
|
&:hover {
|
|
background: none;
|
|
}
|
|
|
|
margin: 0 6px;
|
|
padding: 0;
|
|
|
|
&:first-child {
|
|
margin-left: 0;
|
|
}
|
|
|
|
&:last-child {
|
|
margin-right: 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
.audio {
|
|
& .sink .icon {
|
|
margin-right: 6px;
|
|
}
|
|
|
|
& .source .icon {
|
|
margin-right: 4px;
|
|
}
|
|
}
|
|
|
|
.cc-toggle button {
|
|
$padding-inline: 12px;
|
|
padding-left: $padding-inline;
|
|
padding-right: calc($padding-inline + 2px);
|
|
}
|