diff --git a/app/javascript/flavours/glitch/features/local_settings/page/index.jsx b/app/javascript/flavours/glitch/features/local_settings/page/index.jsx
index c2a6dcc1a7..1ff9e2514d 100644
--- a/app/javascript/flavours/glitch/features/local_settings/page/index.jsx
+++ b/app/javascript/flavours/glitch/features/local_settings/page/index.jsx
@@ -169,6 +169,15 @@ class LocalSettingsPage extends PureComponent {
+
+
+
+
),
diff --git a/app/javascript/flavours/glitch/features/ui/index.jsx b/app/javascript/flavours/glitch/features/ui/index.jsx
index 41d7f526e3..078ed32e85 100644
--- a/app/javascript/flavours/glitch/features/ui/index.jsx
+++ b/app/javascript/flavours/glitch/features/ui/index.jsx
@@ -95,6 +95,7 @@ const mapStateToProps = state => ({
hasMediaAttachments: state.getIn(['compose', 'media_attachments']).size > 0,
canUploadMore: !state.getIn(['compose', 'media_attachments']).some(x => ['audio', 'video'].includes(x.get('type'))) && state.getIn(['compose', 'media_attachments']).size < 4,
isWide: state.getIn(['local_settings', 'stretch']),
+ fullWidthColumns: state.getIn(['local_settings', 'fullwidth_columns']),
unreadNotifications: selectUnreadNotificationGroupsCount(state),
showFaviconBadge: state.getIn(['local_settings', 'notifications', 'favicon_badge']),
hicolorPrivacyIcons: state.getIn(['local_settings', 'hicolor_privacy_icons']),
@@ -284,6 +285,7 @@ class UI extends PureComponent {
dispatch: PropTypes.func.isRequired,
children: PropTypes.node,
isWide: PropTypes.bool,
+ fullWidthColumns: PropTypes.bool,
systemFontUi: PropTypes.bool,
isComposing: PropTypes.bool,
hasComposingText: PropTypes.bool,
@@ -624,6 +626,7 @@ class UI extends PureComponent {
const className = classNames('ui', {
'wide': isWide,
+ 'fullwidth-columns': this.props.fullWidthColumns,
'system-font': this.props.systemFontUi,
'hicolor-privacy-icons': this.props.hicolorPrivacyIcons,
});
diff --git a/app/javascript/flavours/glitch/locales/en.json b/app/javascript/flavours/glitch/locales/en.json
index 8466e7d317..320db1853c 100644
--- a/app/javascript/flavours/glitch/locales/en.json
+++ b/app/javascript/flavours/glitch/locales/en.json
@@ -63,6 +63,8 @@
"settings.content_warnings_unfold_opts": "Auto-unfolding options",
"settings.deprecated_setting": "This setting is now controlled from Mastodon's {settings_page_link}",
"settings.enable_content_warnings_auto_unfold": "Automatically unfold content-warnings",
+ "settings.fullwidth_view": "Stretch columns to full width (Desktop mode only)",
+ "settings.fullwidth_view_hint": "Stretches columns to fill all the available space.",
"settings.general": "General",
"settings.hicolor_privacy_icons": "High color privacy icons",
"settings.hicolor_privacy_icons.hint": "Display privacy icons in bright and easily distinguishable colors",
diff --git a/app/javascript/flavours/glitch/reducers/local_settings.js b/app/javascript/flavours/glitch/reducers/local_settings.js
index 225938ca22..ad7360cdbf 100644
--- a/app/javascript/flavours/glitch/reducers/local_settings.js
+++ b/app/javascript/flavours/glitch/reducers/local_settings.js
@@ -6,6 +6,7 @@ import { LOCAL_SETTING_CHANGE, LOCAL_SETTING_DELETE } from 'flavours/glitch/acti
import { STORE_HYDRATE } from 'flavours/glitch/actions/store';
const initialState = ImmutableMap({
+ fullwidth_columns: false,
stretch : true,
side_arm : 'none',
side_arm_reply_mode : 'keep',
diff --git a/app/javascript/flavours/glitch/styles/components.scss b/app/javascript/flavours/glitch/styles/components.scss
index f1d113a593..a1c12ae5e2 100644
--- a/app/javascript/flavours/glitch/styles/components.scss
+++ b/app/javascript/flavours/glitch/styles/components.scss
@@ -7028,6 +7028,13 @@ img.modal-warning {
}
}
+.fullwidth-columns .columns-area:not(.columns-area--mobile) {
+ .column {
+ flex: auto;
+ max-width: unset;
+ }
+}
+
.media-gallery__actions {
position: absolute;
top: 6px;