diff options
| -rw-r--r-- | app/javascript/mastodon/containers/mastodon.js | 127 | ||||
| -rw-r--r-- | app/javascript/styles/components.scss | 19 | ||||
| -rw-r--r-- | app/javascript/styles/containers.scss | 10 |
3 files changed, 8 insertions, 148 deletions
diff --git a/app/javascript/mastodon/containers/mastodon.js b/app/javascript/mastodon/containers/mastodon.js index c21e84d9c..09ee09142 100644 --- a/app/javascript/mastodon/containers/mastodon.js +++ b/app/javascript/mastodon/containers/mastodon.js @@ -104,125 +104,6 @@ addLocaleData([ ...tr, ]); -const getTopWhenReplacing = (previous, { location }) => location && location.action === 'REPLACE' && [0, 0]; - -const hiddenColumnContainerStyle = { - position: 'absolute', - left: '0', - top: '0', - visibility: 'hidden' -}; - -class Container extends React.PureComponent { - - constructor(props) { - super(props); - - this.state = { - renderedPersistents: [], - unrenderedPersistents: [], - }; - } - - componentWillMount () { - this.unlistenHistory = null; - - this.setState(() => { - return { - mountImpersistent: false, - renderedPersistents: [], - unrenderedPersistents: [ - {pathname: '/timelines/home', component: HomeTimeline}, - {pathname: '/timelines/public', component: PublicTimeline}, - {pathname: '/timelines/public/local', component: CommunityTimeline}, - - {pathname: '/notifications', component: Notifications}, - {pathname: '/favourites', component: FavouritedStatuses} - ], - }; - }, () => { - if (this.unlistenHistory) { - return; - } - - this.unlistenHistory = browserHistory.listen(location => { - const pathname = location.pathname.replace(/\/$/, '').toLowerCase(); - - this.setState(oldState => { - let persistentMatched = false; - - const newState = { - renderedPersistents: oldState.renderedPersistents.map(persistent => { - const givenMatched = persistent.pathname === pathname; - - if (givenMatched) { - persistentMatched = true; - } - - return { - hidden: !givenMatched, - pathname: persistent.pathname, - component: persistent.component - }; - }), - }; - - if (!persistentMatched) { - newState.unrenderedPersistents = []; - - oldState.unrenderedPersistents.forEach(persistent => { - if (persistent.pathname === pathname) { - persistentMatched = true; - - newState.renderedPersistents.push({ - hidden: false, - pathname: persistent.pathname, - component: persistent.component - }); - } else { - newState.unrenderedPersistents.push(persistent); - } - }); - } - - newState.mountImpersistent = !persistentMatched; - - return newState; - }); - }); - }); - } - - componentWillUnmount () { - if (this.unlistenHistory) { - this.unlistenHistory(); - } - - this.unlistenHistory = "done"; - } - - render () { - // Hide some components rather than unmounting them to allow to show again - // quickly and keep the view state such as the scrolled offset. - const persistentsView = this.state.renderedPersistents.map((persistent) => - <div aria-hidden={persistent.hidden} key={persistent.pathname} className='mastodon-column-container' style={persistent.hidden ? hiddenColumnContainerStyle : null}> - <persistent.component shouldUpdateScroll={persistent.hidden ? Function.prototype : getTopWhenReplacing} /> - </div> - ); - - return ( - <UI> - {this.state.mountImpersistent && this.props.children} - {persistentsView} - </UI> - ); - } -} - -Container.propTypes = { - children: PropTypes.node, -}; - class Mastodon extends React.PureComponent { componentDidMount() { @@ -304,11 +185,17 @@ class Mastodon extends React.PureComponent { <IntlProvider locale={locale} messages={getMessagesForLocale(locale)}> <Provider store={store}> <Router history={browserHistory} render={applyRouterMiddleware(useScroll())}> - <Route path='/' component={Container}> + <Route path='/' component={UI}> <IndexRedirect to='/getting-started' /> <Route path='getting-started' component={GettingStarted} /> + <Route path='timelines/home' component={HomeTimeline} /> + <Route path='timelines/public' component={PublicTimeline} /> + <Route path='timelines/public/local' component={CommunityTimeline} /> <Route path='timelines/tag/:id' component={HashtagTimeline} /> + <Route path='notifications' component={Notifications} /> + <Route path='favourites' component={FavouritedStatuses} /> + <Route path='statuses/new' component={Compose} /> <Route path='statuses/:statusId' component={Status} /> <Route path='statuses/:statusId/reblogs' component={Reblogs} /> diff --git a/app/javascript/styles/components.scss b/app/javascript/styles/components.scss index 773ef0a5b..4de8b7969 100644 --- a/app/javascript/styles/components.scss +++ b/app/javascript/styles/components.scss @@ -1312,23 +1312,6 @@ } } -@media screen and (min-width: 1397px) { /* Width of 4 columns with margins */ - .columns-area { - margin-left: auto; - margin-right: auto; - } -} - -@media screen and (min-width: 1900px) { - .column, - .drawer { - width: 400px; - border-radius: 4px; - height: 96vh; - margin-top: 2vh; - } -} - .drawer__pager { box-sizing: border-box; padding: 0; @@ -1772,7 +1755,7 @@ .getting-started { box-sizing: border-box; padding-bottom: 235px; - background: url('../images/mastodon-getting-started.png') no-repeat 0 100% / contain local; + background: url('../images/mastodon-getting-started.png') no-repeat 0 100%; flex: 1 0 auto; p { diff --git a/app/javascript/styles/containers.scss b/app/javascript/styles/containers.scss index 390b9596c..68f73e0c0 100644 --- a/app/javascript/styles/containers.scss +++ b/app/javascript/styles/containers.scss @@ -9,16 +9,6 @@ } } -.mastodon-column-container { - display: flex; - height: 100%; - width: 100%; - - // 707568 - height 100% doesn't work on child of a flex item - chromium - Monorail - // https://bugs.chromium.org/p/chromium/issues/detail?id=707568 - flex: 1 1 auto; -} - .logo-container { max-width: 400px; margin: 100px auto; |