docs(design): how the download, notification and Scheduler action lists are built, and the log row (E28 S3e3)
This commit is contained in:
+13
-2
@@ -288,7 +288,17 @@ Which actions are visible and which live in a menu.
|
|||||||
card layout. A Plex playlist's title, show group and season each open the page's one row menu
|
card layout. A Plex playlist's title, show group and season each open the page's one row menu
|
||||||
(a title's is its `usePlexCardActions` list plus the removal); removals take the same undo toast,
|
(a title's is its `usePlexCardActions` list plus the removal); removals take the same undo toast,
|
||||||
`j`/`k` walk the visible rows and Delete removes the walked one; its rename and delete sit in the
|
`j`/`k` walk the visible rows and Delete removes the walked one; its rename and delete sit in the
|
||||||
header's "…". A toast that carries an action lives at least 8 s, whatever the toast setting.
|
header's "…". A toast that carries an action lives at least 8 s, whatever the toast setting. A
|
||||||
|
download row keeps play (pause / resume / retry in the queue) and the save link, and ends in its
|
||||||
|
"…" (`useDownloadActions`: the editors, sharing, re-download, the copies, cancel / delete / remove
|
||||||
|
behind their confirms); a link inside a row keeps the browser's own right-click menu. A notification
|
||||||
|
row keeps its link and its unread mark, shows its dismiss on hover (in the "…" on touch), and its
|
||||||
|
"…" holds find / undo for an activity notice. The notification center's band keeps Mark all read
|
||||||
|
and puts Clear everything, now behind a confirm, in its "…"; the Scheduler's strip keeps Run all
|
||||||
|
and Pause and puts Purge discovery in its "…". A list whose row objects are rebuilt each render or replaced by a
|
||||||
|
poll passes `useContextMenu({ keyOf })` (its id), so the "…" still closes its own menu. A menu's
|
||||||
|
groups are `ui/menuGroups`: a rule between
|
||||||
|
two non-empty groups only.
|
||||||
- **Background menu:** a right-click on EMPTY content area (not over text, inputs, links or media) may open
|
- **Background menu:** a right-click on EMPTY content area (not over text, inputs, links or media) may open
|
||||||
a page menu. It only mirrors page-scope actions that already exist in the toolbar (sort, view, quick
|
a page menu. It only mirrors page-scope actions that already exist in the toolbar (sort, view, quick
|
||||||
filters, select all); it adds no new function. Shift+right-click falls through to the browser's own menu.
|
filters, select all); it adds no new function. Shift+right-click falls through to the browser's own menu.
|
||||||
@@ -381,7 +391,7 @@ Wherever there is text, the user can select it and copy it, and no click action
|
|||||||
## Decision log
|
## Decision log
|
||||||
|
|
||||||
| Date | Decision | Chosen | Over | Why |
|
| Date | Decision | Chosen | Over | Why |
|
||||||
| ---------- | -------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------ | -------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
| ---------- | ------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
||||||
| 2026-09-24 | Floating button | Back to top: a round 48 glass FAB; "round" = floats over something (media or the page) | A Material 3 rounded square; a labelled pill; the old 64 circle | The common web convention for back to top; round tells it apart from every toolbar button; 64 was oversized |
|
| 2026-09-24 | Floating button | Back to top: a round 48 glass FAB; "round" = floats over something (media or the page) | A Material 3 rounded square; a labelled pill; the old 64 circle | The common web convention for back to top; round tells it apart from every toolbar button; 64 was oversized |
|
||||||
| 2026-09-24 | Device contract | Tablet portrait + landscape and up; phones out | A 1024px floor with a "too small" message | Portrait tablet use is real, and the app already renders at 820 portrait |
|
| 2026-09-24 | Device contract | Tablet portrait + landscape and up; phones out | A 1024px floor with a "too small" message | Portrait tablet use is real, and the app already renders at 820 portrait |
|
||||||
| 2026-09-24 | Card actions on touch | Fewer visible, the rest in a "…" menu | 44px buttons that no longer fit the card | Six 44px targets need more width than a card has |
|
| 2026-09-24 | Card actions on touch | Fewer visible, the rest in a "…" menu | 44px buttons that no longer fit the card | Six 44px targets need more width than a card has |
|
||||||
@@ -426,5 +436,6 @@ Wherever there is text, the user can select it and copy it, and no click action
|
|||||||
| 2026-09-26 | Plex actions built (C1) | One list per Plex title (play/open, watched, add to playlist, media info, copy title, pin); the poster keeps watched / add / "…" on its picture on hover; seasons get open / watched / add / copy | The hover ⓘ, the pin-only menu, an episode's add button at rest, a collection's "Remove" X on the card | The same door as a video's; the collection grid goes to two columns on a phone so the touch "…" leaves the title its line |
|
| 2026-09-26 | Plex actions built (C1) | One list per Plex title (play/open, watched, add to playlist, media info, copy title, pin); the poster keeps watched / add / "…" on its picture on hover; seasons get open / watched / add / copy | The hover ⓘ, the pin-only menu, an episode's add button at rest, a collection's "Remove" X on the card | The same door as a video's; the collection grid goes to two columns on a phone so the touch "…" leaves the title its line |
|
||||||
| 2026-09-26 | Playlist actions built (C1) | A playlist row's "…" (play, pin, copy title / link, move, order, remove), Delete + an undo toast; one list per playlist (rename, pin, YouTube open / push / revert, delete) from its rail row and its header's "…" | The row's X column and its confirm; the header's pencil, YouTube link, push, revert and trash buttons | Remove is reversible, so it needs no confirm; the header keeps Play all; on a phone the table drops "#" and Channel so the title keeps a width |
|
| 2026-09-26 | Playlist actions built (C1) | A playlist row's "…" (play, pin, copy title / link, move, order, remove), Delete + an undo toast; one list per playlist (rename, pin, YouTube open / push / revert, delete) from its rail row and its header's "…" | The row's X column and its confirm; the header's pencil, YouTube link, push, revert and trash buttons | Remove is reversible, so it needs no confirm; the header keeps Play all; on a phone the table drops "#" and Channel so the title keeps a width |
|
||||||
| 2026-09-26 | Channel + Plex list actions (C1) | A channel row's "…" (open, pin, YouTube, copy, full history, hide + undo, unsubscribe); a Plex playlist's title / show / season "…", Delete + undo; its header's "…" (rename, delete); an action toast lasts ≥ 8 s | The channel row's full-history, hide and unsubscribe buttons; the Plex list's red X on every row, show and season; the header's pencil and trash | Hiding and removing are reversible, so they need no confirm and the undo needs time; unsubscribe and deleting a playlist keep theirs |
|
| 2026-09-26 | Channel + Plex list actions (C1) | A channel row's "…" (open, pin, YouTube, copy, full history, hide + undo, unsubscribe); a Plex playlist's title / show / season "…", Delete + undo; its header's "…" (rename, delete); an action toast lasts ≥ 8 s | The channel row's full-history, hide and unsubscribe buttons; the Plex list's red X on every row, show and season; the header's pencil and trash | Hiding and removing are reversible, so they need no confirm and the undo needs time; unsubscribe and deleting a playlist keep theirs |
|
||||||
|
| 2026-09-26 | Download / notification / Scheduler actions (C1) | A download row's "…" (play, save, edit, details, re-download, share, manage sharing, copies, cancel / delete / remove); a notification row's "…" and hover dismiss; the inbox band's and the Scheduler strip's "…" | The download row's six rare buttons and its cancel / delete / remove; the source link's copy button; an activity notice's Find / Undo links; the band's Clear everything; the strip's Purge discovery | The destructive rows keep their confirm, and Clear everything gains one; a row link keeps the browser's own menu; Find in feed drops the tag / search / age filters that could hide its video |
|
||||||
| 2026-09-24 | Chip family | One `Chip` (filter / token / tag / suggest / ghost) + `DismissibleChip`; nothing under 24; the lint rule "no raw `<button>` outside ui/" | Five chip geometries in five files | The applied-filter row, the tag cells, the year picker and the saved-view editor each drew their own chip; a one-letter tag was 21px wide |
|
| 2026-09-24 | Chip family | One `Chip` (filter / token / tag / suggest / ghost) + `DismissibleChip`; nothing under 24; the lint rule "no raw `<button>` outside ui/" | Five chip geometries in five files | The applied-filter row, the tag cells, the year picker and the saved-view editor each drew their own chip; a one-letter tag was 21px wide |
|
||||||
| 2026-09-24 | Button families | `Button` / `IconButton` / `Pressable` / chips / `DragHandle`; `lg` 40 for a hero CTA; pills and a 48 Play on media (from C5) | Every button hand-painted | 268 hand-rolled buttons in 79 files drifted into as many looks; the ladder only holds if every button stands on it |
|
| 2026-09-24 | Button families | `Button` / `IconButton` / `Pressable` / chips / `DragHandle`; `lg` 40 for a hero CTA; pills and a 48 Play on media (from C5) | Every button hand-painted | 268 hand-rolled buttons in 79 files drifted into as many looks; the ladder only holds if every button stands on it |
|
||||||
|
|||||||
Reference in New Issue
Block a user