JSFiddle - React, Tailwind, and code Playground

by kentaromiura

HTML

<script src="http://www.polymer-project.org/platform.js?20140312"></script>
<script src="http://www.polymer-project.org/polymer.js?20140312"></script>
<polymer-element name="k-marquee">
    <template>
        <style>
            @-moz-keyframes marquee {
                0% {
                    text-indent:0;
                }
                100% {
                    text-indent:-100%;
                }
            }
            @keyframes marquee {
                0% {
                    text-indent:0;
                }
                100% {
                    text-indent:-100%;
                }
            }
            @-webkit-keyframes marquee {
                0% {
                    text-indent:0;
                }
                100% {
                    text-indent:-100%;
                }
            }
            .marquee {
                height:1em;
                padding:0.3em;
                width:100%;
                overflow:hidden;
                -webkit-animation: marquee 10s infinite;
                -moz-animation: marquee 10s infinite;
                animation: marquee 10s infinite;
            }
        </style>
        <div class="marquee">
            <content></content>
        </div>
    </template>
    <script>
        Polymer('k-marquee', {

        });
    </script>
</polymer-element>
<k-marquee>This is amazing</k-marquee>
<k-marquee style="color:red">This is even better</k-marquee>