@seapagan
Posted
A simpler way to do the toggler is :
- Set up 2 CSS classes, eg '.theme-dark' and '.theme-light', each containing all the correct variables. Both classes should have the same variable names but different colour values.
- Apply the class for your default colour choice directly to the Body tag.
- On toggle, your Javascript only needs to swap these 2 classes!
See my CSS here and the first section of the related JS here
Marked as helpful
@aminaArif22
Posted
@seapagan if you don't mind can you please share the resources from where you are learning JS?
@seapagan
Posted
@aminaArif22, to be honest, my JS learning is not very structured! I tend to go for it and search for help when I reach a wall. Saying that, I'm also (slowly) taking a TS course on Udemy at the moment. I learn a lot from searching Youtube though.
The best advice I can give is to make projects, make projects, then make more projects π! You will learn so much more from trying to build something yourself than from following a tutorial. This was the big realisation that improved my JS overnight. When you hit an issue, Google and Stackoverflow are your friends. There is a great Slack community here and many Discord channels around the web to answer questions.
Saying that : Freecodecamp have a good list here, Scrimba is great, and they have some fun live-coding on YouTube. Also on Youtube, Web Dev Simplified has some great small JS videos (and CSS, React and more), Traversy Media, Academind, Colt Steele are more there. Don't forget MDN, which is the daddy of them all if a little dry at timesπ. javascript.com is useful, and one more at Fullstack Academy
It all comes down to how much time you are willing to put in though - coding is a skill and needs practice and stubborn perseverance.
Good luck with your coding travels! π
Marked as helpful