JSFiddle - React, Tailwind, and code Playground

by kigorw

HTML

<html>

<head>

    <style>
        html {
            font-family:arial;
        }
        .calendar-subcontainer{
            background-color:#fff;
            
            color:#356AA0;
        }
        .selected-date-container{
        width:198px;
        border:1px solid #999;
        }
        #calend td {
            cursor:pointer;
        }
        .days-header td{
            font-weight:bold;
            cursor:default !important;
        }
        .selected-day{
            font-weight:bold;
            color:#fff;
            background-color:#A3815B;
        }
        .calendar-invoker{
            height:35px;
            align:center;
            padding-bottom:10px;
            width:202px;
        }
        .today-invoker{
            cursor:pointer;
            margin-left:30px;
            font-size:12px;
            color:#A3815B;
        }
        .err-msg{
            color:red;
            font-size:11;
        }
        .calendar-container{
            border:1px solid #999;
            width:200px;
        }
    </style>

<script>

        /*main function for rerendering current month
        it fills in already rendered <td> elements with actual month day numbers,
        shifting them according what day of week month begins
        */
        function _rerenderMonth(d) {

            var tempDate = new Date(d.getFullYear(),d.getMonth(),0);
            var monthStart = tempDate.getDay();
            
            // shift day numbering
            var start = new Date(d.getFullYear(),d.getMonth(),1);
            var end = new Date(d.getFullYear(),d.getMonth()+1,1);
            var daysInMonth = (end-start)/(1000*60*60*24);
                        
            //cleanup td's
            for (var c = 1;c<43;c++){
                document.getElementById('td'+ c).innerHTML='';
            }
            
            // fill in td's
            for (var i = 1;i<daysInMonth+1;i++){ 
                 document.getElementById('td'+...