# Fix UI Layout Issues on Non-Home Pages

I will fix the layout issues on all pages except Home, focusing on spacing (clearing the fixed header), container widths, and theme consistency.

## 1. Login Page (`client/src/pages/Login.vue`)
**Issue**: Currently uses a light theme that clashes with the global dark mode.
**Fix**: 
- Apply the global dark theme (`#050505`).
- Use glassmorphism for the login card.
- Style inputs and buttons to match the new design system.

## 2. Page Spacing & Layout Standardization
All standard pages need top padding to prevent content from being hidden behind the fixed header (`h-20`). I will apply `pt-32` (approx 128px) to ensure ample breathing room.

- **`About.vue`**: 
  - Add `pt-32`.
  - Increase container width to `max-w-6xl` for better 2-column layout.
- **`Blog.vue`**: 
  - Add `pt-32`.
  - Keep `max-w-4xl` for optimal reading width.
- **`BlogDetail.vue`**: 
  - Add `pt-32`.
  - Ensure the "Back" button has proper spacing.
- **`Snippets.vue`**: 
  - Add `pt-32`.
  - Wrap content in `max-w-7xl mx-auto px-6` for consistent grid alignment.
- **`Works.vue`**: 
  - Add `pt-32`.
  - Wrap content in `max-w-7xl mx-auto px-6`.

## 3. Work Detail Page (`client/src/pages/WorkDetail.vue`)
- This page uses a fullscreen overlay layout (`z-100`). I will verify it retains the correct dark theme colors and that the close button (`z-60`) remains clickable above the header.

I will proceed with applying these changes file by file.