diff options
| author | Fabian Mastenbroek <mail.fabianm@gmail.com> | 2020-10-29 00:53:52 +0100 |
|---|---|---|
| committer | Fabian Mastenbroek <mail.fabianm@gmail.com> | 2021-05-10 17:17:30 +0200 |
| commit | 6e6f14db8986f5de6491b51117de0e1b0438b341 (patch) | |
| tree | 7ee3fe59d5eaf03202fc0df4085ca9d4c7c280c0 /opendc-web/opendc-web-ui/src/components/home/IntroSection.js | |
| parent | 4d4fb1bb19c045e78c74e57816ebee251e1d7d08 (diff) | |
ui: Adapt home components to Reactstrap
Diffstat (limited to 'opendc-web/opendc-web-ui/src/components/home/IntroSection.js')
| -rw-r--r-- | opendc-web/opendc-web-ui/src/components/home/IntroSection.js | 21 |
1 files changed, 11 insertions, 10 deletions
diff --git a/opendc-web/opendc-web-ui/src/components/home/IntroSection.js b/opendc-web/opendc-web-ui/src/components/home/IntroSection.js index a799272a..bc6ee83b 100644 --- a/opendc-web/opendc-web-ui/src/components/home/IntroSection.js +++ b/opendc-web/opendc-web-ui/src/components/home/IntroSection.js @@ -1,18 +1,19 @@ import React from 'react' +import { Container, Row, Col } from 'reactstrap' const IntroSection = () => ( <section id="intro" className="intro-section"> - <div className="container pt-5 pb-3"> - <div className="row justify-content-center"> - <div className="col-xl-4 col-lg-4 col-md-4 col-sm-8 col-8"> + <Container className="pt-5 pb-3"> + <Row className="justify-content-center"> + <Col xl="4" lg="4" md="4" sm="8"> <h4>The datacenter (DC) industry...</h4> <ul> <li>Is worth over $15 bn, and growing</li> <li>Has many hard-to-grasp concepts</li> <li>Needs to become accessible to many</li> </ul> - </div> - <div className="col-xl-4 col-lg-4 col-md-4 col-sm-8 col-8"> + </Col> + <Col xl="4" lg="4" md="4" sm="8"> <img src="img/datacenter-drawing.png" className="col-12 img-fluid" @@ -23,17 +24,17 @@ const IntroSection = () => ( Image source </a> </p> - </div> - <div className="col-xl-4 col-lg-4 col-md-4 col-sm-8 col-8"> + </Col> + <Col xl="4" lg="4" md="4" sm="8"> <h4>OpenDC provides...</h4> <ul> <li>Collaborative online DC modeling</li> <li>Diverse and effective DC simulation</li> <li>Exploratory DC performance feedback</li> </ul> - </div> - </div> - </div> + </Col> + </Row> + </Container> </section> ) |