Tier 1Web (www / app / auth). The full design system: our component library and the components.css recipe. This is the one tier where the recipe is the contract, native tiers take the tokens and nothing else.--component-bg · --component-bg-hover · --menu-bg · --radius-sm
01 Dropdown menu Actions · Sort by
The file list header ships two dropdowns: Actions and Sort by. They open on hover; on mobile each is a native <select>.
rows38px, uppercase, 1px tracking, 500 weight
surfacelist attached under the trigger, --component-bg, no border or shadow
hover--component-bg-hover, never yellow
inapplicable itemshidden, not disabled; the list changes with the selection
sortthe active key carries an up or down arrow; picking it again flips direction
app.put.ioLESS + flaticon icons, radius 4. No shortcuts, separators or red item
One video selected. Create folder, Extract all and RSS feed drop out; Watched and Unwatched need Remember current place in video files.
Public-share files use a smaller Radix menu: sentence case, a trigger, Create a watch party, Download, Download MP4.
02 Context menu: file row proposed
Right-click on a file row would open the Actions items at the pointer, same order. The row holds --list-item-bg-active.
The.Wire.S03E04.Back.Burners.1080p.BluRay.x264-DEMAND.mkv
03 Submenu proposed
One level deep at most. The parent holds its hover surface while open. Shipped Sort by is flat (01).