Salta ai contenuti
MildportMildport

Theming

Il widget si tematizza tramite custom property CSS in light-DOM — token --mildport-* che imposti sull’elemento (o sopra di esso). Qualsiasi design system, modalità scura inclusa. Nessuna perforazione dello Shadow DOM, nessuna guerra di !important.

.mildport {
  --mildport-bg: #0b0e16;
  --mildport-fg: #e9e4d8;
  --mildport-surface: #141a26;
  --mildport-border: rgba(233, 228, 216, 0.14);
  --mildport-primary: #f2c97d;
  --mildport-primary-fg: #1a1206;
  --mildport-radius: 12px;
  --mildport-font: 'Inter Variable', system-ui, sans-serif;


  /* review grid */
  --mildport-grid-header-bg: #1a2230;
  --mildport-grid-cell-bg: #0f1620;
  --mildport-grid-selection: #f2c97d;
}

Un insieme di token rappresentativo:

Token Scopo
--mildport-bg / --mildport-fg Sfondo e testo di base.
--mildport-surface / --mildport-border Card, pannelli, linee sottili.
--mildport-primary / --mildport-primary-fg Accento e il suo colore di contrasto.
--mildport-success / --mildport-warning / --mildport-danger Stati di convalida.
--mildport-radius / --mildport-font Raggio degli angoli e tipografia.
--mildport-grid-* Intestazione, celle e selezione della griglia di revisione.