js-form-dialog/css/style.min.css

A simple vanilla js library to generate custom form on the go.

.modal{display:none;position:fixed;z-index:1;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:#000;background-color:rgba(0,0,0,.4)}.modal-content{background-color:#fefefe;margin:15% auto;padding:20px;border:1px solid #888;width:80%;position:relative}.title{color:#000;float:left;font-size:18px;font-weight:700;width:100%;position:relative}.title.center{text-align:center}.close{color:#aaa;float:right;font-size:28px;font-weight:700;position:absolute;right:10px;top:10px}.close:focus,.close:hover{color:#000;text-decoration:none;cursor:pointer}#form_body{padding:15px}#form_body>.full{width:97%}#form_body>.half{margin-top:2%;width:46%;float:left}#form_body>.half:last-child{margin-left:4%}#form_body input[type=number],#form_body input[type=password],#form_body input[type=text]{padding:6px 10px;margin:8px 0;box-sizing:border-box}#form_body input[type=text]:focus{border-color:#add8e6}#form_body input[type=button],#form_body input[type=reset],#form_body input[type=submit]{background-color:#4caf50;border:none;color:#fff;padding:8px 12px;text-decoration:none;margin:4px 2px;cursor:pointer}