untitled

untitled.carbide.md

undefined

This Gist was automatically created by Carbide, a free online programming environment.

You can view a live, interactive version of this Gist here.

cell0.js

import React from 'react'
import ReactDOM from 'react-dom'
import $ from 'jquery'

var app = $('<div>').attr({id: 'app'})
$(document.body).html(app)

$(document.head).append('<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/g/bootswatch(darkly/bootstrap.min.css)">')

var Button = React.createClass({
    render: function() {
        return (<button className={'btn ' + 'btn-default'} onClick={this.props.click}>{this.props.children}</button>)
    }
})

var Container = React.createClass({
    render: function() {
        return (
        	<div className="container" style={this.props.style}>
                {this.props.children}
        	</div>
        )
    }
})

var containerStyle = {
    marginTop: '2em'
}
var clicker = function(){ console.log('clicked') }

ReactDOM.render(<Container style={containerStyle}><Button click={function(){ console.log(312123) }}>Super duper</Button></Container>, app[0])

main.css

body {
    margin-top: 2em;
}