A re-usable calendar class in plain javascript, NO jQuery, sadly ;-(

calendar.css

.calendar{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    box-shadow: 0 0 10px 5px #000;
    margin: 5vh 1vw;
    width: 95vw;
    justify-content: flex-start;
    align-content: center;
    justify-items: center;
}
.calendar > .day{
    border: 1px solid #000;
    padding: 5vh 5vw;
    width: 3%;
    justify-content: center;
    align-content: center;
    align-items: center;
    text-align: center;
    margin-right: 0.5vw;
    user-select: none;
}
.day:not(.current){
    background-color: rgb(202, 202, 202);
}
.day.head{
    height: 1vh;
    padding-top: 1vh;
    padding-bottom:2vh;
    padding-left: 4vw;
    padding-right: 6vw;
    margin-bottom: 0.75vh;
    justify-content: center;

    width: 3%;
    text-align: center;
}
.day:not(.head) div{
    font-size: 0.9em;
    -ms-transform: translate(4vw, -4vh); /* IE 9 */
    -webkit-transform: translate(4vw, -4vh); /* Safari */
    transform: translate(4vw, -4vh);
}

class.Calendar.js

/*
Please don't remove this information
@author = Ian Fabricatore
@website = http://ianfabs.com
@date = August 17th, 2018
*/

/*
~ @class Calendar
@param ctx = 'the ID of the div you wish to construct a calendar upon, which must have a .calendar class'
@param cb = an user-specified arrow function callback to intereact with parts of the calendar during rendering

~@var d = 'a document shortcut'
~@var ctx = 'the current calendar DOM context'
~@var $days = 'HTMLNodeList of all days in the calendar'
~@var daysOfTheWeek = 'so you don't have to type them out'
~@var date = 'current date'
~@var mnth = current month
~@var yr = current yr;
~@var firstDayofMonth = first day of the month
~@var date = redefined as the date again
~@var NumberOfDaysInMonth = number of days in a month
~@var firstDayOfWeek = first day of the week
~@var cb = callback specified in the constructor
//the functions you can guess at, its not that hard.
if you're having trouble understanding what they do, reconsider a career in js development, okay?
*/

class Calendar {
    constructor(ctx = "", cb) {
        this.d = document;
        this.ctx = this.d.querySelector(`${ctx}.calendar`);
        this.$days = this.ctx.querySelectorAll(".day:not(.head)");
        console.log("\u0040\u0041\u0055\u0054\u0048\u004F\u0052\u003D\u0049\u0041\u004E\u0046\u0041\u0042\u0053");
        this.daysOfTheWeek = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
        this.date = new Date();
        this.mth = this.date.getMonth();
        this.yr = this.date.getFullYear();
        this.firstDayOfMonth = this.mth + "/1/" + this.yr;
        this.date = new Date(this.firstDayOfMonth);
        this.numberOfDaysInMonth = this.daysInMonth(this.date);
        this.firstDayOfWeek = this.date.getDay();
        this.cb = cb;
        this.renderCalendar();
        this.cb(this);
    }
    daysInMonth(anyDateInMonth) {
        return new Date(anyDateInMonth.getYear(), anyDateInMonth.getMonth() + 1, 0).getDate();
    }
    createHeader(){
        for(let i=0;i<7;i++){
            let dayHead = this.d.createElement("div");
            dayHead.classList.add("day");
            dayHead.classList.add("head");
            dayHead.appendChild( this.d.createTextNode(this.daysOfTheWeek[i]) );
            this.ctx.appendChild(dayHead);
        }
    }
    createDays(n) {
        for (let i = -this.firstDayOfWeek; i <= n; i++) {
            let day = this.d.createElement("div");
            day.classList.add("day");
            let daySpan = this.d.createElement("div");
            if (i > 0) {
                daySpan.appendChild(this.d.createTextNode(i));
              
                day.appendChild(daySpan);
                day.classList.add("current");
            } else {
                daySpan.appendChild( this.d.createTextNode("\n") )
            }
            day.appendChild(daySpan);
            this.ctx.appendChild(day);
        }
    }
  /*
  *****This*function*was*use-case*based*****************
  ***but*I*thought*someone*might*be*able*to*use*it*******
    dayAvailable(d, avail = null) {
        let day = this.ctx.querySelectorAll(".day.current")[d - 1];
        //var on = day.classList.contains("on") && !day.classList.contains("off") ? true : false;
        //var off = day.classList.contains("off") && !day.classList.contains("on") ? true : false;
        if (avail == null) {
            day.classList.remove("on");
            day.classList.remove("off");
        } else {
            if(day.classList.contains("on") && !day.classList.contains("off")) {
                day.classList.toggle("on");day.classList.toggle("off");
            }
            else if(day.classList.contains("off") && !day.classList.contains("on")) 
            {day.classList.toggle("off");day.classList.toggle("on")}
            else if(!day.classList.contains("off") && !day.classList.contains("on")) {
                day.classList.toggle("on");
            }
            
        }
    }
    */
    clearContext() {
        while (this.ctx.firstChild) {
            this.ctx.removeChild(this.ctx.firstChild);
        }
    }
    renderCalendar(){
        this.clearContext();
        this.createHeader();
        this.createDays(this.numberOfDaysInMonth);
    }
    reRenderCalendar(month, year){
        this.mth = month;
        this.yr = year;
        this.firstDayOfMonth = this.mth + "/1/" + this.yr;
        this.date = new Date(this.firstDayOfMonth);
        this.numberOfDaysInMonth = this.daysInMonth(this.date);
        this.firstDayOfWeek = this.date.getDay();
        this.renderCalendar();
        this.cb(this);
    }
}

/*
  initialize it, with
  let calendar = new Calendar("#<id_of_your_calendar>", (c)=>{
    //a callback function where `c` is equivalent to `this` of the Calendar class
  });
  
  add your own functions with:
  ```Javascript
  class MyCal extends Calendar{
    //your code
  }
  ```
  
*/