Mechanize UI color token enforcement check

Aperta
  • Qualcosa non va?
#578 1 commento 0 reazioni 1 assegnatario Vedi su GitHub

I maintainer di solito rispondono entro 1 giorno

@ArthurArthurArthur0817 ci sta già lavorando.

Dal 4/11/2026.

Valutazione

Difficoltà
3/5
Tempo stimato
1-2 giorni
Idoneità per principianti
68/100
Tipo di issue
Funzionalità
Chiarezza
Specificata chiaramente
Stato di attività
Attiva
Stack tecnologico
css, python, shell
Ambito
testing, tooling

Direzione di ricerca

Start by reading scripts/test.sh and the project’s CSS token guidance to understand how checks are run and which token-definition blocks are exempt. Add the checker at scripts/check-css-tokens.py and cover it in tests/scripts/test_check_css_tokens.py; run the unit tests and bash scripts/test.sh. Done means hardcoded colors outside exempt blocks are reported with file and line, while permitted tokens, comments, and strings do not cause false positives.

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

Descrizione

Summary

Adds an automated CSS color token enforcement tool in scripts/check-css-tokens.py to mechanize stylesheet color rules and prevent interface styles from hardcoding literal color values (Hex/RGB/HSL).

Motivation & Context

As described in the "Strengthening skills: code checking and progressive review" section of subsequent contribution directions, project guidelines require UI colors to use CSS tokens (var(--...)) to maintain consistency across themes (light/dark modes). However, this rule is not yet mechanized and relies entirely on manual code reviews. This creates unnecessary review overhead and allows hardcoded colors—such as fixed hex values failing on light backgrounds—to slip into the codebase.

Changes
  1. Add checker script (scripts/check-css-tokens.py):
    • Scans CSS files under web/.
    • Excludes :root and theme-specific token definition blocks, then checks remaining CSS rules for hardcoded literal color values (#hex, rgb(), rgba(), hsl(), etc.).
    • Reports exact file paths, line numbers, and offending values upon detecting violations, exiting with a non-zero status code (1).
  2. Integrate into local test gates:
    • Adds the checker to scripts/test.sh so style rules are validated automatically during the test run.
  3. Add test coverage (tests/scripts/test_check_css_tokens.py):
    • Implements unit tests for the script covering valid var(--...) usage, permitted comments/strings, and interception of prohibited literal color formats to ensure zero false positives and reliable detection.
Testing
  • Script unit tests pass: python3 -m unittest tests/scripts/test_check_css_tokens.py (or pytest tests/scripts/test_check_css_tokens.py).
  • Full local test suite passes with no regressions: bash scripts/test.sh.
  • Intentionally introduced #ff0000 into web/styles.css to verify that the script pinpoints the offending line and halts the build.
Lingua principale
Rust
Stelle
223
Fork
148
Merge medio
1g 11h
PR unite (30g)
224

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 sysprog21/codetrial

Tutte le issue di sysprog21/codetrial

Issue simili

Altre issue su Rust

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.