Added overflow stop for mobile menu, shifting some stuff.

This commit is contained in:
2018-06-18 21:55:24 +10:00
parent c52c04db63
commit 07aa74f359
12 changed files with 244 additions and 67 deletions

View File

@ -27,6 +27,7 @@ import { withRouter } from 'react-router';
import PropTypes from 'prop-types'
import { HashRouter, Route, Switch } from 'react-router-dom';
import Header from './../header/Header';
import Footer from './../footer/Footer';
//Pages
@ -49,33 +50,35 @@ const RouteWrapper = (props) => {
);
};
const Routes = ({location}) => {
return (
<TransitionGroup className="o-page-transition__container">
<CSSTransition
key={ location.pathname }
timeout={1000}
classNames="o-page-transition"
mountOnEnter={ true }
unmountOnExit={ true }
onEntering={() => {
window.scroll({
top: 0,
left: 0,
behavior: 'smooth'
});
}}
>
<Switch location={ location }>
<RouteWrapper exact path="/" page={ Homepage } />
<RouteWrapper exact path="/about" page={ AboutPage } />
<RouteWrapper exact path="/contact" page={ ContactPage } />
</Switch>
</CSSTransition>
</TransitionGroup>
);
};
class Routes extends React.Component {
constructor(props) {
super(props);
}
export default withRouter(() => {
return <Route render={Routes} />
});
render() {
const { match, location, history } = this.props;
return (
<Route>
<TransitionGroup className="o-page-transition__container">
<CSSTransition
key={ location.pathname }
timeout={1000}
classNames="o-page-transition"
mountOnEnter={ true }
unmountOnExit={ true }
onEntering={ this.props.onEntering }
>
<Switch location={ location }>
<RouteWrapper exact path="/" page={ Homepage } />
<RouteWrapper exact path="/about" page={ AboutPage } />
<RouteWrapper exact path="/contact" page={ ContactPage } />
</Switch>
</CSSTransition>
</TransitionGroup>
</Route>
);
}
}
export default withRouter(Routes);

View File

@ -29,11 +29,15 @@ import Image from './../../image/Image';
import { Title, Subtitle } from './../../typography/Typography';
export default function() {
let lines = [];
for(let i = 0; i < 100; i++) {
lines.push(<br key={i} />);
}
return (
<Page style="home-page" className="p-home-page">
Welcome home
{ lines }
</Page>
);
}