File tree Expand file tree Collapse file tree 1 file changed +7
-10
lines changed Expand file tree Collapse file tree 1 file changed +7
-10
lines changed Original file line number Diff line number Diff line change @@ -358,17 +358,19 @@ export default ({ children }) => (
358358)
359359```
360360
361- Then, create a new component page by creating a file at
361+ Then, create a new page component by creating a file at
362362` src/pages/about-css-modules.js ` :
363363
364364``` javascript
365365import React from " react"
366366
367+ import Container from " ../components/container"
368+
367369export default () => (
368- < div >
370+ < Container >
369371 < h1> About CSS Modules< / h1>
370372 < p> CSS Modules are cool< / p>
371- < / div >
373+ < / Container >
372374)
373375```
374376
@@ -387,11 +389,6 @@ that this CSS file should be processed as CSS modules.
387389Paste the following into the file:
388390
389391``` css
390- .container {
391- margin : 3rem auto ;
392- max-width : 600px ;
393- }
394-
395392.user {
396393 display : flex ;
397394 align-items : center ;
@@ -475,7 +472,7 @@ const User = props => (
475472)
476473
477474export default () => (
478- <div className={styles.container} >
475+ <Container >
479476 <h1>About CSS Modules</h1>
480477 <p>CSS Modules are cool</p>
481478 <User
@@ -488,7 +485,7 @@ export default () => (
488485 avatar="https://s3.amazonaws.com/uifaces/faces/twitter/vladarbatov/128.jpg"
489486 excerpt="I'm Bob smith, a vertically aligned type of guy. Lorem ipsum dolor sit amet, consectetur adipisicing elit."
490487 />
491- </div >
488+ </Container >
492489)
493490```
494491
You can’t perform that action at this time.
0 commit comments