diff --git a/src/components/pages/Mentors.js b/src/components/pages/Mentors.js index 73dcb606e25cd59800586bc0fc8babad12e7f8f3..3f17c7c6ce6f5da59c8cd10cf7b4ed3b90d340a0 100644 --- a/src/components/pages/Mentors.js +++ b/src/components/pages/Mentors.js @@ -81,67 +81,39 @@ class Mentors extends Component { render() { return ( <div> + <Segment inverted textAlign='center' vertical> + <Container> + <Header + as='h1' + content='Mentorok' + inverted + style={{ + fontSize: '3em', + fontWeight: 'normal', + marginBottom: 0, + marginTop: '0.5em', + }} + /> + </Container> + </Segment> + <Responsive minWidth={768}> - <Segment inverted textAlign='center' vertical> - <Container> - <Header - as='h1' - content='Mentorok' - inverted - style={{ - fontSize: '3em', - fontWeight: 'normal', - marginBottom: 0, - marginTop: '0.5em', - }} - /> - </Container> - </Segment> <Container style={{paddingTop: '2em', paddingBottom: '5em'}}> {this.renderMentorsNormal()} </Container> </Responsive> + <Responsive minWidth={551} maxWidth={767}> - <Segment inverted textAlign='center' vertical> - <Container> - <Header - as='h1' - content='Mentorok' - inverted - style={{ - fontSize: '3em', - fontWeight: 'normal', - marginBottom: 0, - marginTop: '0.5em', - }} - /> - </Container> - </Segment> <Container style={{paddingTop: '2em', paddingBottom: '5em'}}> - <Card.Group itemsPerRow={2}> + <Card.Group centered itemsPerRow={2}> {this.renderMentorsMobile()} </Card.Group> </Container> </Responsive> <Responsive maxWidth={550}> - <Segment inverted textAlign='center' vertical> - <Container> - <Header - as='h1' - content='Mentorok' - inverted - style={{ - fontSize: '3em', - fontWeight: 'normal', - marginBottom: 0, - marginTop: '0.5em', - }} - /> - </Container> - </Segment> <Container style={{paddingTop: '2em', paddingBottom: '5em'}}> - <Card.Group itemsPerRow={1}> + <Card.Group centered itemsPerRow={1}> {this.renderMentorsMobile()} </Card.Group> </Container>