Hacktoberfest 2026: le issue che i maintainer hanno segnato per ottobre, aperte e adatte ai principianti. Sfoglia le issue Hacktoberfest

[Feature]: Apply the saved UI theme before the WASM bundle boots

Aperta Adatta ai principianti
  • Qualcosa non va?
#40 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub

I maintainer di solito rispondono entro 1 giorno

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
2/5
Tempo stimato
1-3 ore
Idoneità per principianti
83/100
Tipo di issue
Funzionalità
Chiarezza
Specificata chiaramente
Stato di attività
Attiva
Stack tecnologico
javascript, rust, wasm
Ambito
frontend

Direzione di ricerca

La issue indica index.html, crates/app/src/main.rs:36-44, vercel.json e SECURITY.md. Leggi la discussione attuale sull’effetto del tema e sull’eccezione CSP, poi verifica come viene memorizzato il valore codeframe-ui-theme e quali valori di tema accetta. Il lavoro è completato quando il tema salvato imposta data-theme su html prima del primo rendering, la discussione su CSP documenta lo script inline e l’effetto successivo all’avvio rimane la fonte di verità.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

enhancement good first issue
Problem

The saved UI theme is applied by a Leptos Effect that runs after the WASM bundle boots (crates/app/src/main.rs:36-44). Users who selected dark or sepia see a flash of the light theme on every page load, which is most noticeable on slow connections and on the installed PWA.

Proposed solution

Apply the persisted theme before the first paint. The simplest approach is a tiny inline script in index.html that reads the codeframe-ui-theme key from localStorage and sets data-theme on <html>. The CSP in vercel.json already allows script-src 'unsafe-inline' (documented in SECURITY.md as a Trunk bootstrap requirement), so no CSP change is needed, but the script must be added to the same exception discussion to stay auditable.

The Leptos effect can stay as the source of truth after boot; the inline script only prevents the first-paint flash.

Alternatives considered
  • CSS-only solution with prefers-color-scheme: only covers light/dark system preference, not the app's three-way theme or the user's explicit choice.
  • Accept the flash: it is small but visible on every load and works against the "quiet, instant" positioning.
Project constraints
  • This keeps everything client-side (no backend, no server-side processing; code never leaves the browser).
  • This does not introduce a DOM-screenshot library (html2canvas, dom-to-image); rendering stays on Canvas2D/SVG.
  • This respects resolution honesty: the export canvas is drawn at true scale and never upscaled after the fact.
Lingua principale
Rust
Stelle
1
Fork
0
Merge medio
1g 7h
PR unite (30g)
5

Preparare l'ambiente

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di suradet-ps/codeframe

Tutte le issue di suradet-ps/codeframe

Issue simili

Altre issue su Rust

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.