e1d3d210 by Ean Schuessler

Use material widgets

1 parent 7b355a16
...@@ -16,6 +16,7 @@ ...@@ -16,6 +16,7 @@
16 "babel-preset-react": "^6.24.1", 16 "babel-preset-react": "^6.24.1",
17 "external-jsx-loader": "^1.1.0", 17 "external-jsx-loader": "^1.1.0",
18 "html-webpack-plugin": "^2.30.1", 18 "html-webpack-plugin": "^2.30.1",
19 "material-ui": "^0.20.0",
19 "react": "^16.2.0", 20 "react": "^16.2.0",
20 "react-dom": "^16.2.0", 21 "react-dom": "^16.2.0",
21 "react-templates": "^0.6.1", 22 "react-templates": "^0.6.1",
......
1 <html> 1 <html>
2 <head> 2 <head>
3 <title>Template Test</title> 3 <title>Template Test</title>
4 <style>
5 body { padding: 0; margin: 0 }
6 </style>
4 </head> 7 </head>
5 <body> 8 <body>
6 <div id="app" /> 9 <div id="app" />
......
1 import React from 'react' 1 import React from 'react'
2 import ReactDOM from 'react-dom' 2 import ReactDOM from 'react-dom'
3 import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider'
3 4
4 import App from './containers/app' 5 import App from './containers/app'
5 6
6 ReactDOM.render( 7 ReactDOM.render(
7 <App message="Hello" />, 8 <MuiThemeProvider>
9 <App message="Hello" />
10 </MuiThemeProvider>,
8 document.getElementById('app') 11 document.getElementById('app')
9 ) 12 )
......
1 <rt-import name="default" as="AppBar" from="material-ui/AppBar" />
2 <rt-import name="default" as="Paper" from="material-ui/Paper" />
1 <div rt-stateless> 3 <div rt-stateless>
2 <h1>The message is <q>{props.message}</q></h1> 4 <AppBar title="Test" iconClassNameRight="muidocs-icon-navigation-expand-more" />
3 {props.input} 5 <Paper style="{{padding: 10, margin: 10}}">
6 <h1>The message is <q>{props.message}</q></h1>
7 {props.input}
8 </Paper>
4 </div> 9 </div>
......
1 <div>Input <input></div> 1 <rt-import name="default" as="RaisedButton" from="material-ui/RaisedButton" />
2 <rt-import name="default" as="TextField" from="material-ui/TextField" />
3 <div>
4 <TextField hintText="The message" /><br />
5 <RaisedButton label="Do it" />
6 </div>
......