Fix lightbox blocking clicks on page elements

The CSS change in 39575a0 added `display: flex` to the lightbox dialog
unconditionally, which overrode the browser's default `display: none`
for closed dialogs. This made the invisible lightbox overlay intercept
all clicks on the page.

Move flexbox properties to the `&[open]` selector so they only apply
when the dialog is actually open.

Also fix typo: `innerHtml` → `innerHTML` (capital H).

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Mike Dalessio
2026-01-28 17:51:32 -05:00
parent a67dea6347
commit 17b7af9b92
2 changed files with 4 additions and 4 deletions
@@ -30,7 +30,7 @@ export default class extends Controller {
reset() {
this.zoomedImageTarget.src = ""
this.captionTarget.innerHtml = "&nbsp;"
this.captionTarget.innerHTML = "&nbsp;"
this.dispatch('closed')
}