From a731085966ca7fd31daa70a978472c3855c94fd7 Mon Sep 17 00:00:00 2001
From: Renji-xD <Renji-XD@users.noreply.github.com>
Date: Wed, 9 Oct 2024 19:25:06 +0200
Subject: [PATCH] fix: center via image wrapper (#380)

---
 apps/web/src/lib/components/book-reader/styles.scss          | 5 +++--
 .../lib/functions/book-data-loader/format-book-data-html.ts  | 5 ++++-
 2 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/apps/web/src/lib/components/book-reader/styles.scss b/apps/web/src/lib/components/book-reader/styles.scss
index a64097ca..8f0d6df0 100644
--- a/apps/web/src/lib/components/book-reader/styles.scss
+++ b/apps/web/src/lib/components/book-reader/styles.scss
@@ -29,8 +29,9 @@
     }
   }
 
-  :global(.ttu-illustration-container) {
-    text-align: center;
+  :global(.ttu-img-parent) {
+    display: flex;
+    justify-content: center;
   }
 }
 
diff --git a/apps/web/src/lib/functions/book-data-loader/format-book-data-html.ts b/apps/web/src/lib/functions/book-data-loader/format-book-data-html.ts
index bf7b4d79..c4efd71e 100644
--- a/apps/web/src/lib/functions/book-data-loader/format-book-data-html.ts
+++ b/apps/web/src/lib/functions/book-data-loader/format-book-data-html.ts
@@ -113,8 +113,11 @@ function addSpoilerTags(el: HTMLElement, document: Document, blurMode: BlurMode)
 
   const createWrapper = (tag: Element, childNode: Element) => {
     const imgWrapper = document.createElement('span');
-    imgWrapper.toggleAttribute('data-ttu-spoiler-img');
     const parentElement = tag.parentElement || childNode;
+
+    imgWrapper.classList.add('ttu-img-parent');
+    imgWrapper.toggleAttribute('data-ttu-spoiler-img');
+
     parentElement.insertBefore(imgWrapper, tag);
     imgWrapper.appendChild(tag);
   };