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;