From 4abddf5e6a3ec5d7cc0d7095197f863ba8d3918e Mon Sep 17 00:00:00 2001
From: RiedleroD <github@riedler.wien>
Date: Sun, 16 Jun 2024 15:20:16 +0200
Subject: [PATCH] made wide column layout optional

---
 src/App.js                                         | 6 +++++-
 src/App.scss                                       | 6 +++++-
 src/components/settings_modal/tabs/general_tab.vue | 5 +++++
 src/i18n/de.json                                   | 1 +
 src/i18n/en.json                                   | 1 +
 src/modules/config.js                              | 1 +
 src/modules/instance.js                            | 1 +
 7 files changed, 19 insertions(+), 2 deletions(-)

diff --git a/src/App.js b/src/App.js
index 3e0d0d6f..77b40b62 100644
--- a/src/App.js
+++ b/src/App.js
@@ -59,7 +59,8 @@ export default {
         {
           '-reverse': this.reverseLayout,
           '-no-sticky-headers': this.noSticky,
-          '-has-new-post-button': this.newPostButtonShown
+          '-has-new-post-button': this.newPostButtonShown,
+          '-wide-timeline': this.widenTimeline
         },
         '-' + this.layoutType
       ]
@@ -93,6 +94,9 @@ export default {
     newPostButtonShown () {
       return this.$store.getters.mergedConfig.alwaysShowNewPostButton || this.layoutType === 'mobile'
     },
+    widenTimeline () {
+      return this.$store.getters.mergedConfig.widenTimeline
+    },
     showFeaturesPanel () { return this.$store.state.instance.showFeaturesPanel },
     editingAvailable () { return this.$store.state.instance.editingAvailable },
     layoutType () { return this.$store.state.interface.layoutType },
diff --git a/src/App.scss b/src/App.scss
index fe95eacd..5071cc2e 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -177,7 +177,7 @@ nav {
 
 .app-layout {
   --miniColumn: 25rem;
-  --maxiColumn: minmax(var(--miniColumn), 1fr);
+  --maxiColumn: minmax(var(--miniColumn), 45rem);
   --columnGap: 1em;
   --status-margin: 0.75em;
 
@@ -195,6 +195,10 @@ nav {
   min-height: 100vh;
   overflow-x: clip;
 
+  &.-wide-timeline {
+    --maxiColumn: minmax(var(--miniColumn), 1fr);
+  }
+
   .column {
     --___columnMargin: var(--columnGap);
 
diff --git a/src/components/settings_modal/tabs/general_tab.vue b/src/components/settings_modal/tabs/general_tab.vue
index 4f314ca0..fa4cf64f 100644
--- a/src/components/settings_modal/tabs/general_tab.vue
+++ b/src/components/settings_modal/tabs/general_tab.vue
@@ -269,6 +269,11 @@
             {{ $t('settings.right_sidebar') }}
           </BooleanSetting>
         </li>
+        <li>
+          <BooleanSetting path="widenTimeline">
+            {{ $t('settings.widen_timeline') }}
+          </BooleanSetting>
+        </li>
         <li>
           <ChoiceSetting
             v-if="user"
diff --git a/src/i18n/de.json b/src/i18n/de.json
index d5a7b1c0..b45d3d87 100644
--- a/src/i18n/de.json
+++ b/src/i18n/de.json
@@ -934,6 +934,7 @@
             "title": "Version"
         },
         "virtual_scrolling": "Anzeige der Zeitleiste optimieren",
+        "widen_timeline": "Zeitleiste verbreitern, um horizontalen Platz zu füllen",
         "word_filter": "Wortfilter",
         "wordfilter": "Wortfilter"
     },
diff --git a/src/i18n/en.json b/src/i18n/en.json
index 44971a51..f0090e06 100644
--- a/src/i18n/en.json
+++ b/src/i18n/en.json
@@ -948,6 +948,7 @@
         },
         "virtual_scrolling": "Optimize timeline rendering",
         "use_blurhash": "Use blurhashes for NSFW thumbnails",
+        "widen_timeline": "Widen the Timeline to fill horizontal space",
         "word_filter": "Word filter",
         "wordfilter": "Wordfilter"
     },
diff --git a/src/modules/config.js b/src/modules/config.js
index 038bb24e..bd6dd577 100644
--- a/src/modules/config.js
+++ b/src/modules/config.js
@@ -77,6 +77,7 @@ export const defaultState = {
   hideScopeNotice: false,
   useStreamingApi: false,
   sidebarRight: undefined, // instance default
+  widenTimeline: undefined, // instance default
   subjectLineBehavior: undefined, // instance default
   alwaysShowSubjectInput: undefined, // instance default
   postContentType: undefined, // instance default
diff --git a/src/modules/instance.js b/src/modules/instance.js
index 0c856352..19252ecc 100644
--- a/src/modules/instance.js
+++ b/src/modules/instance.js
@@ -61,6 +61,7 @@ const defaultState = {
   showNavShortcuts: true,
   showWiderShortcuts: true,
   sidebarRight: false,
+  widenTimeline: true,
   subjectLineBehavior: 'email',
   theme: 'pleroma-dark',
   virtualScrolling: true,