Redesigns the MFA method cards and supporting sections for better visual hierarchy and professional styling: Method cards (organizer): - Vertical layout with large icon (VAvatar 44px) at top - Description text explaining each method - Status chip with check icon when configured - VCardActions with primary chip/button + "Opnieuw instellen" - Primary method card highlighted with 2px primary border - Proper h-100 for equal height side-by-side Backup codes: - Separate outlined VCard with key icon, progress bar, refresh button - Cleaner spacing and visual grouping Disable MFA: - Replaced heavy danger-zone card with subtle text button (tabler-shield-off icon, error color) — less visual weight for a rarely-used destructive action Portal: - Per-method rows with VAvatar icons and stacked status chips - Matching text-button style for disable action Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Crewli — Portal SPA
External-facing app for volunteers (login) and artists/suppliers (token links). Stripped Vuexy layout; same stack as other apps.
Setup
- Install dependencies:
pnpm install
- Create
.env.local:
VITE_API_URL=http://localhost:8000/api/v1
VITE_APP_NAME="Crewli Portal"
- Dev server uses port 5175 (see
vite.config.tsor run from repo root:make portal).
pnpm dev --port 5175
Port
Runs on http://localhost:5175
Production: e.g. VITE_API_URL=https://api.crewli.app/api/v1 and host the SPA at https://portal.crewli.app (portal links in emails use this host; see api/.env.example).