Very interesting! Can I ask, how did you implement the timer in CSS/HTML?
And also, what causes the lack of responsiveness?
And also, what causes the lack of responsiveness?
Here's the part that controls when the animation is running:
#level-none:not(:checked) ~ #ram #timer::before {
animation: timer step-end 1;
animation-duration: 999s;
animation-fill-mode: forwards;
--pause-if-won: var(--win-state) paused;
--pause-if-lost: var(--game-over) paused;
--pause-if-randommenu: var(--randommenu-visible) paused;
animation-play-state: var(--pause-if-won, var(--pause-if-lost, var(--pause-if-randommenu, running)));
}
Though the design is responsive to the width of the window, I suspect you mean how slow it is: it's 1.23MB of HTML + CSS, and clicking anything causes almost everything to redraw. It's only a little laggy on my computer but the idea was to test the limits of what's possible and is expected! :)Thank you for checking it out!