JSFiddle - React, Tailwind, and code Playground

by cahnory

HTML

<script src="http://cdn.ractivejs.org/edge/ractive.js"></script>
<div id="demo"></div>
<script id="demo-tpl" type="text/ractive">
    <email-button>button <strong>label</strong></email-button>
</script>

<script id="component-tpl" type="text/ractive">
  {{{ '<!--[if mso]><v:roundrect href="' + href + '" ><center>' + this.getContent() + '<![endif]-->' }}}
  <a href="{{ href }}">{{>content}}</a>
</script>

JavaScript

var
  component,
  view;

component = Ractive.extend({
    template: '#component-tpl',
    data: {
        content: function () {
            return 'if you find how, tel me';
        }
    }
});

view = new Ractive({
    el: 'demo',
    template: '#demo-tpl',
    components: {
        "email-button": component
    }
});