[EPIC] UI improvements for Gallery view - #574
Merged
Merged
Conversation
…ome for all media (#473) * feat(gallery): componentize grid tiles with rounded media chrome * feat(gallery): add hover overlay prompting detail view * give tiles consistent hit areas * galleryNoMedia i18n --------- Co-authored-by: Cursor <cursoragent@cursor.com>
…ile) #449 Open Feature (#475) ### Goal Closes #449. Add split panel gallery detail. ### Screenshots <img width="1416" height="790" alt="Screenshot 2026-06-01 at 17 18 29" src="https://github.com/user-attachments/assets/59748805-cc92-4119-8121-d63386e93a15" /> <img width="693" height="796" alt="Screenshot 2026-06-01 at 17 27 52" src="https://github.com/user-attachments/assets/778bd5b1-f1d8-47ea-b3e2-05fd49437f13" /> ### What I changed and why - Clicking a tile replaces the gallery grid with an inline detail view: media on the left, metadata in a violet panel on the right on large screens, stacked on small - Detail view is closed via a "← Gallery" back link, the header X button, or Escape - Filters and tiles are hidden while detail is open to keep context clear - Fixed sticky hover overlay bug by suppressing overlays on all tiles while detail is open and blurring the tile that triggered it - Gallery route now uses the `explorer` layout to get the same `AppHeader` as index, dataset, and config pages ### How I convinced myself this is right Hiding the grid when detail is open matches the design mock (full content swap). Reusing `DataFeature` with `hideMedia` and `embedded` keeps one metadata renderer without duplicating fields. The overlay fix targets focus/hover state on the opener.`explorer` layout is the same mechanism other top-level pages use for `AppHeader`; no duplicate header component. ### What I'm not doing here - Per-entry media carousel in tiles/detail (#450) - Purple theming pass beyond existing `bg-violet-50` panel - Filter modal / media-type filter / Mapbox minimap (later epic items) ### LLM use disclosure Styling largely by me, commited by cursor
Co-authored-by: Cursor <cursoragent@cursor.com>
* Add gallery-scoped detail metadata with purple styling
* improve playwright tests
* Add static Mapbox minimap to gallery detail panel
* Remove Kobo attachment download UI; link Filebrowser media instead
* Extract DetailMinimap as a shared component
Move minimap UI/utils out of gallery naming so they can be reused elsewhere.
* Use FileDown icon for gallery file links
Co-authored-by: Cursor <cursoragent@cursor.com>
* Rename DetailMinimap to shared Minimap
Move util to utils/minimap.ts so it is not gallery-scoped.
* Use FileDown icon for gallery file links
---------
Co-authored-by: Cursor <cursoragent@cursor.com>
Preserve gallery detail behavior while adopting main's view workflow and copy updates.
…el, purple accents (#556) Add collapsible gallery filters panel
…557) * Improve gallery audio presentation * Document gallery audio pull request * restore github template * Keep gallery carousel arrows fixed across slides Arrows jumped between centered and top corners when navigating onto an audio slide. Reserve the arrow strip for the audio player instead so the controls stay put and can never overlap.
Remove lightbox vendor and data-lightbox wiring
Add gallery view title and description
* Rename gallery Image details to Media details * Rename galleryImageDetails key to galleryMediaDetails
* Add gallery media type filter * fix filtering * create shared MediaTypeFilter component * Move media type filter types and helpers to owned files Types live in types/; path and filter helpers in mediaHelpers. Tests reuse a shared allowedFileExtensions fixture from nuxt-aligned lists.
* Add in-app image modal for MediaFile Replace removed vendor lightbox with a shared modal opened on image click (Map sidebar, Gallery, etc.). Keep audio/video behavior unchanged. * Only open image modal outside gallery grid tiles Gallery tiles stay click-through to detail view; modal is enabled for default/map MediaFile and gallery detail via enableImageModal. * alphabetic sort
conservationtimothy
changed the title
Member
|
Remember to not do "Squash and Merge" but rather "Merge Commit" for this one 🙂 |
Importing @/server/utils loads dbConnection at module time, which requires NUXT_DB_* and breaks pure unit runs; match map endpoint mocks.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
By submitting a pull request to this project, you agree to license your contribution under the terms of the MIT License.
Please read our Contributor License Agreement and other Contributing Guidelines.
Goal
Screenshots
What I changed and why
How I convinced myself this is right
What I'm not doing here
LLM use disclosure