Skip to content

Revamp scene and marker wall views #5816

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged

Conversation

WithoutPants
Copy link
Collaborator

@WithoutPants WithoutPants commented Apr 7, 2025

The wall view had a series of issues, particularly on smaller viewports. This PR uses the react-photo-gallery component used in the image wall view to layout the items. It maintains the existing options - that is, sound on hover and show title/tags.

Scene wall (shown with titles turned on):
image

Like the gallery wall, it shows the performers.

Marker wall:
image

(it looks better in motion)
Per the existing behaviour, it shows the title/primary tag, time and marker tags.

We can use targetRowHeight on the gallery component to set different display sizes, if we wanted to add zoom functionality in future (or if we want a different default size). I have set it to 250 currently. I'm happy to adjust the size based on feedback.

Regressions on the existing behaviour are that it no longer zooms a preview when moused over, and on smaller viewports (larger than mobile) you won't get 5 items per row.

@WithoutPants WithoutPants added the improvement Something needed tweaking. label Apr 7, 2025
@WithoutPants WithoutPants added this to the Version 0.29.0 milestone Apr 7, 2025
@WithoutPants WithoutPants merged commit 8e697b5 into stashapp:develop Jun 2, 2025
2 checks passed
philMorel pushed a commit to philMorel/stash that referenced this pull request Jun 2, 2025
* Use gallery for scene wall
* Move into separate file
* Remove unnecessary class names
* Apply configuration
* Reuse styling
* Add Scene Marker wall panel
* Adjust target row height
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
improvement Something needed tweaking.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant