feat(typography): add component (#378)

material-components · Nov 20, 2018 · e46acf5 · e46acf5
1 parent 18ccbb1
commit e46acf5
Show file tree

Hide file tree

Showing 26 changed files with 8,963 additions and 8,213 deletions.
diff --git a/examples/roses/Feedback.js b/examples/roses/Feedback.js
@@ -27,6 +27,7 @@ import TopAppBar from '@material/react-top-app-bar';
 import TextField, {Input, HelperText} from '@material/react-text-field';
 import Button from '@material/react-button';
 import MaterialIcon from '@material/react-material-icon';
+import {Body2, Headline6} from '@material/react-typography';
 
 class Feedback extends React.Component {
   state = {
@@ -78,20 +79,20 @@ class Feedback extends React.Component {
   renderMessage() {
     return (
       <div>
-        <h2 className='mdc-typography--headline6 mdc-theme--primary'>
+        <Headline6 className='mdc-theme--primary' tag='h2'>
           Thanks for spreading joy with Red Roses
-        </h2>
-        <p className='mdc-typography--body2 message__subheader'>
+        </Headline6>
+        <Body2 className='message__subheader'>
           We would love to hear about your ordering experience.
-        </p>
+        </Body2>
       </div>
     );
   }
 
   renderFeedbackTextField() {
     const helperText = (
       <HelperText persistent>
-        Don't worry feedback is never shared with couriers
+        Don&apos;t worry feedback is never shared with couriers
       </HelperText>
     );
     return (

diff --git a/examples/roses/package.json b/examples/roses/package.json
@@ -40,6 +40,7 @@
     "@material/react-switch": "^0.5.0",
     "@material/react-text-field": "^0.5.1",
     "@material/react-top-app-bar": "^0.5.0",
+    "@material/react-typography": "0.0.0",
     "@material/shape": "^0.40.0",
     "@material/theme": "^0.40.0",
     "@material/typography": "^0.39.0"