- Refactored `GatewayHero.tsx` to display a new dashboard header layout based on a provided mockup.
- The new design features a greeting, top status cards (Services, Clusters, Alerts), a central search bar, and quick access buttons.
- Bottom graphical cards for "Network Load" and "Global Mesh" were implemented using static styling mocks.
- Retained the core functionality of the central prompt input to route queries to `/xworkmate`.
- Adjusted the homepage spacing in `page.tsx` to accommodate the new top section while keeping the existing `UnifiedNavigation`, `StatsSection`, `ShortcutsSection`, and `Footer`.
- Verified UI changes against the mockup and handled minor review feedback (fixed greeting punctuation and header text contrast).
Co-authored-by: cloud-neutral <4133689+cloud-neutral@users.noreply.github.com>
- Implemented a new Material 3-inspired layout for the services page, following the user's design reference.
- Added a theme switcher to toggle between the original ("classic") and the new ("material") layouts.
- The theme preference is persisted in `localStorage` using a Zustand store.
- Ensured proper server-side rendering and client-side hydration by creating a custom `useViewStore` hook that prevents hydration mismatches.
- Created new components for the Material 3 layout: `Sidebar`, `Header`, and `Material3Layout`.
- Refactored the main services page (`src/app/services/page.tsx`) to conditionally render either the classic or material layout based on the selected theme.
- Moved the theme switcher to the `Footer` component to make it accessible in both views.
- Added a Playwright test to verify the functionality of the theme switcher.
