JSFiddle - React, Tailwind, and code Playground

by qustosh

HTML

<!--<form>
<div style='float:right'><label for='category'>Category: </label><select id='category' type='text' name='category' ><option value='tv'>Tv</option><option value='movies'>Movies</option><option value='music'>Music</option><option value='games'>Games</option><option value='applications'>Applications</option><option value='anime'>Anime</option><option value='books'>Books</option><option value='releases'>Releases</option></select></div><br><br>

<div style='float:right'><label for='seedtreshold'>Minimum Number Of Seeds: </label><input id='seedtreshold' type='text' name='seedtreshold'></div><br><br>

<div style='float:right'><label for='startend'>How Many Pages: </label><input type='text' name='startend' id='startend'></div><br><br>

<div style='text-align:center;'><input value='search' type='button'/></div>
</form>-->

JavaScript

//construct form
    var form = $("<form></form>").css({
        position:"fixed",
        left: "10px",
        top: "10px",
        border:"black solid 2px",
        backgroundColor: "#C8C8C8",
        padding:"10px",
        borderRadius:"8px",
    });
    
    var formTitle = $("<div style='text-align:center;font-size:18px;'>KICKASS TORRENT SORTER</div><br>").appendTo(form);
    var inputCategory = $("<div style='float:right'><label for='category'>Category: </label><select id='category' type='text' name='category' ><option value='tv'>Tv</option><option value='movies'>Movies</option><option value='music'>Music</option><option value='games'>Games</option><option value='applications'>Applications</option><option value='anime'>Anime</option><option value='books'>Books</option><option value='releases'>Releases</option></select></div><br><br>").appendTo(form);
    var inputSeedsThreshold = $("<div style='float:right'><label for='seedtreshold'>Minimum Number Of Seeds: </label><input id='seedtreshold' type='text' name='seedtreshold'></div><br><br>").appendTo(form);
    var inputStartEnd = $("<div style='float:right'><label for='startend'>How Many Pages: </label><input type='text' name='startend' id='startend'></div><br><br>").appendTo(form);
    var formButton = $("<div style='text-align:center;'><input value='search' type='button'/></div>").appendTo(form);
    
    //add default values
    //form.find("#category").val(category);
    //form.find("#seedtreshold").val(seedsThreshold);
    //form.find("#startend").val(pageStartEnd);
    
    form.appendTo( $("body") );