tarrien/Mastodon
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

[Glitch] Add single-column mode

Browse Source 
Port 9ddeb30f90 to glitch-soc

Signed-off-by: Thibaut Girka <thib@sitedethib.com>
This commit is contained in:
Eugen Rochko
2019-05-23 01:35:22 +02:00
committed by ThibG
parent fe5c4f976c
commit 610b4b44c4
11 changed files with 247 additions and 83 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
app/javascript/flavours/glitch/features/ui/index.js
View File

@ -2,7 +2,6 @@ import React from 'react';
import NotificationsContainer from './containers/notifications_container';
import PropTypes from 'prop-types';
import LoadingBarContainer from './containers/loading_bar_container';
import TabsBar from './components/tabs_bar';
import ModalContainer from './containers/modal_container';
import { connect } from 'react-redux';
import { Redirect, withRouter } from 'react-router-dom';
@ -69,6 +68,7 @@ const mapStateToProps = state => ({
unreadNotifications: state.getIn(['notifications', 'unread']),
showFaviconBadge: state.getIn(['local_settings', 'notifications', 'favicon_badge']),
hicolorPrivacyIcons: state.getIn(['local_settings', 'hicolor_privacy_icons']),
forceSingleColumn: state.getIn(['settings', 'forceSingleColumn'], false),
});
const keyMap = {
@ -126,6 +126,7 @@ export default class UI extends React.Component {
dropdownMenuIsOpen: PropTypes.bool,
unreadNotifications: PropTypes.number,
showFaviconBadge: PropTypes.bool,
forceSingleColumn: PropTypes.bool,
};
state = {
@ -431,7 +432,9 @@ export default class UI extends React.Component {
render () {
const { width, draggingOver } = this.state;
const { children, layout, isWide, navbarUnder, dropdownMenuIsOpen } = this.props;
const { children, layout, isWide, navbarUnder, dropdownMenuIsOpen, forceSingleColumn } = this.props;
const singleColumn = forceSingleColumn || isMobile(width, layout);
const redirect = singleColumn ? <Redirect from='/' to='/timelines/home' exact /> : <Redirect from='/' to='/getting-started' exact />;
const columnsClass = layout => {
switch (layout) {
@ -475,11 +478,9 @@ export default class UI extends React.Component {
return (
<HotKeys keyMap={keyMap} handlers={handlers} ref={this.setHotkeysRef} attach={window} focused>
<div className={className} ref={this.setRef} style={{ pointerEvents: dropdownMenuIsOpen ? 'none' : null }}>
{navbarUnder ? null : (<TabsBar />)}
<ColumnsAreaContainer ref={this.setColumnsAreaRef} singleColumn={isMobile(width, layout)}>
<ColumnsAreaContainer ref={this.setColumnsAreaRef} singleColumn={singleColumn}>
<WrappedSwitch>
<Redirect from='/' to='/getting-started' exact />
{redirect}
<WrappedRoute path='/getting-started' component={GettingStarted} content={children} />
<WrappedRoute path='/keyboard-shortcuts' component={KeyboardShortcuts} content={children} />
<WrappedRoute path='/timelines/home' component={HomeTimeline} content={children} />
@ -518,7 +519,6 @@ export default class UI extends React.Component {
</ColumnsAreaContainer>
<NotificationsContainer />
{navbarUnder ? (<TabsBar />) : null}
<LoadingBarContainer className='loading-bar' />
<ModalContainer />
<UploadArea active={draggingOver} onClose={this.closeUploadModal} />