fix(ui): mobile responsiveness — nav hamburger + primary-path fixes
The top nav packed brand + health + pipeline chip + ~7 inline links + an action slot into one flex row, colliding/overflowing on phones (operator: 'almost unusable'). Below 768px the links now fold into a hamburger v-menu; below 480px the brand text hides (glyph still brands). Plus the primary browsing path: - BulkEditorPanel: fixed 320px -> min(320px, 90vw) so it can't swallow the screen. - GalleryFilterBar: <600px gives search its own full-width row (its 200px min-width was jamming the wrapping bar); sort grows. - GalleryFacetPanel: <480px wraps groups + lets the side-by-side date inputs grow full-width. - ArtistsView grid: minmax(min(440px,100%),1fr) so a card never overflows (single column on phones). - GalleryView: hide the year/month timeline strip <600px. ImageViewer already stacks its side panel below the image <900px (left as-is). Secondary surfaces (Posts/Subscriptions filter bars, SubscriptionsTab table, SeriesReader, PostCard) still need a mobile pass — follow-up. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -186,7 +186,9 @@ async function onDeleteConfirm(token) {
|
||||
<style scoped>
|
||||
.fc-bulk-panel {
|
||||
position: fixed; top: 0; right: 0;
|
||||
width: 320px; height: 100vh; z-index: 1100;
|
||||
/* min(320px, 90vw): on phones the panel never swallows the whole screen —
|
||||
leaves a sliver of the gallery visible behind it. */
|
||||
width: min(320px, 90vw); height: 100vh; z-index: 1100;
|
||||
background: rgb(var(--v-theme-surface));
|
||||
border-left: 1px solid rgb(var(--v-theme-surface-light));
|
||||
box-shadow: -2px 0 16px rgba(0, 0, 0, 0.4);
|
||||
|
||||
Reference in New Issue
Block a user