JSFiddle - React, Tailwind, and code Playground

HTML

<div class="dragx">
    <div class="left">normal app < slide this way for settings<<</div>
        <div class="right">settings panel(hidden outside of screen)<br /> slide >that> way to go normal screen </div>
</div>

CSS

html, body {margin:0;padding:0;top:0px;left:0;}

.dragx {
    width: 640px;
    height: 400px;
    margin:0;padding:0;top:0px;left:0;
}
.left {
    float:left;
    background-color:#acacac;
    width: 320px;
    height:100%;
}
.right {
    float: right;
    background-color:#000000;
    color:#ffffff;
    width: 320px;
    height:100%;
}