OpenFileConverter Edge WASM Studio
Screen #12 of 60 Batch 2 mobile • 390x844px

Mobile File Staging & Upload Queue Drawer

Open Route
Specification & Codex Reference Prompt (Click to expand) (File staging state after user selects 3 files from the iOS photo picker/files app, with target format pills and convert CTA.)

Screen Role: File staging state after user selects 3 files from the iOS photo picker/files app, with target format pills and convert CTA.

Design Intent: A mobile app UI mockup of file conversion staging at 390x844 resolution (iPhone 15 Pro) in bright Light Mode. White background (#FFFFFF). Top navigation bar with title "Queue (3 Files)" and "Clear All" text button. Vertical stack of 3 white file cards with subtle borders and shadows: - Card 1: Thumbnail of photo, name "IMG_4920.HEIC", size "4.8 MB", target format pill "[ JPG v ]", and trash vector icon. - Card 2: Document vector icon, "Contract_Draft.docx", size "1.2 MB", target pill "[ PDF v ]". - Card 3: Video vector icon, "Screen_Record.mov", size "34.5 MB", target pill "[ MP4 v ]". Bottom sticky white card with bulk convert button: "Convert 3 Files (Free)" in solid indigo with vector bolt icon and subtext "Local in-browser conversion". Clean mobile typography, zero emojis.

Component Architecture: Django Cotton components (<c-file_converter.* />) with Tailwind tokens matching Labb.io design language.

Direct route: /file-converter/queue/ Template: file_converter/screens/screen_12.html
Live Django Implementation (mobile)
Isolate →
9:41
Queue (3 Files) 40.5 MB Total
IMG
IMG_4920.HEIC 4.8 MB • Camera Photo
DOC
Contract_Draft.docx 1.2 MB • Word Document
MOV
Screen_Record.mov 34.5 MB • QuickTime Video
Local in-browser conversion • 0MB cellular data upload
Original Codex Reference Mockup Full PNG
Authoritative Reference for Screen #12