2 files changed, 13 insertions, 0 deletions
diff --git a/src/components/settings/settings.js b/src/components/settings/settings.js
index 23c1acdb..6e2dff7b 100644
--- a/src/components/settings/settings.js
+++ b/src/components/settings/settings.js
@@ -12,6 +12,7 @@ const settings = {
     return {
       hideAttachmentsLocal: user.hideAttachments,
       hideAttachmentsInConvLocal: user.hideAttachmentsInConv,
+      maxThumbnails: user.maxThumbnails,
       hideNsfwLocal: user.hideNsfw,
       useOneClickNsfw: user.useOneClickNsfw,
       hideISPLocal: user.hideISP,
@@ -186,6 +187,10 @@ const settings = {
     },
     useContainFit (value) {
       this.$store.dispatch('setOption', { name: 'useContainFit', value })
+    },
+    maxThumbnails (value) {
+      value = this.maxThumbnails = Math.floor(Math.max(value, 0))
+      this.$store.dispatch('setOption', { name: 'maxThumbnails', value })
     }
   }
 }
diff --git a/src/components/settings/settings.vue b/src/components/settings/settings.vue
index f5e00995..16814f65 100644
--- a/src/components/settings/settings.vue
+++ b/src/components/settings/settings.vue
@@ -137,6 +137,10 @@
               <label for="hideAttachmentsInConv">{{$t('settings.hide_attachments_in_convo')}}</label>
             </li>
             <li>
+              <label for="maxThumbnails">{{$t('settings.max_thumbnails')}}</label>
+              <input class="number-input" type="number" id="maxThumbnails" v-model.number="maxThumbnails" min="0" step="1">
+            </li>
+            <li>
               <input type="checkbox" id="hideNsfw" v-model="hideNsfwLocal">
               <label for="hideNsfw">{{$t('settings.nsfw_clickthrough')}}</label>
             </li>
@@ -316,6 +320,10 @@
     min-width: 10em;
     padding: 0 2em;
   }
+
+  .number-input {
+    max-width: 6em;
+  }
 }
 .select-multiple {
   display: flex;