Checkpoint: glass theme look

This commit is contained in:
Avi 2026-08-24 19:44:31 -05:00
commit 0cab88364b

View file

@ -1,4 +1,63 @@
# Checkpoint — Glass theme fix (2026-08-24) # Checkpoint — Glass theme look (2026-08-24)
A stopping point you can return to if this session is closed. Everything below was
verified green at the moment this file was written.
## Where things are
- Project: `/home/avi/Projects/Nostr_Keynctr`
- Git repo: `master` @ `ecb666b` ("Glass theme: real frosted-glass look").
Before it: `bfe14f0` (glass fix — broken Default impl), `1aae81c`
(checkpoint), `db2d22f` (glass added), `a01f258` (system removed).
- Working tree: clean apart from this checkpoint update. `concept3.svg` deleted
and `KeynectrAppIconPossibility02.jpeg` untracked remain as the user had them.
## What was completed
1. **Glass now looks like glass (`ecb666b`).** The first pass was only a flat
dark palette; the user said "it looks nothing like glass". Redone as real
glassmorphism, scoped 100% to `html[data-theme='glass']`:
- Aurora backdrop on `<body>` (cyan/violet/blue radial glows over
`#0a0d13`); `.app-shell`/`.main` made transparent so it shows through.
- Translucent surfaces (`--surface` etc. as rgba) + `backdrop-filter:
blur(18px) saturate(160%)` on cards, sidebar, modals, empty states,
profile cards, compose preview.
- Hairline light borders, softened translucent accent tints, frosted modal
scrim (blur 6px), inputs at low-alpha white, sidebar logo inverted like
dark/neon.
2. Earlier this session (`bfe14f0`, see next checkpoint): root cause of "glass
does nothing" was a repo that hadn't compiled since `a01f258`.
## Commits added most recently
- `ecb666b` Glass theme: real frosted-glass look
## Verification commands run (all green)
Rust (repo root): `cargo test` 113 passed; `cargo fmt --check` clean.
Frontend (`frontend/`): `npm test` 92 passed; typecheck, lint,
format:check clean; `npm run build` rebuilt `dist/` (so plain `npm start`
serves the new look).
## How to use / reproduce
```bash
cd ~/Projects/Nostr_Keynctr/frontend && npm start
```
Settings → Appearance → Theme → **Glass**: frosted translucent panels over a
glowing deep-blue backdrop with cyan accents.
## Notes & next steps
- Blur strength lives in the `backdrop-filter` rules and glow colors in the
`html[data-theme='glass'] body` gradient — both near the top of
`frontend/src/styles.css`.
- Electron GPU/Wayland warnings on this laptop are environmental noise.
---
# Older checkpoint — Glass theme fix (2026-08-24)
A stopping point you can return to if this session is closed. Everything below was A stopping point you can return to if this session is closed. Everything below was
verified green at the moment this file was written. verified green at the moment this file was written.