JSFiddle - React, Tailwind, and code Playground

by XTREME104

HTML

<div class="example_bg">
        <div class="popover">
            <div class="popover-content">
                <div class="arrow"><span></span></div>
                <div class="popover-body">
                    <ul>
                        <li>This is dummy copy</li>
                        <li>It is not meant to be read</li>
                        <li>Thats right</li>
                        <li>Hi</li>
                    </ul>
                </div>
            </div>
        </div>
    </div>

CSS

.example_bg {
        width:750px;
        height:450px;
        -moz-border-radius:10px;
        -webkit-border-radius:10px;
        border-radius:10px;
        background:url(http://cl.ly/0m0D3y0j453S1J233G3c/Wood-Wallpaper-4.jpg);
        position:relative;
        margin:20px auto;
        -webkit-box-shadow: 0px 1px 2px 0px rgba(255, 255, 255, 0.4),inset 1px 1px 4px 0px rgba(0, 0, 0, 0.66);
        -moz-box-shadow: 0px 1px 2px 0px rgba(255, 255, 255, 0.4),inset 1px 1px 4px 0px rgba(0, 0, 0, 0.66);
        box-shadow: 0px 1px 2px 0px rgba(255, 255, 255, 0.4),inset 1px 1px 4px 0px rgba(0, 0, 0, 0.66);
        }
        
        .popover {
        position:absolute;
        left:50%;
        top:130px;
        width:236px;
        margin:0 -118px;
        }
        
        .popover .popover-content {
        border:1px solid #000;
        position:relative;
        -moz-border-radius:11px;
        -webkit-border-radius:11px;
        border-radius:11px;
        background-color: #575757;
        background-image: -webkit-gradient(linear, left top, left bottom, from(#575757), to(#373737)); /* Saf4+, Chrome */
        background-image: -webkit-linear-gradient(top, #575757, #373737); /* Chrome 10+, Saf5.1+, iOS 5+ */
        background-image:    -moz-linear-gradient(top, #575757, #373737); /* FF3.6 */
        background-image:     -ms-linear-gradient(top, #575757, #373737); /* IE10 */
        background-image:      -o-linear-gradient(top, #575757, #373737); /* Opera 11.10+ */
        background-image:         linear-gradient(top, #575757, #373737);
                  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#575757', EndColorStr='#373737'); /* IE6-IE9 */
        -webkit-box-shadow: inset 1px 1px 1px 0px rgba(255, 255, 255, 0.37), 0px 6px 18px 0px rgba(0, 0, 0, 0.95);
        -moz-box-shadow: inset 1px 1px 1px 0px rgba(255, 255, 255, 0.37), 0px 6px 18px 0px rgba(0, 0, 0, 0.95);
        box-shadow: inset 1px 1px 1px 0px rgba(255, 255, 255,...