Skip to content

Ean Schuessler / react-templates-test

Go to a project
Toggle navigation
Toggle navigation pinning
e1d3d210 by Ean Schuessler
Options

Use material widgets

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