# Session Log — 2026-03-14 ## Overview Major frontend redesign session replacing the Vuexy-based design system with a custom EZSCALE design system. Also fixed several critical backend bugs related to billing, provisioning, and security. The redesign touched all 4 layouts, created new shared components, replaced the SCSS foundation, updated the color palette from purple (#7367F0) to navy blue (#1d4ed8), and migrated fonts to Plus Jakarta Sans + JetBrains Mono. --- ## Frontend Redesign ### Phase 0: Foundation - Installed `echarts`, `vue-echarts`, `@vueuse/core`; removed `@mdi/font` - Replaced Inter/Public Sans fonts with **Plus Jakarta Sans** (UI) + **JetBrains Mono** (code) via Bunny Fonts - Deleted all 38 Vuexy `@core` SCSS files - Created 8 new SCSS design system files: - `_variables.scss`, `_mixins.scss`, `_animations.scss`, `_typography.scss` - `_component-overrides.scss`, `_marketing.scss`, `_layouts.scss`, `styles.scss` - Rewrote Vuetify config: navy blue palette (`#1d4ed8` primary, `#3b82f6` primary-light), pill buttons, subdomain-aware theming (light for marketing, dark for admin/account) - Updated `vite.config.ts`: removed `@core-scss` and `@configured-variables` aliases - Updated `variables/_vuetify.scss` and `variables/_template.scss` ### Phase 1: Layout Infrastructure - Deleted 5 old VerticalNav* components and 4 `@layouts/styles` SCSS files - Created 8 new shared components: - `AppSidebar` — collapsible sidebar for admin/account layouts - `AppTopNavbar` — top navigation bar with search, theme switcher, notifications - `CommandPalette` — Cmd+K command palette for quick navigation - `ToastStack` — toast notification display (uses Pinia store) - `NotificationPanel` — slide-out notification panel - `SkeletonLoader` — loading placeholder component - `EmptyState` — empty state with icon/message/action - `Breadcrumbs` — breadcrumb navigation component - Created Pinia toast store (`stores/toast.ts`) - Rebuilt all 4 layouts: - `AdminLayout` — sidebar + navbar + command palette + notifications + toasts - `AccountLayout` — same pattern + impersonation banner - `MarketingLayout` — transparent navbar + mega footer + mobile drawer - `AuthLayout` — split-screen with gradient art panel - Updated admin navigation (reorganized groups) and marketing navigation (removed BattlefieldAcp) ### Phase 2: Marketing Components Created 9 marketing components: - `HeroSection` — reusable hero with gradient background and CTA buttons - `NetworkHero` — animated SVG network visualization - `VpsHero`, `DedicatedHero`, `WebHostingHero`, `GameServerHero` — product-specific animated heroes - `GlassCard` — glassmorphism card component - `ScrollReveal` — intersection observer scroll animation wrapper - `PricingCard` — pricing plan card with feature list and CTA ### Phase 3: Page Migration - Replaced `AppTextField`/`AppSelect`/`AppTextarea` with native `VTextField`/`VSelect`/`VTextarea` across all 28 pages - Updated 5 marketing page heroes to use `HeroSection` + animated SVGs - Merged `Products.vue` into `Home.vue`, `BattlefieldAcp.vue` into `GameServers.vue` (with featured section) - Added 301 redirects for `/products` -> `/` and `/battlefield-acp` -> `/game-servers` - Deleted old wrapper components (`AppTextField`, `AppSelect`, `AppTextarea`, `FlashMessages`, `NotificationBell`) ### Phase 4: Polish - Theme persistence: `ThemeSwitcher` saves to localStorage (`ezscale-theme` key), Vuetify reads on init - Theme-aware styles: navbar/footer use CSS custom properties, hero sections force white text - Fixed `About.vue` sections (`bg-surface-variant` -> `section-alt-bg`) - Set default VChip size to `small` globally - Visual verification via headless Chrome screenshots --- ## Critical Bug Fixes 1. **placeOrder() column fixes** — Fixed wrong column names: `payment_method` -> `payment_gateway`, removed non-existent `order_id` on Service/Invoice, removed non-existent `subtotal` on Invoice, added `service_id`/`completed_at` on Order, added `service_type`/`platform` on Service 2. **VirtFusion provisioning_info** — Changed from non-existent column to storing in credentials via `array_merge` 3. **PayPal webhook verification** — Added header verification for `PAYPAL-TRANSMISSION-*` headers 4. **VPS root password exposure** — Moved from success flash to separate `new_password` flash key with secure dialog 5. **ensure_not_suspended middleware** — Applied to account routes, added bypass for impersonation stop, added banned check 6. **User::invoices() override** — Renamed to `billingInvoices()` to avoid conflict with Laravel Cashier's `invoices()` method, updated all 7+ call sites, aliased `withCount` --- ## Important Fixes 7. **Impersonation stop** — Added route on account subdomain, fixed AccountLayout link to use account domain 8. **Performance indexes** — Migration adding indexes on `invoices.status`, `orders.status`, `audit_logs.action`, `audit_logs.created_at` 9. **Invoice number collisions** — Replaced `count()+1` and `rand()` with `Str::random(6)` 10. **Dashboard caching** — Wrapped stats in `Cache::remember` with 5-min TTL 11. **last_four -> last4** — Fixed Stripe property name in BillingController 12. **FlashProps type** — Added `info` and `new_password` keys --- ## Files Changed Summary ### New Files - 8 SCSS design system files (`resources/styles/`) - 8 shared Vue components (`resources/ts/Components/`) - 9 marketing Vue components (`resources/ts/Components/marketing/`) - 1 Pinia store (`resources/ts/stores/toast.ts`) - 1 migration (performance indexes) ### Deleted Files - 38 Vuexy `@core` SCSS files - 5 VerticalNav* components - 4 `@layouts/styles` SCSS files - 3 app-form-elements wrapper components (`AppTextField`, `AppSelect`, `AppTextarea`) - `FlashMessages.vue`, `NotificationBell.vue` - `Products.vue`, `BattlefieldAcp.vue` (merged into other pages) ### Modified Files - All 4 layouts rebuilt - 28+ Vue pages updated (component replacements) - Vuetify plugin config rewritten - `vite.config.ts` updated - Navigation configs updated - Multiple PHP controllers/models (bug fixes) - `bootstrap/app.php` (middleware changes) --- ## Test Results Tests were not re-run as part of this documentation session. Previous count: 347 tests, 1866 assertions.