JSFiddle - React, Tailwind, and code Playground

HTML

<!-- shady DOM -->
<base href="http://polygit.org/polymer+:master/components/">
<link rel=import href="polymer/polymer.html">

<dom-module id="x-foo">
  <template>
    <style>
      :host {
                background-color: #f3f3f3;
        border-bottom: 1px solid #cdcdcd;
        height: 30px;
      }
      :host-context(:host.green) {
        color: green;
      }
    </style>
    <slot></slot>
  </template>
</dom-module>

<div>
  <x-foo>Hello</x-foo>
</div>

JavaScript

Polymer({
  is: 'x-foo',
});