feat: scaffold Vue 3 + Vuetify + Pinia frontend themed to FabledDesignSystem

Curator signature accent (#A87338, aged amber) is baked into
fabled-tokens.js. Vuetify theme consumes the same tokens module the rest
of the SPA does, so updating design system tokens propagates throughout.
Vite dev server proxies /api and /ws to the Quart backend.

App.vue references AppShell (lands in Task 9) and main.js references
router.js (lands in Task 9) — these are intentionally split so Task 8 is
the framework scaffold and Task 9 is the navigation/shell content.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-05-14 07:35:33 -04:00
parent 8b5711abef
commit ad2ac31f1a
7 changed files with 175 additions and 0 deletions
+26
View File
@@ -0,0 +1,26 @@
import { createApp } from 'vue'
import { createPinia } from 'pinia'
import { createVuetify } from 'vuetify'
import 'vuetify/styles'
import '@mdi/font/css/materialdesignicons.css'
import App from './App.vue'
import router from './router.js'
import { fabledCuratorTheme } from './theme/vuetify-theme.js'
const vuetify = createVuetify({
theme: {
defaultTheme: 'fabledCurator',
themes: { fabledCurator: fabledCuratorTheme }
},
defaults: {
// FabledDesignSystem: pill shape for buttons
VBtn: { rounded: 'pill' }
}
})
createApp(App)
.use(createPinia())
.use(router)
.use(vuetify)
.mount('#app')