diff --git a/homeConfigurations/vinzenz/fonts.nix b/homeConfigurations/vinzenz/fonts.nix index 2d001a7..ebda673 100644 --- a/homeConfigurations/vinzenz/fonts.nix +++ b/homeConfigurations/vinzenz/fonts.nix @@ -4,5 +4,6 @@ home.packages = with pkgs; [ roboto-mono recursive + font-awesome ]; } diff --git a/homeConfigurations/vinzenz/waybar.css b/homeConfigurations/vinzenz/waybar.css index 590e26d..2a33940 100644 --- a/homeConfigurations/vinzenz/waybar.css +++ b/homeConfigurations/vinzenz/waybar.css @@ -1,28 +1,18 @@ -/* #region stylix overrides*/ -.modules-left #workspaces button, -.modules-left #workspaces button.focused, -.modules-left #workspaces button.active, -.modules-center #workspaces button, -.modules-center #workspaces button.focused, -.modules-center #workspaces button.active, -.modules-right #workspaces button, -.modules-right #workspaces button.focused, -.modules-right #workspaces button.active { - border-bottom: unset; -} -/* #endregion */ - * { - font-family: sans-serif; + /* `otf-font-awesome` is required to be installed for icons */ + font-family: FontAwesome, sans-serif; + font-size: 13px; + color: #dcdfe1; } window#waybar { - /* background: black; - border: none; - box-shadow: none; */ + background: black; + /* border: none; */ + box-shadow: none; + + color: #ffffff; transition-property: background-color; transition-duration: 0.5s; - background: transparent; } window#waybar.hidden { @@ -37,36 +27,47 @@ window#waybar.chromium { background-color: #000000; border: none; } - -.modules-left, -.modules-center, -.modules-right { - border: 0px solid #fff; - padding-bottom: 5px; - background-clip: content-box, padding-box; - background-image: - linear-gradient(90deg, @base01, @base01), - linear-gradient(90deg, #a30262, #4a6bb1); +/* +window#waybar .modules-left, +window#waybar .modules-center, +window#waybar .modules-right { + border: 1px solid; + border-radius: 15px; + border-image-source: linear-gradient(90deg, #d162a4, #5BCEFA); } - -.modules-center, -.modules-left { - border-bottom-right-radius: 15px; - padding-right: 5px; -} - -.modules-center, -.modules-right { - border-bottom-left-radius: 15px; - padding-left: 5px; + */ +box.horizontal { + padding: 4px 4px 0px 4px; } #workspaces, #window, #tray { + background-color: rgba(15, 27, 53, 0.9); padding: 4px 6px; margin-left: 6px; margin-right: 6px; + border-radius: 15px; + border-width: 0px; +} + +button { + /* Use box-shadow instead of border so the text isn't offset */ + box-shadow: inset 0 -3px transparent; + /* Avoid rounded borders under each button name */ + border: none; + border-radius: 0; +} + +/* https://github.com/Alexays/Waybar/wiki/FAQ#the-workspace-buttons-have-a-strange-hover-effect */ +button:hover { + background: inherit; + box-shadow: inset 0 -3px #ffffff; +} + +/* you can set a style on hover for any module like this */ +#pulseaudio:hover { + background-color: #a37800; } #workspaces button { @@ -82,7 +83,7 @@ window#waybar.chromium { #workspaces button.focused, #workspaces button.active { - background-color: @base03; + background-color: #64727d; } #workspaces button.urgent { @@ -128,7 +129,22 @@ window#waybar.chromium { .modules-right > widget:last-child > #workspaces { margin-right: 0; } +/* +#clock { + background-color: #64727D; +} +#battery { + background-color: #ffffff; + color: #000000; +} + +#battery.charging, +#battery.plugged { + color: #ffffff; + background-color: #26A65B; +} + */ @keyframes blink { to { background-color: #ffffff; @@ -162,7 +178,81 @@ window#waybar.chromium { #power-profiles-daemon.power-saver { color: #2ecc71; } +/* +label:focus { + background-color: #000000; +} +#cpu { + background-color: #2ecc71; + color: #000000; +} + +#memory { + background-color: #9b59b6; +} + +#disk { + background-color: #964B00; +} + +#backlight { + background-color: #90b1b1; +} + +#network { + background-color: #2980b9; +} + +#network.disconnected { + background-color: #f53c3c; +} + +#pulseaudio { + background-color: #f1c40f; + color: #000000; +} + +#pulseaudio.muted { + background-color: #90b1b1; + color: #2a5c45; +} + +#wireplumber { + background-color: #fff0f5; + color: #000000; +} + +#wireplumber.muted { + background-color: #f53c3c; +} +#custom-media { + background-color: #66cc99; + color: #2a5c45; + min-width: 100px; +} + +#custom-media.custom-spotify { + background-color: #66cc99; +} + +#custom-media.custom-vlc { + background-color: #ffa000; +} + +#temperature { + background-color: #f0932b; +} + +#temperature.critical { + background-color: #eb4d4b; +} + +#tray { + background-color: #2980b9; +} + + */ #tray > .passive { -gtk-icon-effect: dim; } @@ -171,14 +261,47 @@ window#waybar.chromium { -gtk-icon-effect: highlight; background-color: #eb4d4b; } +/* +#idle_inhibitor { + background-color: #2d3436; +} + +#idle_inhibitor.activated { + background-color: #ecf0f1; + color: #2d3436; +} + +#mpd { + background-color: #66cc99; + color: #2a5c45; +} + +#mpd.disconnected { + background-color: #f53c3c; +} + +#mpd.stopped { + background-color: #90b1b1; +} + +#mpd.paused { + background-color: #51a37a; +} +*/ #language { + /* + background: #00b093; + color: #740864; */ padding: 0 5px; margin: 0 5px; min-width: 16px; } #keyboard-state { + /* + background: #97e1ad; + color: #000000; */ padding: 0 0px; margin: 0 5px; min-width: 16px; diff --git a/nixosModules/stylix.nix b/nixosModules/stylix.nix index 6d5f97c..fe10652 100644 --- a/nixosModules/stylix.nix +++ b/nixosModules/stylix.nix @@ -12,8 +12,8 @@ }; fonts = { sansSerif = { - name = "Inter Nerd Font"; - package = pkgs.inter-nerdfont; + name = "Inter"; + package = pkgs.inter; }; monospace = { name = "FiraCode Nerd Font Mono";