JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<div class="hoteligaForm">
    <label for="from">From</label>
    <input type="text" id="from" name="from" />
    <label for="to">to</label>
    <input type="text" id="to" name="to" />
    <input type="hidden" id="roomTypeId" name="roomTypeId" value="2" />
    <label for="promocode">promo code</label>
    <input type="text" id="promocode" name="promocode" />
    <button id="searchBtn">Search</button>
</div>

CSS

.hoteligaForm,
input,
button {
    font-size: 16px;
    font-family: Arial, Helvetica, sans-serif;
}
input {
    width: 100px;
    text-align: center;
}
#searchBtn {
    color: white;
    background-color: blue;
}

JavaScript

var minArrivalOffset = 0; // minimum days ahead that one can book
var minStayDays = 3; // minimum stay in days at hotel
var maxStayDays = 31; // maximum stay in days at hotel
var numberOfMonths = 1; // how many months to display in pop-up calendar
var dateFormat = 'd/m/yy'; // or yy-mm-dd
var domain = 'demohoteliga'; // your hoteliga domain here

// helper function that returns a date in the future based on days offset
function getOffsetDate(dateRel, offset) {
    if (dateRel == null) dateRel = new Date();
    return new Date(dateRel.getFullYear(), dateRel.getMonth(), dateRel.getDate() + offset);
}

// returns the month and year of a date as hoteliga booking engine requires
function getMonthYearFromDate(inputDate) {
    return (inputDate.getMonth() + 1) + '-' + inputDate.getFullYear();
}

// event that fires when the user selects a date in the 'from'
// date picker. Min/max allowed dates in the 'to' datepicker
// are adjusted in this case
function onSelectDatepicker(selectedDate) {
    if (this.id == 'from') {
        var dateMin = $('#from').datepicker("getDate");
        $('#to').datepicker("option", "minDate", getOffsetDate(dateMin, minStayDays));
        $('#to').datepicker("option", "maxDate", getOffsetDate(dateMin, maxStayDays));
    }
}

// this creates string formatting functionality
// used by getHoteligaResultsUrl()
if (!String.prototype.format) {
    String.prototype.format = function() {
        var args = arguments;
        return this.replace(/{(\d+)}/g, function(match, number) {
            return typeof args[number] != 'undefined' ? args[number] : match;
        });
    };
}
// generates the hoteliga results page where the user will
// be redirected when the 'search' button is clicked
function getHoteligaResultsUrl(domain, df, myf, dt, myt, promocode, rtid) {
    return 'https://book.hoteliga.com/{0}/search/results?df={1}&myf={2}&dt={3}&myt={4}&promo={5}&rtid={6}'.format(domain, df, myf, dt, myt, promocode, rtid)
}

// code running on page...