mirror of
https://github.com/4gray/iptvnator.git
synced 2026-10-08 17:06:15 -08:00
4gray
008f267808
Refactor EPG list template to remove Material selection list and dividers, replacing them with plain markup and CSS-friendly elements. Key changes: - Replace <mat-divider> with .header-divider for consistent styling. - Replace mat-selection-list/mat-list-option with plain divs (.program-item, .program-meta, .program-title) to allow richer DOM structure and avoid Material selection semantics. - Use track $index in ngFor to stabilize rendering and avoid using program start/stop concatenation as key. - Render live progress bar inside program items when a program is playing, using calculateProgress(program) to set width. - Convert empty-state <p> to .epg-not-available div for layout consistency. - Add clickable class and active class binding to interactive items. Code changes and cleanup: - Update component imports to use ChangeDetectionStrategy and ChangeDetectorRef and remove unused Material imports (MatDivider, MatListModule) from the component file. - Adjust template bindings: use [innerHTML] and class bindings instead of matList directives. Why: - Remove heavy dependency on Material selection list to gain finer control over DOM and styles, enable custom progress UI and clickable behavior, and simplify template for better performance and maintainability.