fix(ui): season list rows and both theme contexts follow the progress token

Review round 1:
- Codex: season list mode drew its episode bar with --mat-sys-primary;
  `.episode-list-item__progress-fill` now reads --app-progress-color, with
  a spec (the grid mode already goes through the capsule).
- Greptile: nothing pinned the token's `.dark-theme` re-declaration, so
  dropping it would have left every spec green while dark mode inherited
  the light colour. `m3-theme.spec.ts` (web) asserts the declaration in
  both theme contexts.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
4grayandClaude Opus 5.5 committed 2026-10-03 11:32:07 +02:00
1 parent f12dfabcce
commit ef40da23e4
4 files changed
+91 -7

No files matched your search

@@ -671,7 +671,7 @@ app-season-tabs {
&__progress-fill {
height: 100%;
background: var(--mat-sys-primary);
background: var(--app-progress-color);
border-radius: 2px;
transition: width 0.3s ease;
}
@@ -0,0 +1,27 @@
import { readFileSync } from 'node:fs';
import { resolve } from 'node:path';
// Watch progress in app chrome reads one theme token in both season view
// modes; the list rows draw their own fill rather than the grid's capsule
// (see the UI guidelines' Progress Bars section).
const DIR = resolve(
process.cwd(),
'libs/ui/components/src/lib/season-container'
);
function read(file: string): string {
return readFileSync(resolve(DIR, file), 'utf8');
}
describe('season container watch-progress colour', () => {
it('fills list rows with the app watch-progress token', () => {
const styles = read('season-container.component.scss');
const listItem = styles.slice(styles.indexOf('.episode-list-item {'));
const fill = listItem.match(/&__progress-fill\s*\{([^}]*)\}/)?.[1];
expect(read('season-container.component.html')).toContain(
'class="episode-list-item__progress-fill"'
);
expect(fill).toMatch(/background:\s*var\(--app-progress-color\);/);
});
});