diff --git a/package.json b/package.json index 628a865854ef09e8c6fcf9202036d5e6e3922280..27d9abe4b787666f0e34bee623a29968ec0080cc 100644 --- a/package.json +++ b/package.json @@ -16,9 +16,9 @@ "redux": "^4.0.1", "redux-logger": "^3.0.6", "redux-thunk": "^2.3.0", + "semantic-ui-calendar-react": "^0.12.2", "semantic-ui-css": "^2.4.0", "semantic-ui-react": "^0.84.0", - "semantic-ui-calendar-react": "^0.12.2", "slick-carousel": "^1.8.1" }, "scripts": { diff --git a/src/components/ScrollToTop.js b/src/components/ScrollToTop.js new file mode 100644 index 0000000000000000000000000000000000000000..1b01052d6695b4a1648646a4a84eab3d6a021203 --- /dev/null +++ b/src/components/ScrollToTop.js @@ -0,0 +1,20 @@ +import React, { Component } from 'react'; +import { withRouter } from 'react-router-dom'; + +/* +* Default ScrollResoration: +* https://reacttraining.com/react-router/web/guides/scroll-restoration +*/ +class ScrollToTop extends Component { + componentDidUpdate(prevProps) { + if (this.props.location !== prevProps.location) { + window.scrollTo(0, 0) + } + } + + render() { + return this.props.children; + } +} + +export default withRouter(ScrollToTop); diff --git a/src/components/pages/Schedule.js b/src/components/pages/Schedule.js index 1b7e66eda96f72edf024bb86160b8e911110b3d9..45fa296270a1e9139b304e328bf7b51e5ef60aa5 100644 --- a/src/components/pages/Schedule.js +++ b/src/components/pages/Schedule.js @@ -32,7 +32,7 @@ class Schedule extends Component { > <h3> <Grid> - <Grid.Column floated='left' width={5} textAlign='left'> + <Grid.Column floated='left' width={8} textAlign='left'> <Icon name='angle right' color='blue' />{event.name} </Grid.Column> <Grid.Column floated='right' width={8} textAlign='right'> @@ -42,23 +42,21 @@ class Schedule extends Component { </h3> </Accordion.Title> <Accordion.Content active={activeIndex === event.id}> - <Container text textAlign='left'> <p> {event.description} </p> - </Container> </Accordion.Content> </div> )); return ( <Container - textAlign='center' + textAlign='left' style={{ padding: '60px' }} > - <h2>KĂŠpzĂŠs alkalmak:</h2> + <h2>KĂŠpzĂŠsalkalmak:</h2> <Accordion fluid styled @@ -67,7 +65,6 @@ class Schedule extends Component { > {panels} </Accordion> - <h2>TĂĄbor:</h2> </Container> ); } diff --git a/src/index.js b/src/index.js index af527b41cb1261131ff98cf6a03ba010ff53a32e..93ca155db4c36ea98b369eb7e01dc19b390330ea 100644 --- a/src/index.js +++ b/src/index.js @@ -5,6 +5,7 @@ import { BrowserRouter as Router } from 'react-router-dom'; import 'slick-carousel/slick/slick.css'; import 'slick-carousel/slick/slick-theme.css'; import 'semantic-ui-css/semantic.min.css'; +import ScrollToTop from './components/ScrollToTop'; import configureStore from './configureStore'; import App from './components/App'; @@ -19,7 +20,9 @@ const store = configureStore(); render( <Provider store={store}> <Router> - <App /> + <ScrollToTop> + <App /> + </ScrollToTop> </Router> </Provider>, document.getElementById('root'),