Oct 29, 2022 - Franky Jr Blondeel
Live version here I'm currently refreshing my entire JavaScript knowledge through a course on Scrimba
The assignment was to make a simple unit converter (Imperial -> Metric and vice versa)
The following were the base requirements of the assignment:
- Create the first post
- Use semantic HTML
- Add hover effects on the icons (Like, Comment, Share)
This project was really quick and easy. Conversions of units are basically small calculations. I did it as efficiently as I could; just made sure all calcs are done in one function and there's only one DOM manipulation at the end.
Since the app was pretty bright and glary, I set a stretch goal for myself: implement a light- and dark-mode function. It started with the design of some button using only HTML and CSS I found on youtube. Really found a lot of interesting stuff on pseudo-classes I didn't know nothing about.
On top of that, I extended the stretch goal by implementing a function that reads the system's setting of light or darkmode. I still don't think I fully understand how it works 😂 But it's a step in the right direction, it was a blast when it worked.
When you change the theme, it is saved to LocalStorage, so your preference is kept ^^
Ah, and I added Fahrenheit conversion too, cause I needed that one the most haha.
In essence, this was not too complex to do. However, I was able to challenge myself and add a couple of interesting additional features.