Skip to content
Submitted over 4 years ago

Social Media KPI page with switching CSS for dark mode

Richard Convery•20
@richardconvery
A solution to the Social media dashboard with theme switcher challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

Hey guys!

This is my first every Frontend Mentor challange and my first use of JavaScript within a page (just been learning JS on Codecademy up until now).

In this challenge I used JS to switch between two different CSS files. It was nice and easy for this project, however if this was a production situation then I'd look for a different solution as it'd be difficult to keep two separate css files in sync.

Any feedback on how to do that differently is more than welcome!

Richard

Code

Please log in to post a comment

Log in

Community feedback

  • Samuel Palacios•615
    @samuelpalaciosdev

    Hi, Richard👋

    Great job on this challenge. Your solution looks good and it scales pretty well👍

    I only suggest some things 😉:

    • Knows when to use paragraphs insteads ofheadings h1-h6. Headings provide valuable information by highlighting important topics and the structure of the document, you should know when to use and when not an heading tag. I'd not set the "followers" as an heading instead as a paragraph.

    • About the dark mode question. I suggest you to watch this video.

    I hope this would help you, have a nice day, keep coding!💙

  • Davide•1,705
    @Da-vi-de

    Hi Richard, great result for this changellenge. I did this project too, if you are interested you can take a look at my solution. [I did some research and i saw this video(https://www.youtube.com/watch?v=ZKXv_ZHQ654)], it helped me a lot.

    In my repo there's a comment in scss file: _base.scss where i explain what i did to make things work.

    I just want to suggest you two things:

    1. Try to separate and comment code in html, it's easier to read for others.
    2. Learning sass is very beneficial, code is cleaner and organized.

    For any questions feel free to ask. Happy coding :-)

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord