feat: centralize frontend Vuetify styling
This commit is contained in:
27
docs/TASKS/frontend/002-style-system-baseline.md
Normal file
27
docs/TASKS/frontend/002-style-system-baseline.md
Normal file
@@ -0,0 +1,27 @@
|
||||
# Task: Add frontend style system baseline
|
||||
|
||||
## Goal
|
||||
|
||||
Remove app-shell styling drift by routing shared chrome controls through Vuetify components and centralized theme-backed tokens.
|
||||
|
||||
## Scope
|
||||
|
||||
- Expose reusable CSS variables backed by the Vuetify theme.
|
||||
- Add shared app-shell primitives for navigation buttons, icon buttons, popovers, and menu items.
|
||||
- Replace native shell buttons with Vuetify controls in `App.vue`, `AppBar`, `AppSidebar`, `SidebarUserMenu`, and `WorkspaceSelector`.
|
||||
- Leave feature-screen native button migration to a follow-up task because it crosses many workflows.
|
||||
|
||||
## Validation
|
||||
|
||||
```bash
|
||||
cd frontend
|
||||
npm run build
|
||||
```
|
||||
|
||||
## Done
|
||||
|
||||
- [x] Tailwind preflight loads before Vuetify styles.
|
||||
- [x] App-owned CSS loads after Vuetify styles.
|
||||
- [x] Shared Vuetify defaults are centralized.
|
||||
- [x] Legacy global native button/card selectors were removed.
|
||||
- [x] App-shell styles use shared theme-backed tokens.
|
||||
31
docs/TASKS/frontend/003-vuetify-button-migration.md
Normal file
31
docs/TASKS/frontend/003-vuetify-button-migration.md
Normal file
@@ -0,0 +1,31 @@
|
||||
# Task: Replace native feature buttons with Vuetify controls
|
||||
|
||||
## Goal
|
||||
|
||||
Move remaining interactive feature-screen buttons from native `<button>` elements to Vuetify controls so button styling consistently flows through Vuetify.
|
||||
|
||||
## Scope
|
||||
|
||||
- Replace action buttons with `v-btn`.
|
||||
- Replace icon-only buttons with `v-btn` using icon-sized styling.
|
||||
- Preserve specialized non-button native controls only when Vuetify would reduce capability, such as file inputs.
|
||||
- Keep behavior unchanged while converting one feature area at a time.
|
||||
|
||||
## Likely Files
|
||||
|
||||
- `frontend/src/components/ImageCropperDialog.vue`
|
||||
- `frontend/src/features/**/**/*.vue`
|
||||
- `frontend/src/static/**/*.vue`
|
||||
|
||||
## Validation
|
||||
|
||||
```bash
|
||||
cd frontend
|
||||
npm run build
|
||||
```
|
||||
|
||||
## Done
|
||||
|
||||
- [x] Native `<button>` elements under `frontend/src/**/*.vue` were migrated to `v-btn`.
|
||||
- [x] Public SSR rendering installs the shared Vuetify plugin.
|
||||
- [x] Frontend build and public prerender pass.
|
||||
Reference in New Issue
Block a user