Sahaj33's picture
must create all pages. Design a beautiful, modern desktop UI for a “Minecraft Server Manager” application. The style should be: • Dark mode base (#1e1e2e) with teal/cyan accents (#00b894). • Inter or JetBrains Mono for body and monospace for code. • 2XL rounded corners on cards & buttons, soft drop shadows, 16px padding and 24px gutters throughout. • Vertical sidebar on the left with icons + labels: Dashboard, Servers, Create Server, Console, Mods, Backups, Performance, Tunnel, Settings. • Top bar with app title (“Sahaj33 Server Manager”), theme toggle, and close/minimize controls. Create mockups for these screens: Dashboard Big Start, Stop, Restart buttons Status badge (🟢 Running / 🔴 Stopped) Info cards: Public IP (ngrok URL), LAN IP, Port, Edition, Version, Players online “Reload” button and skeleton loaders for data fetching Servers List Table of existing servers with columns: Name, Edition, Version, Status, Players, Actions (Start/Stop/Restart/Delete) Search/filter bar on top Create Server Wizard Step 1: Choose Edition (Java/Bedrock) + Flavor (Vanilla, Paper, Fabric, etc.) + Version dropdown (with “Show Snapshots” toggle) Step 2: Allocate RAM (slider + numeric input, default suggestion based on system RAM) Step 3: Select or browse server folder via file‑picker button Step 4: Accept EULA checkbox (disables “Next” until checked) + “Finish” button Console Full‑width scrollable log window (dark monospaced text) Command input at bottom with “Send” button “Clear” and “Download Log” icons Mods Search bar with source toggle (CurseForge / Modrinth) List of popular mods with thumbnails, name, version, “Install” / “Remove” buttons Installed mods shown separately Backups “Backup Now” button + schedule dropdown (Off / Hourly / Daily / Weekly) Table of backups: Timestamp, Size, Description, Actions (Restore, Delete) Performance Live charts: CPU %, RAM %, TPS (line graphs) Uptime counter, player count, tick rate badge Tunnel “Start Tunnel” and “Stop Tunnel” buttons Display public URL card with copy‑to‑clipboard icon Status badge (Active/Inactive) Settings Tabs or sections: General (MOTD, max players, difficulty, game rules), Advanced (auto-update jars, mod folder), Tunnel (ngrok token input here), Appearance (theme toggle), About Save button fixed at bottom For each screen, include: Clear hover, pressed, and disabled states on buttons Toast/pop‑up notifications for success/error Skeleton loaders while fetching data Generate a single cohesive design system: color palette, typography scale, button styles, input styles, cards, modals, dialogs. Deliverables: high-fidelity mockups for each screen, plus a unified style guide. - Initial Deployment
b9c53ec verified