Tooltip !important fix — 104cac5 follow-up after Vite CSS reorder #34

Merged
bvandeusen merged 0 commits from dev into main 2026-05-30 00:02:25 -04:00
bvandeusen commented 2026-05-29 23:53:22 -04:00 (Migrated from git.fabledsword.com)

Summary

  • Promotes .v-tooltip > .v-overlay__content's background and color to !important so the override beats Vuetify's default regardless of CSS chunk order in production builds.
  • Tightens the file's header comment so the (now-disproven) "source order wins" claim isn't carried forward.

Why

PR #33's 104cac5 introduced the tooltip-readability fix, but on the deployed :latest it still rendered light-on-light. Both selectors (.v-tooltip > .v-overlay__content) are tied at specificity, and the override relied on app.css being imported after vuetify/styles in main.js. Vite's production bundler reorders CSS chunks from node_modules into the final stylesheet unpredictably, so source-order ties aren't reliable. !important on the two contrast properties is the targeted fix; cosmetic border + shadow stay un-important since Vuetify doesn't set them.

Test plan

  • After :latest rebuilds and compose restarts, hover any v-tooltip (e.g., the "Check all sources" rerun button in Subscriptions → Subscriptions). Background should be slate (#2C313A); text should be parchment (#E8E4D8). DevTools → Computed should show the rule has !important and is the winning declaration.

🤖 Generated with Claude Code

## Summary - Promotes `.v-tooltip > .v-overlay__content`'s `background` and `color` to `!important` so the override beats Vuetify's default regardless of CSS chunk order in production builds. - Tightens the file's header comment so the (now-disproven) "source order wins" claim isn't carried forward. ## Why PR #33's `104cac5` introduced the tooltip-readability fix, but on the deployed `:latest` it still rendered light-on-light. Both selectors (`.v-tooltip > .v-overlay__content`) are tied at specificity, and the override relied on `app.css` being imported after `vuetify/styles` in `main.js`. Vite's production bundler reorders CSS chunks from `node_modules` into the final stylesheet unpredictably, so source-order ties aren't reliable. `!important` on the two contrast properties is the targeted fix; cosmetic border + shadow stay un-important since Vuetify doesn't set them. ## Test plan - [ ] After `:latest` rebuilds and compose restarts, hover any v-tooltip (e.g., the "Check all sources" rerun button in Subscriptions → Subscriptions). Background should be slate (#2C313A); text should be parchment (#E8E4D8). DevTools → Computed should show the rule has `!important` and is the winning declaration. 🤖 Generated with [Claude Code](https://claude.com/claude-code)
Sign in to join this conversation.
No Reviewers
No Label
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: bvandeusen/FabledCurator#34