[mobileWallLayout] Fix layout applying to narrow desktop windows#692
Merged
DogmaDragon merged 1 commit intostashapp:mainfrom Apr 3, 2026
Merged
Conversation
Replace window.innerWidth <= 960 threshold with @media (pointer: coarse) CSS media query. The pixel-width check incorrectly activated the single-column layout on desktop browser windows narrower than 960px (e.g. split-screen use). pointer:coarse targets touch devices regardless of viewport size and removes the need for a JS resize event listener. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
|
This pull request has been mentioned on Stash Forum. There might be relevant details there: |
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
3 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.
Summary
Fixes the single-column layout incorrectly activating on narrow desktop browser windows.
The original implementation used
window.innerWidth <= 960to detect mobile devices. This threshold overlaps with common desktop use cases (split-screen browsing, smaller laptop windows) — any desktop window narrower than 960px would get the forced single-column layout.Fix: Replace the JS
window.innerWidthcheck with a@media (pointer: coarse)CSS media query.pointer: coarseis true on touchscreen devices (phones, tablets) and false on desktops with a mouse or trackpad, regardless of window size. This correctly targets the intended devices and removes the need for a JSresizeevent listener entirely.Changes
mobileWallLayout.js: wrap CSS rules in@media (pointer: coarse) { ... }, removewindow.innerWidth <= 960guard from JS, removeresizeevent listenerREADME.md: update behaviour description and implementation note