Matt
79a706efe3
Mobile Table Redesign: - Redesigned mobile table layout with stacked status badges under contact info - Contact information takes 60% width with badges stacked below name/email - All status badges (Sales Process, EOI, Contract, Lead Category) now stack vertically - Eliminated horizontal scrolling issues and cramped mobile display Visual Improvements: - Optimized badge sizing (x-small) for mobile to fit more content - Enhanced spacing and alignment for better readability - Improved touch targets and visual hierarchy - Contact info and badges properly aligned for clean appearance Layout Structure: - Mobile: 3 columns (Contact+Badges 60%, Status 20%, Created 20%) - Desktop: Maintains original 6-column layout unchanged - Responsive breakpoint at 768px for optimal mobile experience User Experience Enhancements: - All status information visible without horizontal scrolling - Better content density and information accessibility - Maintained click functionality and hover effects - Consistent design language across mobile and desktop The mobile table now provides a much cleaner, more accessible experience with all status information clearly visible in a stacked format. |
||
|---|---|---|
| .gitea/workflows | ||
| components | ||
| composables | ||
| docs | ||
| middleware | ||
| pages | ||
| plugins | ||
| public | ||
| server | ||
| static | ||
| utils | ||
| .dockerignore | ||
| .env.example | ||
| .gitignore | ||
| Dockerfile | ||
| README.md | ||
| app.vue | ||
| nuxt.config.ts | ||
| package-lock.json | ||
| package.json | ||
| tsconfig.json | ||
README.md
Client Portal
Commands
npm run devto start development
Tech Stack
- Node.js
- Nuxt
- Directus
- Vuetify