Ten fixes: controls-row alignment, banners, shares, viewer bounds
- FilesControlsRow (and Photos' own controls row) wrapped its Row in a SingleChildScrollView, which gives a child unbounded width - silently breaking the trailing Spacer (a flex child needs bounded width) and leaving the List/Grid toggle sitting right after the filter chip instead of pinned to the row's right edge, "not enough controls to fill the row" or not. Removed the scroll wrapper (two chips and an icon toggle never need it) and the dead scroll-hint plumbing that went with it in files_view.dart. - Photos' All/Photos/Videos chips moved into the filter sheet as a full-width segmented control (matching Settings' Theme control), instead of their own row of chips competing for space with the sort and filter chips. - Settings' Theme row: the System/Light/Dark segmented control now sits on its own row below the label instead of squeezed into a trailing slot beside it, where three icon+label segments were too cramped to read comfortably - same shape as the sort sheet's Ascending/Descending control. - NooBanner (Trash's "Empty trash") and NooSummaryCard (Offline's "Sync now") both move their action onto its own row below the description text instead of squeezed onto the same line, where a longer caption had no room to share with it. - SharesController now caches each scope (with you / by you, which also covers links) after its first fetch instead of re-fetching on every single switch, including switching straight back to a scope already loaded seconds ago. - Shares' per-row overflow menu jumped straight to the unshare confirmation with no menu at all - a link share had no way to copy its own URL short of opening the full Share sheet. It's a real menu now: "Copy link" (link shares only) plus remove/unshare. - Settings gained a trailing jump rail on mobile (one small icon per section) so a specific section can be reached in one tap instead of scrolling the whole list by hand; desktop's 2-column grid doesn't need one. - The media viewer's PageView now disables its own left/right swipe while the current photo is zoomed in, so panning around it doesn't also swipe to the next item. - The PDF preview no longer sets minScale below 1.0: pdfx's PdfViewPinch hard-codes an *infinite* pan boundary whenever minScale < 1 (not an exposed parameter, so there's no way to override it), which let a page be panned arbitrarily far off-screen without ever zooming.
This commit is contained in:
@@ -207,8 +207,13 @@ multi-select)
|
||||
|
||||
**Banner / summary card**
|
||||
- A surface card with radius 20 (surface-2 on desktop) and padding of 14–18.
|
||||
- Trash: an info icon, the retention text, and "Empty trash" as a danger text button.
|
||||
- Offline: the stat, a 6px progress bar, the last-sync meta, and a "Sync now" tonal button.
|
||||
- The action sits on its own row below the description text, not squeezed
|
||||
onto the same line - a long retention message/caption and the action
|
||||
used to fight for the same row's width.
|
||||
- Trash: an info icon, the retention text, then "Empty trash" as a
|
||||
right-aligned danger text button on the row below.
|
||||
- Offline: the stat and caption, then a "Sync now" tonal button on the row
|
||||
below, then the 6px progress bar and the last-sync meta.
|
||||
|
||||
**Progress bar**
|
||||
- 6px tall pill. Surface-3 track with an accent fill.
|
||||
@@ -224,6 +229,13 @@ multi-select)
|
||||
- Left to right: an optional 20px icon in fg-2, then the label (16) with an optional subtitle (13, fg-3), then a trailing control.
|
||||
- Trailing control is one of: a toggle, a value in fg-3 with a chevron (desktop uses a 32px dropdown with radius 10), a segmented control, a pill button, or a status badge.
|
||||
- A destructive row uses danger text.
|
||||
- Exception: a segmented control with 3+ labelled segments (Theme's
|
||||
System/Light/Dark) gets its own row below the label instead of a
|
||||
trailing slot - three icon+label segments crammed in next to the label
|
||||
left each one too cramped to read. Label row, then the full-width
|
||||
segmented control on the row below, both on one continuous surface (no
|
||||
divider between them) - same shape the sort sheet's Ascending/Descending
|
||||
control and Photos' filter-sheet type control already use.
|
||||
|
||||
**Tab order row**
|
||||
- A grip icon (`grip-vertical`, fg-3), the tab icon, the label, then a pin button: a 36px circle (30 on desktop) that is accent-soft with `pin` when pinned, or surface-2 with `pin-off` when not.
|
||||
@@ -304,7 +316,13 @@ Sidebar items are 38px tall with radius 12, an 18px icon and a 14/500 label. The
|
||||
- Toolbar: sort chip (`Name ↑`), type filter chip, List/Grid segmented toggle.
|
||||
- Desktop adds Modified and Shared filter chips, an active-filter chip, and an item count.
|
||||
- Content: a list, or a grid when the toggle is set.
|
||||
- **Photos:** type chips (All, Photos, Videos, Camera), then the photo grid grouped by month. The grid view is the only view.
|
||||
- **Photos:** a sort chip and a filter chip (mirroring Files' own controls
|
||||
row - no List/Grid toggle, the grid is the only view). The type filter
|
||||
(All, Photos, Videos - Camera isn't backed by real data, see the view's
|
||||
doc comment) lives inside the filter sheet as a full-width segmented
|
||||
control, the same "label, then the control on its own row below" shape
|
||||
Settings' Theme row uses, not its own row of chips. Then the photo grid
|
||||
grouped by month.
|
||||
- **Favorites:** a file list with a star as the trailing icon.
|
||||
- **Offline:** a summary card (or 4 stat cards on desktop), then a list whose rows show sync status icons and status meta.
|
||||
- **Shares:** a segmented control (With you, By you, Links), then a list. The meta reads "Owner · Permission".
|
||||
@@ -326,7 +344,12 @@ Sidebar items are 38px tall with radius 12, an 18px icon and a 14/500 label. The
|
||||
slots, the rest sit behind "More". See §2 "Selection action bar".
|
||||
9. Swipe on a file
|
||||
|
||||
Mobile uses one column of grouped lists. Desktop uses a 2-column grid of cards with a 1px line and radius 20.
|
||||
Mobile uses one column of grouped lists, with a trailing jump rail (one
|
||||
small icon per section, pinned where the scrollbar would sit) since the
|
||||
full list runs long enough that scrolling to a specific section by hand
|
||||
is slow - tapping an icon scrolls straight to that section. Desktop uses
|
||||
a 2-column grid of cards with a 1px line and radius 20, wide enough to
|
||||
see most sections without scrolling, so it doesn't get the rail.
|
||||
- **Share sheet / dialog:** sections in this order:
|
||||
1. Header: file tile, name, size · folder, and close.
|
||||
2. **Share with people:** an input ("Name, email or group"), then the people with access. The owner comes first; the others each have a permission pill ("Can edit ▾").
|
||||
@@ -358,7 +381,13 @@ Sidebar items are 38px tall with radius 12, an 18px icon and a 14/500 label. The
|
||||
externally, download, delete, details) on every platform; don't add a
|
||||
top-bar overflow menu for the same actions. Video adds a transport row
|
||||
above the action row: time · seek bar · time, then play/pause and mute
|
||||
centered below it.
|
||||
centered below it. A photo can be pinch-zoomed; while zoomed in, the
|
||||
gallery's own left/right swipe between items is disabled so panning
|
||||
around the zoomed photo doesn't also swipe to the next one - it comes
|
||||
back the moment the photo returns to its un-zoomed scale. A PDF preview
|
||||
stays at its fit-width scale as its floor rather than letting the user
|
||||
zoom out past it, since going below 1.0 scale removes any limit on how
|
||||
far the page can be panned, including off-screen entirely.
|
||||
- **Search:** pushed from the shell's search entry point (`menu`/`search`
|
||||
icon in the top bar, or the inline field below an iOS large title -
|
||||
DESIGN_SYSTEM §2 "Search field" placement). The destination screen is one
|
||||
|
||||
Reference in New Issue
Block a user