[F0rty-Tw0]

What changed

• Stock theme.css palette now uses light-dark() and sets color-scheme: light dark, so the opt-in theme follows the OS light/dark preference instead of shipping a fixed dark-blue look. Values mirror the showcase's table theme.
• Added --nat-table-font-family (Inter system stack). The core table already read this token but the stock theme never set it, so typography went unstyled.
• Retuned radii, shadow, spacing, and typography to the showcase's minimal look; dropped the accent gradient, backdrop blur, and hover-lift.
• Updated the theming doc's value tables and regenerated the docs HTML registry.

Worth noting

• Opt-in only: nothing changes unless a consumer imports ng-advanced-table/components/theme.css. Token names and precedence are unchanged.
• box-shadow can't live in light-dark(), so its dark value sits in a single @media (prefers-color-scheme: dark) block.

Closes #268

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
angular-advanced-table	Ready	Preview, Comment	Jul 8, 2026 1:40pm

[greptile-apps]

Confidence Score: 5/5

Safe to merge — all changes are opt-in via the stylesheet import, token names are unchanged, and the card-shadow concern from the previous review cycle is fully resolved.

The migration from a fixed dark palette to light-dark() is mechanically straightforward: every palette token, including the card shadow color slots, now uses light-dark() directly so the values follow color-scheme on any ancestor scope — not just the OS media query. The docs paragraph accurately reflects this. No token names or public API contracts change, and nothing is applied unless the consumer imports theme.css.

No files require special attention. The generated docs-html-registry.ts is a faithful re-render of the updated markdown and can be spot-checked against theming.md if desired.

Important Files Changed

Filename	Overview
libs/ng-advanced-table/components/theme.css	Full palette migration from fixed dark values to light-dark() dual-mode tokens; color-scheme: light dark set on :root; card shadow now correctly uses light-dark() inline so it responds to forced color-scheme on any wrapper. No leftover @media block. The change is self-contained and opt-in.
apps/showcase/public/docs/theming.md	New paragraph accurately describes the light-dark() behavior and states the card shadow follows the resolved scheme; token value tables regenerated to match new CSS. No stale references found.
apps/showcase/src/app/docs/docs-html-registry.ts	Generated HTML registry regenerated from the updated theming.md; old dark-only token values replaced with light-dark() expressions throughout the compiled HTML blob. Purely mechanical output, no logic changes.

Flowchart

%%{init: {'theme': 'neutral'}}%%
flowchart TD
    A[Consumer imports theme.css] --> B[":root sets color-scheme to light dark"]
    B --> C{Resolved color-scheme}
    C -->|light| D["Light values applied via light-dark()"]
    C -->|dark| E["Dark values applied via light-dark()"]
    D --> F[All tokens palette shadow chips pager follow resolved scheme]
    E --> F
    F --> G{Consumer override?}
    G -->|"color-scheme: dark on a wrapper"| H["light-dark() flips on descendant scope, card shadow included"]
    G -->|"--nat-table-* token on wrapper"| I[Custom token wins, derived values recompute]
    G -->|no override| J[OS-responsive stock look]

Loading

%%{init: {'theme': 'base', 'themeVariables': {"darkMode": true, "background": "#0d1117", "primaryColor": "#21262d", "primaryTextColor": "#e6edf3", "primaryBorderColor": "#8b949e", "lineColor": "#8b949e", "textColor": "#e6edf3", "edgeLabelBackground": "#161b22", "actorBkg": "#21262d", "actorBorder": "#8b949e", "actorTextColor": "#e6edf3", "actorLineColor": "#8b949e", "signalColor": "#8b949e", "signalTextColor": "#e6edf3", "noteBkgColor": "#373320", "noteBorderColor": "#d4a72c", "noteTextColor": "#f0e6c0", "labelBoxBkgColor": "#21262d", "labelBoxBorderColor": "#8b949e", "labelTextColor": "#e6edf3", "loopTextColor": "#e6edf3", "activationBkgColor": "#30363d", "activationBorderColor": "#8b949e"}}}%%
flowchart TD
    A[Consumer imports theme.css] --> B[":root sets color-scheme to light dark"]
    B --> C{Resolved color-scheme}
    C -->|light| D["Light values applied via light-dark()"]
    C -->|dark| E["Dark values applied via light-dark()"]
    D --> F[All tokens palette shadow chips pager follow resolved scheme]
    E --> F
    F --> G{Consumer override?}
    G -->|"color-scheme: dark on a wrapper"| H["light-dark() flips on descendant scope, card shadow included"]
    G -->|"--nat-table-* token on wrapper"| I[Custom token wins, derived values recompute]
    G -->|no override| J[OS-responsive stock look]

Loading

_{Reviews (2): Last reviewed commit: "style(theme): 🎨 update `--nat-table-car..." | Re-trigger Greptile}