Home
Continue with a client
Recent files
| File name | Client / location | Modified | Size |
|---|
Recent activity
Your workspaceClient backup assets
Abwab ElKheir · Website backup
Clients
| Client | Primary brand | Purchased services | Status |
|---|
Madarej
Projects 3
Shared client folders
Recently updated
| File name | Location | Modified |
|---|
Website
| File name | Tags / state | Modified | Size |
|---|
Client activity
A quiet workspace for client assets
Palette and typography
#315CE8
#182230
#596579
#F8F9FB
#DFE3EA
Arial with system sans-serif fallback. Page title 28/34, semibold; section heading 16/24; body 14/21; table 12/18; metadata 11/16. Production Arabic names must preserve their script and use bidi isolation. Production may use a locally hosted Arabic-compatible font.
Status: success #18704A on #EEF8F2; warning #875D0D on #FFF8E7; destructive #B42318. Color always accompanies a readable label.
Layout tokens
- Sidebar 224px; top bar 64px; content max-width 1360px; desktop padding 40px.
- 8px spacing foundation. Gaps: 8, 12, 16, 24 and 32px. Panel radius 8px, button radius 6px.
- Three home cards; client content with 280px context column; 24px section gap.
- Table header 40px and row approximately 58px. Drawer 420px; upload modal 520px.
- Under 1100px: padding 24px, context column 250px. Under 768px: navigation drawer, single-column cards, 16px padding, 44px action targets.
- Wide tables scroll inside their own region. Production file names truncate visually with accessible full-name detail.
Core interaction flow
Home → client → project or shared folder → file drawer → preview, version history or download. Returning from the drawer preserves folder, filters, scroll and selection.
Upload from Home asks for a client and destination. Upload inside a folder preselects that destination. Each file shows real transfer state and can retry independently.
Search spans permitted metadata. A result carries its location. Home is a continuation surface, with no revenue charts, sales funnels or task feed.
Archive preserves data and makes it read-only. Trash is a separate recovery action. Technical references point to a password manager; they never reveal stored passwords here.
Components and states
Button variants: primary, secondary, quiet and destructive. States: hover, visible focus, disabled, loading with stable width. List states: skeleton, populated, empty with one action, no-results with Clear filters, error with Retry.
Upload states: queued, uploading, verifying, scanning, ready, failed and cancelled. Unsupported preview shows metadata and Download original. An unscanned backup keeps its warning.
Dialogs require focus trapping, Escape to close and focus restoration. Drawer changes announce the file name. Search has labels; counts and status updates use live regions. Tab order follows the screen hierarchy.
Motion 120ms, ease-out; honor reduced motion. Never animate list reordering while a user selects files.