Skip to content

Theme-Reel: new theme (0.1.0) - #782

Open
nexalapp wants to merge 1 commit into
stashapp:mainfrom
nexalapp:theme-reel
Open

nexalapp wants to merge 1 commit into
stashapp:mainfrom
nexalapp:theme-reel

Conversation

@nexalapp

@nexalapp nexalapp commented Oct 3, 2026 •

Copy link
Copy Markdown
Contributor

A new theme built for Stash v0.31: a boutique-streaming look. Neutral charcoal, wine used only for actions, Libre Caslon titles over Hanken Grotesk, pill controls, 4:3 poster scene cards with the text over a dark fade, framed tiles for studios and tags.

  • Covers the list toolbar, filter sidebar, selection toolbar, pagination, grid/list/wall/tagger views, scene and detail pages, stats and settings, at desktop and phone widths.
  • Respects the zoom slider. Scene grids use even columns with a minimum width per zoom level rather than overriding card widths with fixed values.
  • Fonts are bundled in assets/fonts with their SIL OFL 1.1 licences and loaded by relative URL, so there are no external requests and it works behind a sub-path.
  • Pure CSS, no JavaScript.

Since this PR was opened

  • Fixes from a review across all the refreshed themes: home carousel arrows inside the page and centred on the cards, the card heart the same size as the select checkbox, two performers per row in the scene details panel.
  • Home carousels show whole cards only, spaced like the grid, and card shadows are no longer clipped into a band.
  • The active tab's underline sits on the tab bar line instead of floating above it.
  • The slim header Stash pins on scrolled detail pages has a solid background and slides in only once the full header has scrolled away (it used to overlap it).
  • Phones: the filter sidebar opens as a full-screen sheet with a full-width results button (side by side with a single column of cards on small tablets); long Stash IDs fit the performer header.
  • Dialogs such as Edit filter fill the screen on phones, with their buttons at the foot.
  • Phones: the ☰ menu is an even grid of tiles with small icons, and the list toolbar fits on two rows.
  • The ☰ button is the same colour as the nav icons beside it.
  • The Theme Switch menu is solid and on the theme's colours (it was see-through over the blurred bar, and on stock slate).

Screenshots

Taken on an empty Stash v0.31.1 with demo content: fictional titles and names, and openly licensed photos blurred heavily so no one is identifiable (credits on the screenshots branch).

Scenes Scene
Scenes Scene
Performer Studios

Scenes on a phone A scene on a phone

More (performers grid, settings) in the README.

Testing

Tested on Stash v0.31.1 (Docker) in Chrome at 1440×900 and 390×844, on a real library of several thousand scenes and on an empty instance with demo content: scene, performer, studio and tag grids at every zoom level, list, wall and tagger views, the filter sidebar and dialog, the selection toolbar, scene and detail pages, the home page carousels, stats and settings. Validated with node validate.js --ci.

AI disclosure

This change was written with Claude (Anthropic) in Claude Code. I reviewed the code and tested it on my own Stash install before submitting.

🤖 Generated with Claude Code

@nexalapp
nexalapp force-pushed the theme-reel branch 3 times, most recently from 1c436f9 to 939d83f Compare October 3, 2026 14:53

This branch has not been deployed

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

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant