4.2 KiB
4.2 KiB
Sir Blob's Desktop
My portfolio website, built as a web version of my Arch Linux desktop.
The site recreates my blomarchy setup in the browser: a Hyprland-style tiling desktop, the Quickshell bar, and kitty terminals you can type into.
Features
- Tiling windows - every page opens as a window that tiles like Hyprland's dwindle layout, with gradient borders.
- Quickshell bar - app launcher, workspaces, clock, music player, live Discord status, battery details and a theme picker.
- Music player - plays a random song from a YouTube playlist, muted until you unmute it, with seek, skip, repeat, volume and a playlist view.
- Image viewer - click any image to open it in an imv window with zoom, pan, rotate, pinch and swipe.
- Kitty terminals - a real command line with history and tab completion. Try
fastfetch,whoamiorcowsay. - Desktop icons - grouped into pages, terminal scripts and socials (GitHub, LinkedIn, Devpost, Discord).
- 13 themes - Cerberus, Flats, Tokyo Night, Night Cat, Catppuccin, Arch Linux, Gruvbox, Nord, Kanagawa, Wintry, Rose, Catppuccin Latte and Rose Pine Dawn, each with its own wallpaper.
- Portfolio - about, portfolio, projects (open source, packages, hackathons, research, organizations), blog with RSS and links with QR codes.
- Live data - GitHub stars and forks, npm downloads, AniList anime stats and OMDb posters for shows and movies.
- Mobile friendly - on small screens windows go fullscreen with tabs to switch between them.
Keybinds
| Keys | Action |
|---|---|
| Alt + Enter | Open a terminal |
| Alt + Space | App launcher |
| Alt + Q | Close window |
| Alt + F | Fullscreen page |
| Alt + J / K | Next / previous window |
| Alt + 1-9 | Switch workspace |
| Alt + T | Next theme |
Alt stands in for Super, since browsers can't use it.
Image viewer
| Keys | Action |
|---|---|
| Left / Right | Previous / next image |
| + / - | Zoom in / out |
| 0 | Fit to window |
| R / Shift + R | Rotate right / left |
| Esc | Close viewer |
Terminal commands
| Command | Does |
|---|---|
help |
list every command |
whoami |
who I am |
fastfetch |
system info |
skills |
skills by category |
experience |
work experience |
projects [category] |
list my projects |
contact |
where to find me |
ls / cd <page> |
browse and open pages |
theme [name] |
list or switch themes |
cowsay <text> |
moo |
Running
bun install
bun run dev
bun run start
The music player needs ffmpeg installed on the server.
Configuration
Copy .env.example to .env and fill in what you need. Every value is optional.
| Variable | Used for |
|---|---|
DISCORD_TOKEN, DISCORD_USER_ID, DISCORD_GUILD_ID |
Live Discord status in the bar |
OMDB_API_KEY |
Posters and details for shows and movies |
Content
Site content lives in content/.
| File | Holds |
|---|---|
profile.json |
Name, bio, socials, skills and photos |
about.json |
Hobbies, games, shows, movies and the AniList username |
experience.json / leadership.json |
Work experience and leadership roles |
projects/*.json |
Open source, packages, hackathons, research groups and organizations |
music.json |
YouTube links for the music player |
desktop.json |
Workspaces, desktop icons and the startup command |
blog/*.md |
Blog posts |