Hypr tools visual customization - vsheo/only-arch GitHub Wiki

Hyperland visual customization

In deze wiki maak ik een samenvatting van deze youtube tutorial

GNU stow

GNU Stow helpt je om configuratiebestanden (zoals dotfiles) netjes te beheren door symbolische links (symlinks) te maken. Zo kun je al je configbestanden in één map bewaren en makkelijk toepassen op je systeem zonder ze handmatig te kopiëren.

  • Met GNU Stow kun je al je dotfiles netjes bewaren in een GitHub-repository.
  • Je kloont de repository op je (nieuwe) systeem met git clone.
  • Elke map in die repo stelt een applicatie of configgroep voor (zoals nvim/, zsh/, waybar/).
  • In elke map staan de bijbehorende configuratiebestanden in de juiste structuur (bijv. nvim/.config/nvim/init.lua).
  • Je gebruikt stow + {mapnaam} (zoals stow nvim) om automatisch symlinks te maken in je home directory.
  • Je configbestanden staan nu direct op de juiste plek zonder handmatig te kopiëren.
  • Als je iets wil wijzigen, pas je de bestanden aan in de repo en commit je die; herbruikbaar op elk systeem.

download gnu stow:

yay -S stow

in deze samenvatting zal ik de repo van de tutorial clonen: https://github.com/typecraft-dev/dotfiles

git clone https://github.com/typecraft-dev/dotfiles.git

nu hebben we alle dotfiles onder ~/dotfiles`

hyprpaper

Hyprpaper is een lichte wallpaper manager voor Hyprland, ontworpen voor snelle en eenvoudige achtergrondinstellingen onder Wayland.

download hyprpaper:

yay -S hyprpaper

als we in de terminal hyprpaper uitvoeren dan komt er een error omdat we nog geen conf file hebben hiervoor

voor heen gingen we nu zelf een config file maken voor een tool nu kunnen we stow gebruiken daarvoor.

in onze ~/dotfiles` directory hebben we een conf file voor hyprpaper stow gebruiken om deze conf file te gebruiken.

cd ~/dotfiles/
stow hyprpaper

als we nu naar hier gaan:

nano ~/.config/hypr/hyprpaper.conf

dan zien we dat die file bestaat en dat dit erin geschreven staat

deze repo heeft al backgrounds, dus in ~/dotfilesdirectory kunnen we dat ophalen metstow`

stow backgrounds

nu zijn deze backgrounds in in de ~/.config/backgrounds folder

als we deze command uitvoeren in de terminal, dan start hyprpaper op:

hyprpaper &

de & xorgt ervoor dat het activce blijft ookal stop je het met ctrl + c in de terminal

voeg hyprpaper toe aan AUTOSTART in hyprland.conf

nano ~/.config/hypr/hyprland.conf
exec-once = waybar & swaync & hypridle & hyprpaper

Terminal background

in hyprland gebruiken we kitty emulator, deze kunnen we ook customizen

stow kitty

deze conf file wordt hier geplaatst

nano ~/.config/kitty/kitty.conf

in deze file heb ik deze regel toegevoegd, om het transparent te maken zodat je je background kan zien:

backgroun_opacity 0.9

in deze file:

nano ~/.config/kitty/current-theme.conf

hier kan je allen kleuren van de kitty terminal aanpassen

Terminal prompt

Starship is een snelle, minimalistische en volledig configureerbare prompt voor je shell, met ondersteuning voor vele programmeertalen en tools.

download starship:

yay -Sy starship

gebruik stow om starship en zsh file te importeren:

cd ~/.dotfiles
stow starship

nu hebben we deze file

nano ~/.config/starship.toml

nu moeten we ervoor zorgen dat deze code uitgevoerd wordt:

nano ~/.bashrc

voeg boveaan deze regel toe, dit zorgt ervoor dat starship init wordt:

eval "$(starship init bash)"

als je nu deze command uitvoert dan zal starship je prompt tonen

source ~/.bashrc

als je de terminal sluit en opnieuw opent dan zullen de font sizes kleiner zijn

de font zelf ziet er nog raar uit omdat starship gemaakt was om te werken met nerd font. Die kunnen w zo downloaden:

yay -S ttf-cascadia-code-nerd

met deze command kan je alle cascadia fonts ophalen

fc-list | grep Cas

hier kan je 1 kiezen die je wilt gebruiken.

ik zal deze kiezen: Caskaydia Cove Nerd Font

in de conf file voor kitty kunnen we die nu toevoegen:

nano ~/.config/kitty/kitty.conf

hierkunnen we de font_family regel aanpassen naar:

font_family Caskaydia Cove Nerd Font

als we kitty sluiten en opnieuw opstarten dan zien we de nieuwe font

dit is een meer uitgebreide starship setup hiervan komt later nog een wiki samenvatting

Waybar

als we naar onze ~/dotfiles` gaan en dit uitvoeren:

ls -latr

dan zien we dat we al een waybar config hebben

we hebben nu de basic config voor waybar, die we van internet hebben gekopieerd. deze kunnen we nu helemaal weg halen:

killall waybar
rm ~/.config/waybar/*

daarna kunnen we de nieuwe config importeren:

stow waybar

als we naar waybar gaan:

cd ~/.config/waybar

en kijken wat daarin zit:

ls -latr

dan zien we nu dat onze waybar gestyled is met CSS

restart waybar:

waybar

in deze file stellen we allesvan waybar in:

nano ~/.config/waybar/config.jsonc

bovenaan de file kan je aangeven wat er te zien is

  • modules-left: wat je aan de linkerkant wilt hebben
  • modules-center: wat je in het midden wilt hebben
  • modules-right: wat je aan de rechterkant wil hebben

in de mocha CSS file kan je de kleuren aanpassen voor waybar

nano ~/.config/waybar/mocha.css

meer over waybar

Theme GTK apps

Wij hebben Hyprland op GNOME gebouwd. GNOME gebruikt GTK voor de grafische interface van zijn applicaties, en met GTK kunnen we de stijl, thema's en het gedrag van deze applicaties aanpassen.

dit kunnen we doen met: nwg-look

download:

yay -S nwg-look

arch heeft al een AUR port voor GTK:

yay -Sy catppuccin-gtk-theme-mocha

als we onze laucher open maken (wofi) en zoeken naar nwg-look

dan komt: GTK settings tevoorschijn. als we dat openen kunnen we de themes voor alle GTK apps aanpassen

Wofi

Wofi onze application launcher kunnen we ook customizen in de dotfiles uit de github repo is er al een conf file hiervoor

stow wofi

in deze file hebben we nu styles voor wofi:

nano ~/.config/wofi/styles.css

als het goed is zie je nu een ander theme als je wofi opent

Hyprlock

voor de lockscreen hebben we al een conf file. deze was ook een example versie van het internet. deze kunnen we nu weg halen:

rm ~/.config/hypr/hyprlock.conf

en de nieuwe importeren:

cd ~/.dotfiles
stow hyprlock

deze kan je verder aanpassen in:

nano ~/.config/hypr/hyprlock.conf

deze conf maakt gebruik van een ander conf file die we ook uit dotfiles kunnen importeren

stow hyprmocha

hyprmocha is een file that defines colors, die andere hyprland tools kunnen gebruiken. dit zet deze tools in de catppuccin mocha theme

nano ~/.config/hypr/mocha.conf