Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Social Media Dashboard using SCSS, CSS Grid and JS

dngtnv 190

@dngtnv

Desktop design screenshot for the Social media dashboard with theme switcher coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


It's good to have something to do in my free time. Please let me know if there is anything I can improve on.

Community feedback

@radenadri

Posted

Hello dngtnv, congratulations it's a great work! 👏🙌

The layouts and the elements are match the design, and the dark mode toggle works as well!

But i found one specific issue and one addition based on my opinion, especially in mobile (<= 425px) viewport :

  1. The top padding on social-media container are blocking the dark mode toggle, so the toggle can't be clicked. I believe the solution for this you can add margin-top to this container on mobile breakpoint, maybe 40px is enough and you good to go!

  2. Since the user id element contains image and text, i think you can use span element to wrap the elements, because span acts like a div but for inline element, and for the text you can wrap it in p tag. Because p tag mostly used for text only. 😁

Reference : https://developer.mozilla.org/en-US/docs/Web/HTML/Element/span

That's it from me, keep coding! 👏🙌

Marked as helpful

1

dngtnv 190

@dngtnv

Posted

@radenadri Wow, I've made a mistake. Thank you for sharing your advice with me.

0

Please log in to post a comment

Log in with GitHub
Discord logo

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