To avoid having to import a component framework into an otherwise static site, I did everything in vanilla HTML, CSS and JS. Feel free to build it exactly as I did it or mix and match different parts. In this tutorial, I'll explain the steps I took to build the Easter egg. Use the include rule for any customized class.
'Having dark mode would be great,' I thought. Next we’ll work on creating the toggle animation. To create a dark mode toggle button add dark mode styles to your main scss file. I forgot to dial the brightness on my screen down, which made the black text on white background particularly harsh on the eyes. One night, I was working late, migrating my old posts over. I couldn't justify that for an easter egg. Enroll My Course : Next Level CSS Animation and Hover Effects. First, we’ll implement a simple light/dark mode toggle switch. Pretty soon, it became clear that it could easily grow into a larger project then the blog itself. 908, 496 P. In this tutorial, we’ll discuss how to implement different color schemes on a website using CSS variables and one line of vanilla JavaScript. The original idea was to build a hidden game - like the T-Rex runner in Chrome. When I started redesigning my blog a few weeks ago, I decided to put an easter egg in it.