fix: center via image wrapper (#380)

ttu-ttu · Oct 9, 2024 · a731085 · a731085
1 parent 049a6e6
commit a731085
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 3 deletions.
diff --git 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
@@ -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);
   };