bvandeusen
104cac5dca
Operator-flagged 2026-05-28: tooltips (e.g. the action buttons in Subscriptions → Subscriptions) render near-white-on-near-white, unreadable. Cause: Vuetify's default v-tooltip pairs `on-surface-variant` text with an `surface-variant` background. FC's theme deliberately maps `on-surface-variant` to vellum (#C2BFB4 — a light cream, the correct muted-text token for captions/hints on the dark page) but never defines `surface-variant`, so Vuetify auto-generates a light-ish tooltip background. Light text on light bg. Fix is tooltip-specific so it doesn't disturb the (correctly light) muted-text token elsewhere. New app-global stylesheet frontend/src/styles/app.css, imported in main.js AFTER vuetify/styles (equal-specificity rule wins by source order), overrides `.v-tooltip > .v-overlay__content` to a dark elevated panel (surface-bright = slate #2C313A) with high-contrast parchment text (#E8E4D8) + a subtle border + shadow. Applies to every tooltip in the app, so the fix is consistent rather than per-component.
30 lines
799 B
JavaScript
30 lines
799 B
JavaScript
import { createApp } from 'vue'
|
|
import { createPinia } from 'pinia'
|
|
import { createVuetify } from 'vuetify'
|
|
import 'vuetify/styles'
|
|
import '@mdi/font/css/materialdesignicons.css'
|
|
// App-global CSS overrides — imported AFTER vuetify/styles so equal-
|
|
// specificity rules (e.g. the tooltip readability fix) win by source order.
|
|
import './styles/app.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')
|