JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
<div id="slideout">
    <input type="checkbox" id="showblock">
    <label id="slideout_tab" for="showblock" title="Admin Slider">
        <i class="fa fa-cogs fa-spin"></i>
    </label>
    <div id="slideout_inner">
        <form>
            <textarea></textarea>
            <input type="submit" value="Post feedback"></input>
        </form>
    </div>
</div>

CSS

#slideout {
        /* position: absolute; */
        position: fixed;
        top: 100px;
        right: 0;
        width: 35px;
        padding: 12px 0;
        text-align: center;
        background: #6DAD53;
        color: #fff;
        cursor:pointer;
        -webkit-transition-duration: 0.3s;
        -moz-transition-duration: 0.3s;
        -o-transition-duration: 0.3s;
        transition-duration: 0.3s;
        -webkit-border-radius: 5px 0 0 5px;
        -moz-border-radius: 5px 0 0 5px;
        border-radius: 5px 0 0 5px;
    }
    #slideout_inner {
        position: fixed;
        top: 100px;
        right: -250px;
        background: #6DAD53;
        width: 200px;
        padding: 25px;
        height: 130px;
        cursor:auto;
        -webkit-transition-duration: 0.3s;
        -moz-transition-duration: 0.3s;
        -o-transition-duration: 0.3s;
        transition-duration: 0.3s;
        -webkit-border-radius: 0 0 0 5px;
        -moz-border-radius: 0 0 0 5px;
        border-radius: 0 0 0 5px;
    }
    #slideout_inner textarea {
        width: 190px;
        height: 100px;
        margin-bottom: 6px;
    }
    #showblock:checked + #slideout{right: 250px;}
    #showblock{display:none;}