dotfiles/home/.basilisk/waybar/style.css

/*START SHCHEMES BLOCK : shchemes create_theme gtk3*/
@define-color a #ff5533;
@define-color iiv #000000;
@define-color iv #111111;
@define-color v #00bbbb;
@define-color vi #aaaaaa;
@define-color vii #ffffff;

/*END SHCHEMES BLOCK*/
@define-color border-sides alpha(#fff, 0.1);
@define-color border-highlight alpha(#fff, 0.2);
@define-color border-bottom alpha(#666, 0.1);

* {
  all: initial;
  font-family: "Noto Sans Mono", "Material Symbols Outlined", sans-serif;
  font-size: 12px;
  border-radius: 0;
}

window#waybar {
  background: transparent;
  color: #ffffff;
/*  transition-property: background-color;
  transition-duration: 0.5s;*/
  padding: 4px;
  /*     padding: 6px; */
}

/*window#waybar.hidden {
  opacity: 0.2;
}*/

tooltip {
  background-color: alpha(@iiv, 0.9);
  border: 1px solid @border-sides;
}

#waybar > box {
  padding: 4px;
  background-color: alpha(@iiv, 0.9);
}

.modules-right .module, .modules-left .module {
  margin: 3px 0;
  padding: 3px;
  border: 1px solid @border-sides;
  border-top: 1px solid @border-highlight;
  border-bottom: 1px solid @border-bottom;
  background: @iv;
  color: @vii;
}
.modules-right > :last-child .module, .modules-left > :last-child .module {
  margin-bottom: 0;
}
.modules-right > :first-child .module, .modules-left > :first-child .module {
  margin-top: 0;
}

#pulseaudio.main, #bluetooth, #custom-power, #custom-rofication {
  font-size: 20px;
  font-weight: 300;
  transition: 0.2s color;
  padding-top: 4px;
  padding-bottom: 2px;
}
#pulseaudio.main:hover, #bluetooth:hover, #custom-power:hover, #custom-rofication:hover {
  color: @a;
}

#bluetooth {
  padding: 3px 0;
}

#audio #pulseaudio.preview {
  border: 0;
  padding: 0;
  margin: 0;
  background: @iiv;
  color: transparent;
  transition: 0.2s color;
  background: transparent;
}
#audio:hover #pulseaudio.main {
  border-top: 0;
  margin-top: 0;
}
#audio:hover #pulseaudio.preview {
  color: @vi;
}

#pulseaudio-slider {
  padding: 0;
  margin: 0;
  border: 1px solid @border-sides;
  border-top: 1px solid @border-highlight;
  border-bottom: 0;
}

#pulseaudio-slider slider {
  min-height: 0px;
  min-width: 0px;
  opacity: 0;
  background-image: none;
  box-shadow: none;
  min-width: 28px;
}

#pulseaudio-slider slider {
  border-top: 1px solid @border-highlight;
}

#pulseaudio-slider trough {
  min-height: 100px;
  background: @iiv;
}

#pulseaudio-slider highlight {
  min-width: 10px;
  background: @iv;
}

.module button:hover {
/*   background: #ffffff; */
  transition-property: background-color;
  transition-duration: 0.5s;
}

.module#workspaces {
  padding: 0;
  background: @iiv;
  font-size: 4px;
}
.module#workspaces button {
/*   transition: 0.15s padding; */
  border: 1px solid @iiv;
  border-right: 0;
  border-left: 0;
  padding-bottom: 3px;
}
.module#workspaces button label {
  color: @vii;
}
.module#workspaces button:first-child,
.module#workspaces button.focused ~ button, .module#workspaces button:hover ~ button:not(.focused) {
  padding-top: 3px;
}
.module#workspaces button:hover, .module#workspaces button.focused ~ button:hover {
  background: inherit;
  border-color: @iv;
  padding: 16px 0;
}
.module#workspaces button.empty label {
  color: @vi;
}
.module#workspaces button.focused {
  padding: 16px 0;
  background: @iv;
  border-top: 1px solid @border-sides;
  border-bottom: 1px solid @border-bottom;
}
.module#workspaces button.focused label {
  color: @v;
}
.module#workspaces button:first-child {
  border-top: none;
}
.module#workspaces button:last-child {
  border-bottom: none;
}

#clock {
  font-size: 18px;
}

.module#clock.hour {
  color: @v;
  padding-bottom: 0;
  margin-bottom: 0;
  border-bottom: 0;
  font-weight: 600;
}

.module#clock.minutes {
  background: @iiv;
  padding-top: 0;
  margin-top: 0;
  border-top: 0;
  font-weight: 300;
}
/*START SHCHEMES BLOCK : [ ! "$(xrescat basilisk.animations.panel)" == "0" ] && cat animations.css*/
.module#workspaces button {
    transition: 0.1s padding, 0.1s padding;
}

#audio #pulseaudio.preview {
    transition: 0.2s color;
}

/*END SHCHEMES BLOCK*/