JSFiddle - React, Tailwind, and code Playground

by codemeasandwich

HTML

<!-- React Size tabel v2 -->

<script src="//cdnjs.cloudflare.com/ajax/libs/react/0.12.1/JSXTransformer.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/react/0.12.1/react-with-addons.js"></script>
<div id="container"/>
<script type="text/jsx">





   const title = "Kids";
const head =  [          "XS", "S", "M", "L", "XL" ];
const body = [[ "Chest",  32,   34,  36,  38,  40 ],
              ["Length",  37,   39,  41,  43,  44 ],
              ["Sleeve",  33,   35,  37,  39,  41 ],
              ["Shoulder", 27,  29,  31,  33,  35 ]];



/*

Tags:

Baby backpack black blous Children girl gloves hammock hats Hoodies Jackets Jewelry kids knitted laptop men outdoor phone Rainbow ring sleep Sleeveless soft starwars tofu toy unisex
Waterproof white winter woman women 

*/













var Table = React.createClass({
  render: function() {
    return <div className="urbenvegan-tabs">
        <div className="urbenvegan-tab">
            <input id="tab-1" name="tab-group-1" checked="checked" type="radio" />
            <label htmlFor="tab-1">cm</label>
            <div className="urbenvegan-tab-content">
                <table cellspacing="0" border="0">
                    <thead>
                        <tr>
                        
                        <td rowSpan="2" vAlign="middle" align="center" style={{textAlign: "center"}}>{title}</td>
                        
                        {
                        head.map( size => <td valign="middle" align="center">{size}</td> )
                        }
                           
                        </tr>
                        <tr>
                        {
                        body[0].map(()=> <td align="center"><strong>cm</strong></td>).slice(1)
                        }
                        </tr>
                    </thead>
                    <tbody>
                    {
                        body.map( (row,i) => <tr>
                        {
                            row.map(...