web theme: drop terminal leftovers (prompt hero, filename eyebrows, git command lines), make light buttons readable, remove unused assets
This commit is contained in:
parent
c39cf0efe4
commit
7beb197f72
10 changed files with 129 additions and 105 deletions
30
agents.md
30
agents.md
|
|
@ -43,7 +43,7 @@ frosted-glass **web** site, and an alternate KDE/Plasma **desktop simulation**
|
|||
utilities in the components (Tailwind is present via PostCSS but the look is
|
||||
hand-written CSS).
|
||||
- Path alias: `@/*` → `src/*`.
|
||||
- Version: `2.2.0` (see `package.json`).
|
||||
- Version: `2.2.1` (see `package.json`).
|
||||
|
||||
### Scripts
|
||||
```bash
|
||||
|
|
@ -123,30 +123,44 @@ Themes: `web` = default frosted-glass website (sidebar + content, light/dark),
|
|||
`skeuo` = KDE Plasma desktop simulation (desktop-only; the web sidebar's
|
||||
"Desktop" control switches to it, and it has a "Web" control in its tray).
|
||||
|
||||
### Web theme + light/dark (v2.2.0 rework)
|
||||
### Web theme + light/dark (v2.2 rework)
|
||||
- `WebLayout.tsx` is the default shell. Layout is a **sticky sidebar** (brand,
|
||||
section nav, light/dark switch, desktop switch, contact/clock) beside a single
|
||||
content column of `.glass` panels: hero (with a compact "Find me" socials row),
|
||||
a `.web-quick` 2-up (`now.txt` + `gym_sbd.db`), then services, activity,
|
||||
a `.web-quick` 2-up ("Right now" + "Gym PRs"), then services, activity,
|
||||
projects, hardware, features (Revival/RustyWolf) and friends. Projects/hardware
|
||||
use a CSS multi-column **masonry** gallery (`.project-grid`) so short cards
|
||||
don't leave half-empty grid slots. The old stacked TUI panel layout and the
|
||||
`SlBackground` ASCII train were removed with it.
|
||||
- **Not a terminal.** The web theme deliberately has no TUI chrome: the hero is
|
||||
a name + blurb (no `$ whoami` prompt, no blinking cursor), section eyebrows are
|
||||
plain words (not `README.MD` / `TECH_LIST.JSON` filenames), and the activity
|
||||
panel renders without the `martin@git…:~$ echo …` / `git log -n 3` command
|
||||
lines. `ContributionHeatmap` takes `variant?: "terminal" | "web"` (default
|
||||
`terminal`); `WebLayout` passes `variant="web"`, the desktop app keeps the
|
||||
terminal look. Don't reintroduce command prompts in the web variant.
|
||||
- **Grid gotcha:** the mobile column is `minmax(0, 1fr)`, never bare `1fr`. A
|
||||
`1fr` track has an automatic `min-content` floor, and with a wide child that
|
||||
blew the single column out to ~2x the viewport (horizontal scroll + clipped
|
||||
content on phones). Keep the `minmax(0, …)`.
|
||||
- Glassmorphism lives in one utility class, `.glass`, in `web.css`: a subtle
|
||||
`linear-gradient` over `--glass-hi`/`--glass-lo` with
|
||||
`backdrop-filter: blur(20px) saturate(165%)`. The page blobs behind the panels
|
||||
`backdrop-filter: blur(28px) saturate(180%)`. The page blobs behind the panels
|
||||
are `.web-bg` (a fixed radial-gradient layer at `z-index: 0`; `.web-root` sits
|
||||
at `z-index: 1`).
|
||||
- Interactive surfaces (`.web-ctl`, pills, `.service-button`, `.social-button`,
|
||||
`.project-card`, `.gym-item`, `.contribution-entry`, `.heatmap-container`) read
|
||||
the `--btn-bg` / `--btn-bg-hi` / `--btn-border` / `--btn-shadow` tokens with
|
||||
the glass tokens as **fallbacks** (`var(--btn-bg, var(--glass-lo))`). The
|
||||
tokens are only defined under `html[data-theme="web"]`, so the desktop theme
|
||||
falls back to the old values and is unaffected. Light-mode buttons need the
|
||||
extra opacity + a visible (dark, low-alpha) outline or they melt into the pale
|
||||
background.
|
||||
- Colours are tokenised in `web.css` under `:root` (light) and
|
||||
`html[data-theme="web"][data-scheme="dark"]` (dark). The shared token names
|
||||
(`--fg`, `--gray`, `--accent`, `--green`, …) are reused so `ServiceButton` and
|
||||
`ContributionHeatmap` need no changes. `skeuo.css` overrides the same names
|
||||
while the desktop theme is active, so the two themes don't bleed into each
|
||||
other.
|
||||
(`--fg`, `--gray`, `--accent`, `--green`, …) are reused by `ServiceButton` and
|
||||
`ContributionHeatmap`. `skeuo.css` overrides the same names while the desktop
|
||||
theme is active, so the two themes don't bleed into each other.
|
||||
- The desktop switch (`.web-ctl-desktop`) is hidden on phones: under the
|
||||
`max-width: 960px` breakpoint and under `(hover: none) and (pointer: coarse)`.
|
||||
There is no device sniff anymore — phones just get the responsive web shell.
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue