Skip to content

Live TV layout: channels + EPG column gets squeezed while the player panel dominates #1118

Description

@PavluntiyJ

Context

On the Live TV view (Xtream/Stalker) the screen is three columns: Groups (shell context panel), Channels (live-layout sidebar with EPG previews), and the Details/Player area. Channels + EPG is where users spend most of their browsing time, but it's currently the most constrained column, while the player area — secondary for users on external players (MPV/VLC) — always takes the remaining majority of the width.

Specific problems

  1. EPG disappears instead of degrading. channel-list-item has container-query breakpoints that hide the EPG title, progress bar and program-info button entirely below 270px, and the logo/actions below 220px. The sidebar's minWidth is 250px — right at the cliff edge, so a slightly-narrow sidebar silently loses all EPG info. Adaptive shrinking (drop end-time first, then compact type) would preserve the most valuable info at any width.

  2. The player panel is not collapsible as a whole. The channels sidebar can collapse, the inner EPG timeline can collapse, but a user who plays everything in MPV/VLC cannot give the freed space to the channels column.

  3. Groups cannot collapse independently. The shell context panel only collapses together with the channels sidebar via the single "everything quiets" toggle (LiveLayoutSidebarStateService). There is no way to hide just the Groups rail, and it has a generous max width (560px) for what is secondary navigation.

  4. Default widths favor the player. Channels defaults to 400px / max 600px regardless of viewport; on wide screens the player area gets everything else.

Proposal (open to discussion)

  • Channels: default 460px, min 340px (safely above the EPG degradation thresholds), max min(760px, 45vw).
  • Groups: default 260px, min 220px, max 340px, plus an independent collapse toggle (same chevron/restore pattern the channels sidebar already has).
  • Details/Player: collapsible as a whole — collapse via width/visibility, not display:none, so an embedded video element keeps playing and restores without re-initializing; the freed width goes to the channels column. One caveat found while prototyping: a floating restore affordance at the top-right of the content area ends up overlapping the sidebar-header buttons once the sidebar takes the full width, so the toggle is better placed in the sidebar header itself.
  • Below ~1024px viewport width, Groups collapses by default.
  • Keep the existing appResizable directive; add a thin coordination layer at the shell level so simultaneous panels respect each other's min widths instead of relying only on static per-panel maxWidth.

Related: #1114 (open) addresses the narrower correctness bug where the channels sidebar and the shell panel overwrite each other's persisted width — the width rebalance above only makes sense on top of it.

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions