Modal: large centered spinner + kebab z-index fix #81

Merged

bvandeusen merged 2 commits from dev into main 2026-06-07 10:57:01 -04:00

Conversation 0 Commits 2 Files Changed 3

+43 -5

bvandeusen commented 2026-06-07 10:56:55 -04:00

Owner

Copy Link

Copy Source

What

Two modal polish fixes:

• 6c5dbfe — large centered loading spinner in the image viewer (was a tiny size-36 spinner pinned to the top-left corner). Dual concentric rings, accent-colored, centered overlay.
• 1226d3b — the real kebab fix. The tag-chip / suggestion kebab menus were teleporting with zIndex: "auto" on a position: fixed overlay, so they rendered behind .fc-viewer (z-index 2000) and got blurred by its backdrop-filter: blur(8px). The menu was opening the whole time — just underneath the modal. :z-index="2400" on both TagChip.vue and SuggestionItem.vue menus lifts them above it.

Why it kept "not landing"

Every prior fix chased a non-existent click/activation bug. Operator's DevTools inspection (zIndex: "auto", position: "fixed", visibility: "visible", menu visible "blurred behind the sidebar") pinned it as a stacking-context problem, not an event problem.

CI green on 1226d3b (run 676).

🤖 Generated with Claude Code

## What Two modal polish fixes: - **`6c5dbfe`** — large centered loading spinner in the image viewer (was a tiny size-36 spinner pinned to the top-left corner). Dual concentric rings, accent-colored, centered overlay. - **`1226d3b`** — **the real kebab fix.** The tag-chip / suggestion kebab menus were teleporting with `zIndex: "auto"` on a `position: fixed` overlay, so they rendered *behind* `.fc-viewer` (z-index 2000) and got blurred by its `backdrop-filter: blur(8px)`. The menu was opening the whole time — just underneath the modal. `:z-index="2400"` on both `TagChip.vue` and `SuggestionItem.vue` menus lifts them above it. ## Why it kept "not landing" Every prior fix chased a non-existent click/activation bug. Operator's DevTools inspection (`zIndex: "auto", position: "fixed", visibility: "visible"`, menu visible "blurred behind the sidebar") pinned it as a stacking-context problem, not an event problem. CI green on `1226d3b` (run 676). 🤖 Generated with [Claude Code](https://claude.com/claude-code)

bvandeusen added 2 commits 2026-06-07 10:56:55 -04:00

feat(modal): large centered loading spinner ... 6c5dbfe4a0

The old size-36 v-progress-circular sat tiny in the top-left because
.fc-viewer__media doesn't center its children (the canvas centers itself).
Replace it with a 108px dual counter-rotating accent-ring spinner as a centered,
non-interactive overlay over the modal (operator-flagged 2026-06-07).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

fix(modal): kebab menus render BEHIND the modal — bump z-index above it ... 1226d3b23a

THE actual root cause of the "dead" tag-chip kebab (operator inspected it
2026-06-07: the menu was ghosted, blurred, behind the sidebar). The teleported
v-menu landed below .fc-viewer (z-index 2000) and the modal's
backdrop-filter: blur(8px) smeared it — so it opened the whole time, just
underneath. Every prior "fix" (un-nesting the button, the explicit activator
pattern) was chasing a click/activation problem that never existed.

Set :z-index="2400" on the tag-chip and suggestion kebab menus so they paint
above the modal. (Dialogs already render on top — only the anchored menus tied
with the modal's z-index and lost.)

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

bvandeusen merged commit 1d84f67418 into main 2026-06-07 10:57:01 -04:00

Sign in to join this conversation.

Reviewers

No Reviewers

Labels

No items

No labels

Milestone

No items

No Milestone

Projects

Clear projects

No projects

Assignees

Clear assignees

renovate-bot bvandeusen

No Assignees

1 Participants

Notifications

Subscribe

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: bvandeusen/FabledCurator#81