arch-waybar/style/[Retro] Simple Style.css
Nicholai 0cf29b9f65 Merge Hyprlust waybar configuration with custom setup
Integrated Hyprlust dotfiles waybar configuration while preserving custom functionality:

Features Added:
- 24 switchable layout options (top, bottom, split, side bars)
- 30+ theme styles (Catppuccin, Wallust, Aurora, etc.)
- Centralized module definitions system
- Drawer/group expandable UI sections
- Advanced modules: sliders, mpris, swaync, visualizer
- Wallust dynamic theming support

Preserved Custom Features:
- Hardware-specific temperature monitoring (custom/temps module)
- Original minimal aesthetic and layout
- Pywal color system integration (dual support with Wallust)
- JetBrainsMono Nerd Font preference (18px)
- Custom scripts: temps.sh, battery.sh, waybar-wttr.py

New Files:
- configs/[TOP] Custom Minimal - New default minimal layout
- style/[Pywal] Minimal.css - Pywal-integrated style variant
- modules - Centralized module definitions
- configs/ - 24 layout options from Hyprlust
- style/ - 30+ theme styles from Hyprlust
- wallust/ - Wallust color generation support

Configuration:
- Fixed broken Pywal symlink (case-sensitive path)
- Created config symlink → configs/[TOP] Custom Minimal
- Created style.css symlink → style/[Pywal] Minimal.css
- Archived originals: [TOP] Original Minimal.jsonc, [Original] Minimal.css

Usage:
- Switch layouts: ln -sf "configs/[layout-name]" config
- Switch themes: ln -sf "style/[theme-name].css" style.css
- Supports both Pywal and Wallust color systems
2025-11-23 22:57:31 -07:00

158 lines
2.7 KiB
CSS

/* ---- 💫 https://github.com/JaKooLit 💫 ---- */
/* Simple Style */
@define-color background #1d2021;
@define-color foreground #ebdbb2;
@define-color dim #928374;
@define-color yellow #fabd2f;
@define-color red #fb4934;
@define-color green #b8bb26;
* {
background: @background;
border: none;
border-radius: 0;
font-family: "JetBrainsMono Nerd Font";
font-size: 97%;
}
window#waybar {
background: @background;
color: @foreground;
transition-property: background-color;
transition-duration: 0.5s;
}
#taskbar button,
#workspaces button {
color: @foreground;
}
#taskbar button.active,
#workspaces button.active {
border-bottom: 1px solid @green;
}
#taskbar button.urgent,
#workspaces button.urgent {
border-bottom: 2px solid @red;
}
#submap {
border-bottom: 1px solid @red;
}
#backlight,
#backlight-slider,
#battery,
#bluetooth,
#clock,
#cpu,
#disk,
#idle_inhibitor,
#keyboard-state,
#memory,
#mode,
#mpris,
#network,
#pulseaudio,
#pulseaudio-slider,
#taskbar button,
#taskbar,
#temperature,
#tray,
#window,
#wireplumber,
#workspaces,
#custom-backlight,
#custom-cycle_wall,
#custom-hint,
#custom-keyboard,
#custom-light_dark,
#custom-lock,
#custom-menu,
#custom-power_vertical,
#custom-power,
#custom-swaync,
#custom-updater,
#custom-weather,
#custom-weather.clearNight,
#custom-weather.cloudyFoggyDay,
#custom-weather.cloudyFoggyNight,
#custom-weather.default,
#custom-weather.rainyDay,
#custom-weather.rainyNight,
#custom-weather.severe,
#custom-weather.showyIcyDay,
#custom-weather.snowyIcyNight,
#custom-weather.sunnyDay {
color: @foreground;
padding: 3px 6px 3px 6px;
}
#battery.warning,
#disk.warning,
#memory.warning,
#cpu.warning {
border-top: 3px solid @background;
border-bottom: 3px solid @yellow;
}
#battery.critical,
#disk.critical,
#memory.critical,
#cpu.critical {
border-top: 3px solid @background;
border-bottom: 3px solid @red;
}
#battery.charging {
border-top: 3px solid @background;
border-bottom: 3px solid @green;
}
#pulseaudio-slider slider {
min-width: 0px;
min-height: 0px;
opacity: 0;
background-image: none;
border: none;
box-shadow: none;
}
#pulseaudio-slider trough {
min-width: 80px;
min-height: 5px;
border-radius: 5px;
background-color: @dim;
}
#pulseaudio-slider highlight {
min-height: 10px;
border-radius: 5px;
background-color: @green;
}
#backlight-slider slider {
min-width: 0px;
min-height: 0px;
opacity: 0;
background-image: none;
border: none;
box-shadow: none;
}
#backlight-slider trough {
min-width: 80px;
min-height: 10px;
border-radius: 5px;
background-color: @dim;
}
#backlight-slider highlight {
min-width: 10px;
border-radius: 5px;
background-color: @green;
}