Themes: Shelf in Steam's own geometry, layout read from the theme's CSS, compatibility labels

Merged
UT
2h ago
+4479-406

Description

Store themes were all shown on one fixed Shelf arrangement, so many did not look like their store screenshots. This PR makes the Shelf use Steam's own home geometry, reads more of what a theme's CSS says, and labels store themes by whether they were checked.

  • Shelf geometry. The Shelf is laid out in Steam's units (one Steam CSS pixel scaled by window height): covers 133 x 199.5, the wide cover 426.8 x 199.5, Steam's gaps and offsets. The row sits near the top with the title and status under the focused cover, the focused cover scrolls to the center, the first cover is wide only while focused, and the focused cover grows as it does on Steam. This applies to the Shelf with or without a theme.
  • Row and title placement. A theme's rules on Steam's home elements are applied to a small model of Steam's home box model. The result is an anchor and an offset for the row within the area between the bars, and an offset for the title. There are no fitted cutoffs.
  • Which layout a theme picks. Shelf when the theme styles the home screen, a portrait-cover grid when it styles only the library grid, otherwise the user's own layout.
  • Read from the CSS. Hidden home artwork, an image in place of the artwork and its height, hidden title or status line, cover shear and 3D turn per position (before, at, after the focused cover), focused cover scale, dimmed unfocused covers, frame images around covers, the CSS reflect property, the featured cover's width, grid columns and cover shape, covers of games that are not installed, hidden tab counts. @media conditions are evaluated against the Deck's CSS viewport, and clamp(), min() and max() are read.
  • Custom theme. Every layout value a store theme can set has an option in the Custom editor and a --gn-* variable.
  • Compatibility labels. The store tab is named "SteamOS-like". Each store theme shows "Verified", "Not compatible" (install disabled) or "Not verified", from a bundled list plus the store's target for parts of SteamOS the app does not have.
  • Fixes. Icon and collection rules no longer feed the tile fill; per-neighbor scales no longer become the tile size; the loading screen's color no longer becomes the page background; the class-name table is fetched when it is missing; the Installed tab shows a spinner while the list loads; the publish button shows an upload icon.

Without a theme, the Grid, List and Carousel layouts, the bars and app start are unchanged. Translation still runs only at theme install or enable.

Includes #2417 and #2418.

Recording

Checked on a Retroid Pocket 6 against store screenshots; comparison sheets shared with the maintainer.

Type of Change

  • Bug fix
  • Performance / stability improvement
  • Compatibility improvements
  • Other (requires prior approval)

Checklist

  • If I have access to #code-changes, I have discussed this change there and it has been green-lighted. If I do not have access, I have still provided clear context in this PR. If I skip both, I accept that this change may face delays in review, may not be reviewed at all, or may be closed.
  • This change aligns with the current project scope (core functionality, stability, or performance). If not, it has been explicitly approved beforehand.
  • I have attached a recording of the change.
  • I have read and agree to the contribution guidelines in CONTRIBUTING.md.

Summary by CodeRabbit

  • New Features
    • Theme settings now offer expanded control over home shelves, cover appearance and motion, artwork, and library grids.
    • Community themes can display compatibility labels and notes; themes marked incompatible cannot be installed unless no update is available for an installed theme.
    • Theme layouts can set grid columns, tile proportions, shelf placement, and title visibility. Theme artwork and cover images are supported.
  • Improvements
    • Shelf covers better track focus and support configurable positioning, frames, reflections, and visual effects.
    • Theme-based grid layouts are applied consistently, and installed themes show a loading indicator while the list is prepared.
  • Localization
    • Updated theme labels and compatibility messaging across supported languages.