A few days ago I saw Forebruary by Ilya Birman; a calendar that doesn’t need replacing! Naturally, I needed to figure this out, CodePen style.
I wrote the HTML in Haml. My main goal was to generate the numbers on the calendar efficiently. It took a some research, but I figured out how to use case statements. I have a feeling there is a better way to increment the numbers in each row, but I haven’t arrived at it yet.
Once I had the value for the first day of the month, I was set. August starts on a Thursday, or day of the week number 4 (remember the week starts on Monday). Now I know that, for any month that begins on a Thursday it will have the same starting position. I just needed to absolutely position the frame for each day of the week. I found the position by manually adjusting the numbers. I created if statements to compare the values to move the frame accordingly.
Next month the frame should automatically slide to capture September.