diff --git a/app/assets/stylesheets/lightbox.css b/app/assets/stylesheets/lightbox.css index b1b73af513..6ec846c3dd 100644 --- a/app/assets/stylesheets/lightbox.css +++ b/app/assets/stylesheets/lightbox.css @@ -3,14 +3,11 @@ --dialog-duration: 350ms; --lightbox-padding: 3vmin; - align-items: center; background-color: transparent; block-size: 100dvh; border: 0; - display: flex; inline-size: 100dvw; inset: 0; - justify-content: center; margin: auto; max-height: unset; max-width: unset; @@ -39,6 +36,9 @@ /* Open state */ &[open], &[open]::backdrop { + align-items: center; + display: flex; + justify-content: center; opacity: 1; @starting-style { diff --git a/app/javascript/controllers/lightbox_controller.js b/app/javascript/controllers/lightbox_controller.js index a30d5dd233..5197cb063f 100644 --- a/app/javascript/controllers/lightbox_controller.js +++ b/app/javascript/controllers/lightbox_controller.js @@ -30,7 +30,7 @@ export default class extends Controller { reset() { this.zoomedImageTarget.src = "" - this.captionTarget.innerHtml = " " + this.captionTarget.innerHTML = " " this.dispatch('closed') }