Merge pull request #63 from RieLCho/master

Enable horizontal centering
050644zf · Oct 11, 2024 · ab25fd5 · ab25fd5
2 parents 273c141 + 9409d27
commit ab25fd5
Showing 1 changed file with 18 additions and 7 deletions.
diff --git a/reader/src/ASTRv2/content/img.vue b/reader/src/ASTRv2/content/img.vue
@@ -1,11 +1,13 @@
 <template>
-  <n-image
-    :class="{
-      images: imgtype == 'images' || bgMode == 'full',
-      backgrounds: imgtype == 'backgrounds' && bgMode == 'stripe',
-    }"
-    :src="getAvgUrl()"
-  />
+  <div class="image-container">
+    <n-image
+      :class="{
+        images: imgtype == 'images' || bgMode == 'full',
+        backgrounds: imgtype == 'backgrounds' && bgMode == 'stripe',
+      }"
+      :src="getAvgUrl()"
+    />
+  </div>
 </template>
 
 <script>
@@ -39,6 +41,15 @@ export default {
 </script>
 
 <style>
+.image-container {
+  text-align: center;
+}
+
+.image-container n-image {
+  display: block;
+  margin: 0 auto;
+}
+
 .line .images img {
   max-width: 500px;
   max-height: 300px;