diff --git a/README.md b/README.md index 944d736..8f8b75e 100644 --- a/README.md +++ b/README.md @@ -1,2 +1,42 @@ -# Hyprland-Dots -My personal Hyprland setup! +# Retrozinndev's Hyprland Dots +My personal Hyprland configuration that I use everyday! Some of the colors used are from the [Catppuccin Mocha Palette](https://github.com/catppuccin), go check it out, it's awesome! + +
+ + +
+ +> ⚠️ Notice: This repo is not ready to be used yet. And README.md is also not complete, caution if you try to use this repo! + +## Requisites +### Waybar +#### Media +In order to make the `custom/media` widget work, you first need the [mediaplayer.py](https://github.com/Alexays/Waybar/blob/master/resources/custom_modules/mediaplayer.py) +script included in the official [Waybar repo](https://github.com/Alexays/Waybar). You can copy this script to the `~/.config/waybar/` directory(if you don't have +this folder, you can create one with `mkdir ~/.config/waybar`). +After putting the script in place, you need [playerctl](https://github.com/altdesktop/playerctl) to control the media(play/pause, next and previous). + +#### Audio +To control the audio, I use [pavucontrol](https://github.com/pulseaudio/pavucontrol), the Waybar's default audio controller. You can use any other of your preference, +just change the `"on-click"` value inside `"pulseaudio"` in the `config.jsonc` file to your desired application. + + + +## Usage +### Play/pause media +To do that, you can simply click in the Spotify/Media application widget in waybar when some song is playing. + +Clicking in the widget will toggle play/pause actions, you need [playerctl](https://github.com/altdesktop/playerctl) in order to make this work. +### Notification Center +About the notification daemon, I chose [swaync](), because it has it's own notification center, and uses gtk css to customize it. + +## Installation +In order to install this style right away, just run this installation script: + +> ℹ️ Notice: the installation script will make a backup folder containing all previous files in `~/.hyprland-dots/bkp`. + +```bash + $ git clone "https://github.com/retrozinndev/Hyprland-Dots.git"; cd Hyprland-Dots; bash apply.sh +``` +## Issues +Got any issue? Please report it at the [Issues Tab](https://github.com/retrozinndev/Hyprland-Dots/issues/new), I'll be happy for helping you out! diff --git a/apply.sh b/apply.sh new file mode 100755 index 0000000..4932fa2 --- /dev/null +++ b/apply.sh @@ -0,0 +1,47 @@ +#!/usr/bin/bash + +printf "\n"; +echo "######################################"; +echo "## Retrozinndev's Hyprland Dotfiles ##"; +echo "######################################"; +printf "\n"; + + +echo "Welcome to my dotfiles installation script!"; + +# Say that dotfiles aren't ready to use yet and exit +echo "Oh oh! Looks like my Dotfiles aren't ready to use yet! Try again later... exiting."; +printf "\n"; +exit 0; + + +echo -n "Do you want to install the dotfiles? [y/n] "; +read input; + +if ($input == "y" || $input == "yes") +then + install() +else + exit 0 +fi + +function install() { + + printf "\n"; + echo "Making backup before installing dotfiles..."; + # Do backup steps here + echo "Finished backup."; + + printf "\n"; + + echo "Starting dotfiles installation..."; + echo "[info] Installing waybar theme"; + echo "[info] Installing Hyprland configs" + echo "[info] Installing wofi stylesheet" + echo "Ah yes! Looks like it's ready to use! If you find any issue, report at: https://github.com/retrozinndev/Hyprland-Dots/issues " + echo "Thanks for using my dotfiles! I'm really happy for that :3" +} + +printf "\n" + + diff --git a/hyprland/appearance.conf b/hyprland/appearance.conf new file mode 100644 index 0000000..8b9501f --- /dev/null +++ b/hyprland/appearance.conf @@ -0,0 +1,62 @@ + +################ +## APPEARANCE ## +################ + + +# See https://wiki.hyprland.org/Configuring/Variables for more information on how to configure appearance + +general { + gaps_in = 5 + gaps_out = 8 + + border_size = 2 + + col.active_border = rgb(89dceb) + col.inactive_border = rgb(313244) + + resize_on_border = false + + allow_tearing = false + + layout = dwindle +} + +decoration { + rounding = 12 + + active_opacity = 1.0 + inactive_opacity = 0.98 + + drop_shadow = true + shadow_range = 4 + shadow_render_power = 3 + col.shadow = rgba(1a1a1aee) + + blur { + enabled = true + size = 3 + passes = 1 + vibrancy = 0.1696 + } +} + +animations { + enabled = true + + bezier = myBezier, 0.05, 0.9, 0.1, 1.05 + + animation = windows, 1, 5.5, myBezier + animation = windowsOut, 1, 5, default, popin 80% + animation = border, 1, 10, default + animation = borderangle, 1, 8, default + animation = fade, 1, 3.5, default + animation = workspaces, 1, 6, default +} + +dwindle { + pseudotile = true + + preserve_split = true +} + diff --git a/hyprland/autostart.conf b/hyprland/autostart.conf new file mode 100644 index 0000000..6a57335 --- /dev/null +++ b/hyprland/autostart.conf @@ -0,0 +1,13 @@ + +############### +## AUTOSTART ## +############### + +exec-once = /usr/lib/polkit-kde-authentication-agent-1 # exec kde auth agent if app asks for extra permissions +exec-once = /bin/waybar +exec-once = /bin/swaync # Run notification center / daemon +exec-once = /bin/hyprpaper + +# App example +# exec-once = /opt/discord/Discord --start-minimized + diff --git a/hyprland/bindings.conf b/hyprland/bindings.conf new file mode 100644 index 0000000..5d68085 --- /dev/null +++ b/hyprland/bindings.conf @@ -0,0 +1,119 @@ +################ +### BINDINGS ### +################ + +# https://wiki.hyprland.org/Configuring/Keywords and https://wiki.hyprland.org/Configuring/Binds for information on how to configure input + +$mainMod = SUPER +$terminal = kitty +$fileManager = nautilus +$menu = wofi --show drun +$screenshotDir = "/home/"+ $USER +"/Images/Screenshots" + +input { + kb_layout = br + kb_variant = abnt2 + kb_model = + kb_options = + kb_rules = + + follow_mouse = 1 + + sensitivity = 0 # -1.0 - 1.0, 0 means no modification. + + touchpad { + natural_scroll = true + } +} + +gestures { + workspace_swipe = true +} + +# Main binds, see https://wiki.hyprland.org/Configuring/Binds/ for more +bind = $mainMod, K, exec, $terminal +bind = $mainMod, Q, killactive, +bind = $mainMod, M, exit, +bind = $mainMod, E, exec, $fileManager +bind = $mainMod, V, togglefloating, +bind = $mainMod, SPACE, exec, $menu +bind = $mainMod, P, pseudo, # dwindle +bind = $mainMod, J, togglesplit, # dwindle +bind = $mainMod ALT, ENTER, fullscreen + +# Function keys +bind = , code:121, exec, pamixer --mute # Mute +bind = , code:122, exec, pamixer -d 5 # Decrease volume +bind = , code:123, exec, pamixer -i 5 # Increase volume +bind = , code:173, exec, playerctl previous # Previous media +bind = , code:172, exec, playerctl play-pause # Resume media +bind = , code:171, exec, playerctl next # Next media +bind = , code:232, exec, brightnessctl s 5%- # Lower monitor brightness +bind = , code:233, exec, brightnessctl s +5% # Increase monitor brightness + +# Hyprshot +bind = , Print, exec, hyprshot -m region --output-folder $screenshotDir +bind = $mainMod, Print, exec, hyprshot -m output --output-folder $screenshotDir + +# Reloading Components +# Waybar +bind = $mainMod, F7, exec, pkill waybar && waybar +# Hyprpaper (Wallpaper) +bind = $mainMod, F8, exec, pkill hyprpaper && hyprpaper + +# Move focus with mainMod + arrow keys +bind = $mainMod, left, movefocus, l +bind = $mainMod, right, movefocus, r +bind = $mainMod, up, movefocus, u +bind = $mainMod, down, movefocus, d + +# Move windows with arrowkeys +bind = $mainMod SHIFT, left, movewindow, l +bind = $mainMod SHIFT, right, movewindow, r +bind = $mainMod SHIFT, up, movewindow, u +bind = $mainMod SHIFT, down, movewindow, d + +# Resize windows with arrowkeys +bind = $mainMod ALT, left, resizeactive, -20 0 +bind = $mainMod ALT, right, resizeactive, 20 0 +bind = $mainMod ALT, up, resizeactive, 0 -20 +bind = $mainMod ALT, down, resizeactive, 0 20 + +# Switch workspaces with mainMod + [0-9] +bind = $mainMod, 1, workspace, 1 +bind = $mainMod, 2, workspace, 2 +bind = $mainMod, 3, workspace, 3 +bind = $mainMod, 4, workspace, 4 +bind = $mainMod, 5, workspace, 5 +bind = $mainMod, 6, workspace, 6 +bind = $mainMod, 7, workspace, 7 +bind = $mainMod, 8, workspace, 8 +bind = $mainMod, 9, workspace, 9 +bind = $mainMod, 0, workspace, 10 + +# Move active window to a workspace with mainMod + SHIFT + [0-9] +bind = $mainMod SHIFT, 1, movetoworkspace, 1 +bind = $mainMod SHIFT, 2, movetoworkspace, 2 +bind = $mainMod SHIFT, 3, movetoworkspace, 3 +bind = $mainMod SHIFT, 4, movetoworkspace, 4 +bind = $mainMod SHIFT, 5, movetoworkspace, 5 +bind = $mainMod SHIFT, 6, movetoworkspace, 6 +bind = $mainMod SHIFT, 7, movetoworkspace, 7 +bind = $mainMod SHIFT, 8, movetoworkspace, 8 +bind = $mainMod SHIFT, 9, movetoworkspace, 9 +bind = $mainMod SHIFT, 0, movetoworkspace, 10 + +# Example special workspace (scratchpad) +bind = $mainMod, S, togglespecialworkspace, magic +bind = $mainMod SHIFT, S, movetoworkspace, special:magic + +bind = $mainMod, S, togglespecialworkspace, magic +bind = $mainMod SHIFT, S, movetoworkspace, special:magic + +# Scroll through existing workspaces with mainMod + scroll +bind = $mainMod, mouse_down, workspace, e+1 +bind = $mainMod, mouse_up, workspace, e-1 + +# Move/resize windows with mainMod + LMB/RMB and dragging +bindm = $mainMod, mouse:272, movewindow +bindm = $mainMod, mouse:273, resizewindow diff --git a/hyprland/environment.conf b/hyprland/environment.conf new file mode 100644 index 0000000..a3f152d --- /dev/null +++ b/hyprland/environment.conf @@ -0,0 +1,9 @@ + +################# +## ENVIRONMENT ## +################# + +env = XCURSOR_SIZE, 24 +env = HYPRCURSOR_SIZE, 24 +env = QT_QPA_PLATFORMTHEME,qt6ct +env = ADW_DISABLE_PORTAL,1 # Allows dark theme in adwaita applications diff --git a/hyprland/hyprland.conf b/hyprland/hyprland.conf new file mode 100644 index 0000000..66ec42f --- /dev/null +++ b/hyprland/hyprland.conf @@ -0,0 +1,25 @@ + +################################################ +## Retrozinndev's Hyprland configuration file ## +################################################ + +# Monitors +source = ~/.config/hypr/monitors.conf + +# Autostart +source = ~/.config/hypr/autostart.conf + +# Environment +source = ~/.config/hypr/environment.conf + +# Devices +# source = ~/.config/hypr/devices.conf # Uncomment this line to apply file, remember to make it first! + +# Appearance +source = ~/.config/hypr/appearance.conf + +# Bindings +source = ~/.config/hypr/bindings.conf + +# Rules +source = ~/.config/hypr/rules.conf diff --git a/hyprland/hyprlock.conf b/hyprland/hyprlock.conf new file mode 100644 index 0000000..235e15c --- /dev/null +++ b/hyprland/hyprlock.conf @@ -0,0 +1,4 @@ + +general { + # Looks empty... Maybe I should take some time to configure that. +} diff --git a/hyprland/hyprpaper.conf b/hyprland/hyprpaper.conf new file mode 100644 index 0000000..58deaaa --- /dev/null +++ b/hyprland/hyprpaper.conf @@ -0,0 +1,8 @@ + +unload unused + +splash = true + +# preload = ~/Imagens/Wallpapers/apple-dark.jpg + +# wallpaper = , ~/Imagens/Wallpapers/apple-dark.jpg # use ´contain:´ before wallpaper to preserve original size diff --git a/hyprland/monitors.conf b/hyprland/monitors.conf new file mode 100644 index 0000000..6c04cc2 --- /dev/null +++ b/hyprland/monitors.conf @@ -0,0 +1,8 @@ + +############## +## MONITORS ## +############## + +# Configure yout monitor(s) here! See https://wiki.hyprland.org/Configuring/Monitors for more information on how to do that! + +monitor = , preferred, auto, auto, vrr, 1 # vrr enables variable refresh rate for gaming diff --git a/hyprland/rules.conf b/hyprland/rules.conf new file mode 100644 index 0000000..b79e257 --- /dev/null +++ b/hyprland/rules.conf @@ -0,0 +1,8 @@ + +################## +## WINDOW RULES ## +################## + +# See https://wiki.hyprland.org/Configuring/Window-Rules/ and https://wiki.hyprland.org/Configuring/Workspace-Rules/ for information on how to configure this + +windowrulev2 = suppressevent maximize, class:.* diff --git a/hyprlock/hyprlock.conf b/hyprlock/hyprlock.conf new file mode 100644 index 0000000..c0a20c8 --- /dev/null +++ b/hyprlock/hyprlock.conf @@ -0,0 +1,7 @@ + +# Hyprland lockscreen config file +# Currently not working + +general { + # hide_cursor = true +} diff --git a/repo/screenshot_desktop.png b/repo/screenshot_desktop.png new file mode 100644 index 0000000..ece4fa5 Binary files /dev/null and b/repo/screenshot_desktop.png differ diff --git a/repo/screenshot_usage.png b/repo/screenshot_usage.png new file mode 100644 index 0000000..7f8fe01 Binary files /dev/null and b/repo/screenshot_usage.png differ diff --git a/waybar/config.jsonc b/waybar/config.jsonc new file mode 100644 index 0000000..0ad03c7 --- /dev/null +++ b/waybar/config.jsonc @@ -0,0 +1,217 @@ +// -*- mode: jsonc -*- +{ + // "layer": "top", // Waybar at top layer + // "position": "bottom", // Waybar position (top|bottom|left|right) + "height": 32, // Waybar height (to be removed for auto height) + // "width": 1280, // Waybar width + "spacing": 4, // Gaps between modules (4px) + // Choose the order of the modules + "modules-left": [ + "hyprland/workspaces", + "hyprland/window", + "custom/media" + ], + "modules-center": [ + "clock" + ], + "modules-right": [ + "tray", + "backlight", + "pulseaudio", + "custom/notifications" + ], + // Modules configuration + "hyprland/workspaces": { + "disable-scroll": false, + "all-outputs": true, + "warp-on-scroll": true, + "format": "{icon}", + "format-icons": { + "urgent": "", + "focused": "", + "default": "" + } + }, + "bluetooth": { + "format": " {status}", + "format-connected": " {device_alias}", + "format-connected-battery": " {device_alias} {device_battery_percentage}%", + // "format-device-preference": [ "device1", "device2" ], // preference list deciding the displayed device + "tooltip-format": "{controller_alias}\t{controller_address}\n\n{num_connections} connected", + "tooltip-format-connected": "{controller_alias}\t{controller_address}\n\n{num_connections} connected\n\n{device_enumerate}", + "tooltip-format-enumerate-connected": "{device_alias}\t{device_address}", + "tooltip-format-enumerate-connected-battery": "{device_alias}\t{device_address}\t{device_battery_percentage}%" + }, + "keyboard-state": { + "numlock": true, + "capslock": true, + "format": "{name} {icon}", + "format-icons": { + "locked": "", + "unlocked": "" + } + }, + "hyprland/window": { + "format": "{icon} {count}", + "show-empty": false, + "format-icons": ["", ""], + "tooltip": true, + "tooltip-format": "{app}: {title}" + }, + "custom/notifications": { + "tooltip": false, + "format": "{icon}", + "format-icons": { + "notification": "󱅫", + "none": "󰂜", + "dnd-notification": "󱏩", + "dnd-none": "󰪓", + "inhibited-notification": "󱏩", + "inhibited-none": "󰪓", + "dnd-inhibited-notification": "󱏩", + "dnd-inhibited-none": "󰪓" + }, + "return-type": "json", + "exec-if": "which swaync-client", + "exec": "swaync-client -swb", + "on-click": "swaync-client -t -sw", + "on-click-right": "swaync-client -d -sw", + "escape": true + }, + "mpd": { + "format": "{stateIcon} {consumeIcon}{randomIcon}{repeatIcon}{singleIcon}{artist} - {album} - {title} ({elapsedTime:%M:%S}/{totalTime:%M:%S}) ⸨{songPosition}|{queueLength}⸩ {volume}% ", + "format-disconnected": "Disconnected ", + "format-stopped": "{consumeIcon}{randomIcon}{repeatIcon}{singleIcon}Stopped ", + "unknown-tag": "N/A", + "interval": 5, + "consume-icons": { + "on": " " + }, + "random-icons": { + "off": " ", + "on": " " + }, + "repeat-icons": { + "on": " " + }, + "single-icons": { + "on": "1 " + }, + "state-icons": { + "paused": "", + "playing": "" + }, + "tooltip-format": "MPD (connected)", + "tooltip-format-disconnected": "MPD (disconnected)" + }, + "idle_inhibitor": { + "format": "{icon}", + "format-icons": { + "activated": "", + "deactivated": "" + } + }, + "tray": { + // "icon-size": 21, + "spacing": 10 + }, + "clock": { + "timezone": "", + "tooltip-format": "{:%Y %B}\n{calendar}", + "format": "{:L%a. %d, %H:%M}", + "format-alt": "{:%Y-%m-%d}" + }, + "cpu": { + "format": "{usage}% ", + "tooltip": false + }, + "memory": { + "format": "{}% " + }, + "temperature": { + // "thermal-zone": 2, + // "hwmon-path": "/sys/class/hwmon/hwmon2/temp1_input", + "critical-threshold": 80, + // "format-critical": "{temperatureC}°C {icon}", + "format": "{temperatureC}°C {icon}", + "format-icons": ["", "", ""] + }, + "backlight": { + // "device": "acpi_video1", + "format": "{percent}% {icon}", + "format-icons": ["", "", "", "", "", "", "", "", ""] + }, + "battery": { + "states": { + // "good": 95, + "warning": 30, + "critical": 15 + }, + "format": "{capacity}% {icon}", + "format-full": "{capacity}% {icon}", + "format-charging": "{capacity}% ", + "format-plugged": "{capacity}% ", + "format-alt": "{time} {icon}", + // "format-good": "", // An empty format will hide the module + "format-full": "", + "format-icons": ["", "", "", "", ""] + }, + "battery#bat2": { + "bat": "BAT2" + }, + "power-profiles-daemon": { + "format": "{icon}", + "tooltip-format": "Power profile: {profile}\nDriver: {driver}", + "tooltip": true, + "format-icons": { + "default": "", + "performance": "", + "balanced": "", + "power-saver": "" + } + }, + "network": { + // "interface": "wlp2*", // (Optional) To force the use of this interface + "format-wifi": "{essid} ({signalStrength}%) ", + "format-ethernet": "{ipaddr}/{cidr} ", + "tooltip-format": "{ifname} via {gwaddr} ", + "format-linked": "{ifname} (No IP) ", + "format-disconnected": "Disconnected ⚠", + "format-alt": "{ifname}: {ipaddr}/{cidr}" + }, + "pulseaudio": { + // "scroll-step": 1, // %, can be a float + "format": "{volume}% {icon} {format_source}", + "format-bluetooth": "{volume}% {icon} {format_source}", + "format-bluetooth-muted": " {icon} {format_source}", + "format-muted": " {format_source}", + "format-source": "{volume}% ", + "format-source-muted": "", + "format-icons": { + "headphone": "", + "hands-free": "", + "headset": "", + "phone": "", + "portable": "", + "car": "", + "default": ["", "", ""] + }, + "exec-if": "which pavucontrol", + "on-click": "pavucontrol" + }, + "custom/media": { + "format": "{icon} {}", + "return-type": "json", + "max-length": 40, + "escape": true, + "format-icons": { + "firefox": "", + "discord": "", + "spotify": "", + "default": "󰎇" + }, + "escape": true, + "exec": "$HOME/.config/waybar/mediaplayer.py --player spotify 2> /dev/null", // Script in resources folder + "on-click": "playerctl --player spotify play-pause" // Change "spotify to your preferred player" + } +} diff --git a/waybar/mocha.css b/waybar/mocha.css new file mode 100644 index 0000000..75cfb9d --- /dev/null +++ b/waybar/mocha.css @@ -0,0 +1,26 @@ +@define-color rosewater #f5e0dc; +@define-color flamingo #f2cdcd; +@define-color pink #f5c2e7; +@define-color mauve #cba6f7; +@define-color red #f38ba8; +@define-color maroon #eba0ac; +@define-color peach #fab387; +@define-color yellow #f9e2af; +@define-color green #a6e3a1; +@define-color teal #94e2d5; +@define-color sky #89dceb; +@define-color sapphire #74c7ec; +@define-color blue #89b4fa; +@define-color lavender #b4befe; +@define-color text #cdd6f4; +@define-color subtext1 #bac2de; +@define-color subtext0 #a6adc8; +@define-color overlay2 #9399b2; +@define-color overlay1 #7f849c; +@define-color overlay0 #6c7086; +@define-color surface2 #585b70; +@define-color surface1 #45475a; +@define-color surface0 #313244; +@define-color base #1e1e2e; +@define-color mantle #181825; +@define-color crust #11111b; diff --git a/waybar/style.css b/waybar/style.css new file mode 100644 index 0000000..e4908d0 --- /dev/null +++ b/waybar/style.css @@ -0,0 +1,246 @@ + +@import "mocha.css"; + +window { + /* `otf-font-awesome` is required to be installed for icons */ + font-family: "0xProto Nerd Font Regular", sans-serif, "Font Awesome 5"; + font-size: 12px; + border-radius: 10px; + color: @text; +} + +* { + color: @text; + border-radius: 10px; +} + +window#waybar { + background-color: transparent; +} + +window#waybar.hidden { + opacity: 0.2; +} + +/* +window#waybar.empty { + background-color: transparent; +} +window#waybar.solo { + background-color: #FFFFFF; +} +*/ + +window#waybar.termite { + background-color: alpha(@base, .1); +} + +window#waybar.chromium { + background-color: @base; + border: none; +} + +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: 2px; + background: transparent; + transition: 120ms ease-in; +} + +/* https://github.com/Alexays/Waybar/wiki/FAQ#the-workspace-buttons-have-a-strange-hover-effect */ +button:hover { + background-color: alpha(shade(@blue, .3), .4); +} + +/* you can set a style on hover for any module like this */ +#pulseaudio:hover { + background-color: shade(@blue, 0.5); +} + +#workspaces { + background: alpha(@base, .3); + border-radius: 18px; + padding: 4px; + padding-bottom: 3px; + padding-top: 3px; +} + +#workspaces button { + border-radius: 50%; + padding: 2px 6px; + color: @blue; + font-size: 18px; +} + +#workspaces button.active { + background: alpha(shade(@blue, .5), .6); +} + +#workspaces button.urgent { + background-color: alpha(shade(@orange, 0.6), .3); +} + +#custom-notifications { + background: alpha(@base, .3); + font-size: 16px; + padding-left: 10px; + padding-right: 12px; +} + +#custom-notifications:hover { + background: alpha(@blue, .5); +} + +#backlight { + background: alpha(@base, .3); +} + +#backlight:hover { + background: alpha(@base, .5); +} + +#mode { + background-color: alpha(@yellow, .3); + box-shadow: inset 0 -3px @text; +} + +#clock, +#battery, +#cpu, +#memory, +#disk, +#temperature, +#backlight, +#network, +#pulseaudio, +#wireplumber, +#custom-media, +#tray, +#mode, +#idle_inhibitor, +#scratchpad, +#power-profiles-daemon, +#mpd { + padding: 0 10px; + color: @text; +} + +#window, +#workspaces { + margin: 0 4px; +} + +/* If workspaces is the leftmost module, omit left margin */ +.modules-left > widget:first-child > #workspaces { + margin-left: 0; +} + +/* If workspaces is the rightmost module, omit right margin */ +.modules-right > widget:last-child > #workspaces { + margin-right: 0; +} + +#clock { + background-color: alpha(@base, .3); +} + +#battery { + background-color: alpha(@base, .3); + color: @text; +} + +#battery.charging, #battery.plugged { + color: @text; + background-color: alpha(@base, .3); +} + +#battery:not(.plugged):not(.charging) { + background-color: alpha(@blue, .35); +} + +@keyframes blink { + to { + background-color: alpha(@crust, .3); + color: @orange; + } +} + +/* Using steps() instead of linear as a timing function to limit cpu usage */ +#battery.critical:not(.charging) { + background-color: alpha(shade(@orange, 0.5), .3); + color: @text; + animation-name: blink; + animation-duration: 0.5s; + animation-timing-function: steps(12); + animation-iteration-count: infinite; + animation-direction: alternate; +} + +label:focus { + background-color: shade(@blue, 0.4); +} + +#cpu { + background-color: @base; + color: @text; +} + +#memory { + background-color: @base; +} + +#disk { + background-color: @base; +} + +#pulseaudio { + background-color: alpha(@base, .3); + color: @text; +} + +#wireplumber { + background-color: alpha(@base, .3); + color: @text; +} + +#custom-media { + background-color: alpha(@base, .3); + color: @text; + min-width: 100px; +} + +#custom-media.custom-spotify { + background-color: alpha(shade(@green, .65), .3); +} + +#temperature { + background-color: alpha(@base, .3); +} + +#temperature.critical { + background-color: alpha(@red, .3); +} + +#tray { + background-color: alpha(@base, .3); +} + +#tray > .passive { + -gtk-icon-effect: dim; +} + +#tray > .needs-attention { + -gtk-icon-effect: highlight; + background: alpha(@orange, .3); +} + +#scratchpad { + background: alpha(@base, .3); +} + +#scratchpad.empty { + background-color: transparent; +} diff --git a/wofi/style.css b/wofi/style.css new file mode 100644 index 0000000..cff0649 --- /dev/null +++ b/wofi/style.css @@ -0,0 +1,58 @@ + +:root { + --base: #1e1e2e; + --dark: #1b1b30; + --crust: #11111b; + --text: #cdd6f4; +} + +* { + outline: none; +} + +#outer-box { + border: 4px solid #1b1b26; + border-radius: 12px; +} + +#window { + background-color: var(--base); + border-radius: 10px; + margin-top: 100px; + padding: 6px; +} + +#text { + font-family: system-ui, sans-serif; +} + +#text:selected { + color: var(--crust); +} + +#input { + border-radius: 10px; + margin: 4px; + border: 2px solid #11111b; + background-color: var(--base); +} + +#scroll { + border-radius: 10px; +} + +#entry { + padding: 2px 4px; + margin: 0px 6px; + padding-top: 4px; + padding-bottom: 4px; + transition: 50ms ease-in; + font-size: 1em; + font-weight: 500; +} + +#entry:selected { + background-color: #38384a; + border-radius: 6px; + outline: none; +}