mirror of
https://github.com/storytold/artcraft.git
synced 2026-11-04 17:38:10 +00:00
Align the shared @storyteller/ui-moodboard surface with the webapp's design language across both hosts (Tauri desktop + webapp), plus several UX fixes. Theming & layout - Use `var(--st-bg, hsl(0 0% 9%))` for the workspace/grid background so desktop follows the active theme while the webapp falls back to its --background token (replaces the desktop-only bg-ui-background class). - Fix desktop overflow: the fixed TopBar is 56px, so the moodboard tab now uses h-screen + pt-[56px] + overflow-hidden, killing the stray vertical/horizontal scrollbars on an empty board. Grid view root clips too. Empty state & toolbars - Empty-state Upload / From-library CTAs now use the shared Button, matching the webapp create pages (h-12, pill, semibold; primary + secondary). - Restyle SelectionBar to match the library multiselect bar (solid pill, filled bg-ui-controls buttons, red Delete, round clear); align the "Move to" menu/items/Kbd to the same idiom. - Restyle SmartSearchBar (bg-ui-controls, rounded-xl) and tighten ToolbarShell padding. - Add a tooltip to the toolbar's Add Color button to match the sibling buttons. Notes - Adding a note creates an empty, immediately-editable note (autofocusing inline textarea; commit on blur/Enter, Shift+Enter newline, Esc reverts); double-click re-enters edit mode — no more stuck "New note". - Pad the note's top so the selection check no longer overlaps the first line. Selection - Clicks accumulate: clicking an item adds it to the selection (clicking again removes it), so multi-select builds up without a modifier; background click clears. "Use as reference" only shows when the selection has a reference-capable image. Item inspector - Redesign ItemInspector to mirror the shared LightboxModal: a bounded, centered, draggable/resizable Modal with media on a dark plate, hover nav arrows, and a fixed info/actions column using shared Buttons. Webapp homepage - Add a Moodboard card next to Edit Video on the webapp home page.