From bd6322e5331e0d7695a0f0632f6139b52713a117 Mon Sep 17 00:00:00 2001
From: Nazar Kanaev <nkanaev@live.com>
Date: Sun, 29 Jan 2023 14:28:43 +0000
Subject: [PATCH] set article view width limit

---
 src/assets/index.html          | 22 ++++++++++++----------
 src/assets/stylesheets/app.css |  5 +++++
 2 files changed, 17 insertions(+), 10 deletions(-)

diff --git a/src/assets/index.html b/src/assets/index.html
index 6fb9711..85453ef 100644
--- a/src/assets/index.html
+++ b/src/assets/index.html
@@ -334,17 +334,19 @@
                  class="content px-4 pt-3 pb-5 border-top overflow-auto"
                  :class="{'font-serif': theme.font == 'serif', 'font-monospace': theme.font == 'monospace'}"
                  :style="{'font-size': theme.size + 'rem'}">
-                <h1><b>{{ itemSelectedDetails.title || 'untitled' }}</b></h1>
-                <div class="text-muted">
-                    <div>{{ feedsById[itemSelectedDetails.feed_id].title }}</div>
-                    <time>{{ formatDate(itemSelectedDetails.date) }}</time>
+                <div class="content-wrapper">
+                    <h1><b>{{ itemSelectedDetails.title || 'untitled' }}</b></h1>
+                    <div class="text-muted">
+                        <div>{{ feedsById[itemSelectedDetails.feed_id].title }}</div>
+                        <time>{{ formatDate(itemSelectedDetails.date) }}</time>
+                    </div>
+                    <hr>
+                    <div v-if="!itemSelectedReadability">
+                        <img :src="itemSelectedDetails.image" v-if="itemSelectedDetails.image" class="mb-3">
+                        <audio class="w-100" controls v-if="itemSelectedDetails.podcast_url" :src="itemSelectedDetails.podcast_url"></audio>
+                    </div>
+                    <div v-html="itemSelectedContent"></div>
                 </div>
-                <hr>
-                <div v-if="!itemSelectedReadability">
-                    <img :src="itemSelectedDetails.image" v-if="itemSelectedDetails.image" class="mb-3">
-                    <audio class="w-100" controls v-if="itemSelectedDetails.podcast_url" :src="itemSelectedDetails.podcast_url"></audio>
-                </div>
-                <div v-html="itemSelectedContent"></div>
             </div>
         </div>
         <modal :open="!!settings" @hide="settings = ''">
diff --git a/src/assets/stylesheets/app.css b/src/assets/stylesheets/app.css
index ab7aae2..3cb62ed 100644
--- a/src/assets/stylesheets/app.css
+++ b/src/assets/stylesheets/app.css
@@ -353,6 +353,11 @@ select.form-control:not([multiple]):not([size]) {
   line-height: 1.5;
 }
 
+.content-wrapper {
+  max-width: 60rem;
+  margin: 0 auto;
+}
+
 .content img, .content video {
   max-width: 100%;
   height: auto;