JSFiddle - React, Tailwind, and code Playground

by survivant

HTML

<script src="https://npmcdn.com/[email protected]/dist/react-with-addons.js"></script>
<script src="https://npmcdn.com/[email protected]/dist/react-dom.js"></script>
<script src="https://rawgit.com/vasconita/material-ui/master/umd/MaterialUI.min.js"></script>
<div id="container"></div>

Babel + JSX

const {
  AppBar,
  MuiThemeProvider,
  getMuiTheme,
} = MaterialUI;

class Example extends React.Component {
  render() {
    return (
      <AppBar
        titleStyle={{ lineHeight: 'normal' }}
        title={
          <div>
            <div style={{ marginTop: 10 }}>Title of My App</div>
            <div style={{ fontSize: 'small', fontWeight: 300 }}>This is the subtitle</div>
          </div>
        }
      />
    );
  }
}

const App = () => (
  <MuiThemeProvider muiTheme={getMuiTheme()}>
    <Example />
  </MuiThemeProvider>
);

ReactDOM.render(
  <App />,
  document.getElementById('container')
);