mirror of https://github.com/Siphonay/mastodon
Added settings toggle to move the navbar at the bottom in mobile view (#93)
This commit is contained in:
parent
984d2d4cb6
commit
74a0cc6a11
|
@ -53,6 +53,14 @@ export default class LocalSettingsPage extends React.PureComponent {
|
||||||
>
|
>
|
||||||
<FormattedMessage id='settings.wide_view' defaultMessage='Wide view (Desktop mode only)' />
|
<FormattedMessage id='settings.wide_view' defaultMessage='Wide view (Desktop mode only)' />
|
||||||
</LocalSettingsPageItem>
|
</LocalSettingsPageItem>
|
||||||
|
<LocalSettingsPageItem
|
||||||
|
settings={settings}
|
||||||
|
item={['navbar_under']}
|
||||||
|
id='mastodon-settings--navbar_under'
|
||||||
|
onChange={onChange}
|
||||||
|
>
|
||||||
|
<FormattedMessage id='settings.navbar_under' defaultMessage='Navbar at the bottom (Mobile only)' />
|
||||||
|
</LocalSettingsPageItem>
|
||||||
</div>
|
</div>
|
||||||
),
|
),
|
||||||
({ onChange, settings }) => (
|
({ onChange, settings }) => (
|
||||||
|
|
|
@ -26,6 +26,7 @@
|
||||||
"settings.media_fullwidth": "Full-width media previews",
|
"settings.media_fullwidth": "Full-width media previews",
|
||||||
"settings.preferences": "User preferences",
|
"settings.preferences": "User preferences",
|
||||||
"settings.wide_view": "Wide view (Desktop mode only)",
|
"settings.wide_view": "Wide view (Desktop mode only)",
|
||||||
|
"settings.navbar_under": "Navbar at the bottom (Mobile only)",
|
||||||
"status.collapse": "Collapse",
|
"status.collapse": "Collapse",
|
||||||
"status.uncollapse": "Uncollapse",
|
"status.uncollapse": "Uncollapse",
|
||||||
"notification.markForDeletion": "Mark for deletion"
|
"notification.markForDeletion": "Mark for deletion"
|
||||||
|
|
|
@ -51,6 +51,7 @@ These are only used if no previously-saved values exist.
|
||||||
const initialState = ImmutableMap({
|
const initialState = ImmutableMap({
|
||||||
layout : 'auto',
|
layout : 'auto',
|
||||||
stretch : true,
|
stretch : true,
|
||||||
|
navbar_under : false,
|
||||||
collapsed : ImmutableMap({
|
collapsed : ImmutableMap({
|
||||||
enabled : true,
|
enabled : true,
|
||||||
auto : ImmutableMap({
|
auto : ImmutableMap({
|
||||||
|
|
|
@ -45,6 +45,7 @@ const mapStateToProps = state => ({
|
||||||
systemFontUi: state.getIn(['meta', 'system_font_ui']),
|
systemFontUi: state.getIn(['meta', 'system_font_ui']),
|
||||||
layout: state.getIn(['local_settings', 'layout']),
|
layout: state.getIn(['local_settings', 'layout']),
|
||||||
isWide: state.getIn(['local_settings', 'stretch']),
|
isWide: state.getIn(['local_settings', 'stretch']),
|
||||||
|
navbarUnder: state.getIn(['local_settings', 'navbar_under']),
|
||||||
isComposing: state.getIn(['compose', 'is_composing']),
|
isComposing: state.getIn(['compose', 'is_composing']),
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -57,6 +58,7 @@ export default class UI extends React.PureComponent {
|
||||||
layout: PropTypes.string,
|
layout: PropTypes.string,
|
||||||
isWide: PropTypes.bool,
|
isWide: PropTypes.bool,
|
||||||
systemFontUi: PropTypes.bool,
|
systemFontUi: PropTypes.bool,
|
||||||
|
navbarUnder: PropTypes.bool,
|
||||||
isComposing: PropTypes.bool,
|
isComposing: PropTypes.bool,
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -167,7 +169,7 @@ export default class UI extends React.PureComponent {
|
||||||
|
|
||||||
render () {
|
render () {
|
||||||
const { width, draggingOver } = this.state;
|
const { width, draggingOver } = this.state;
|
||||||
const { children, layout, isWide } = this.props;
|
const { children, layout, isWide, navbarUnder } = this.props;
|
||||||
|
|
||||||
const columnsClass = layout => {
|
const columnsClass = layout => {
|
||||||
switch (layout) {
|
switch (layout) {
|
||||||
|
@ -187,7 +189,7 @@ export default class UI extends React.PureComponent {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={className} ref={this.setRef}>
|
<div className={className} ref={this.setRef}>
|
||||||
<TabsBar />
|
{navbarUnder ? null : (<TabsBar />)}
|
||||||
<ColumnsAreaContainer singleColumn={isMobile(width, layout)}>
|
<ColumnsAreaContainer singleColumn={isMobile(width, layout)}>
|
||||||
<WrappedSwitch>
|
<WrappedSwitch>
|
||||||
<Redirect from='/' to='/getting-started' exact />
|
<Redirect from='/' to='/getting-started' exact />
|
||||||
|
@ -218,6 +220,7 @@ export default class UI extends React.PureComponent {
|
||||||
</WrappedSwitch>
|
</WrappedSwitch>
|
||||||
</ColumnsAreaContainer>
|
</ColumnsAreaContainer>
|
||||||
<NotificationsContainer />
|
<NotificationsContainer />
|
||||||
|
{navbarUnder ? (<TabsBar />) : null}
|
||||||
<LoadingBarContainer className='loading-bar' />
|
<LoadingBarContainer className='loading-bar' />
|
||||||
<ModalContainer />
|
<ModalContainer />
|
||||||
<UploadArea active={draggingOver} onClose={this.closeUploadModal} />
|
<UploadArea active={draggingOver} onClose={this.closeUploadModal} />
|
||||||
|
|
Loading…
Reference in New Issue