JSFiddle - React, Tailwind, and code Playground

by dbelle

HTML

<dl>
<dt>Custom Size </dt>
        <dd><input type="text" class="w50px inputWidth" />w x <input type="text" class="w50px inputHeight" />h</dd>  
        <dd class="text-right"><button class="button cmsSecondary btnResize">Resize</button></dd>    
    </dl>
<div class="dialog" style="display: none;background:#fff;">
    You must define a value!
</div>

CSS

.ui-dialog-titlebar, .ui-dialog-buttonset{background:#000;}

JavaScript

$(".btnResize").click(function() {
    // Variables
    var myWidth = $("input.inputWidth").val(),
        myHeight = $("input.inputHeight").val();

    if (!myHeight || !myWidth) {
        $(".dialog").dialog({
            modal: true,
            buttons: {
                Ok: function() {
                    $(this).dialog("close");
                }
            }
        });
    }
    else if (myHeight > 0 && myWidth > 0) {
        var myWindow = window.open('', '', 'width=100,height=100');
        myWindow.resizeTo(myHeight, myWidth);
    }
});