Social Media Dashboard with Theme Switcher

What are you most proud of, and what would you do differently next time?

• Using Subgrid for the Overview cards
• Creating gradient border with border-radius
• Styling theme toggle using pseudo-elements and absolute positioning
• Design System using Custom Properties
• Using the :has selector to check if body has toggle checked - if it is checked, the theme colors are changed by updating Custom Properties like --body-bg and text-color, set on the body

Next time I will write where the colors are used at the beginning - with over 20 colors in this project, it's easy to get confused!

What challenges did you encounter, and how did you overcome them?

I had to research how to create the border with linear-gradient, and how to make the border-radius apply.

What specific areas of your project would you like help with?

I'm wondering if I managed to create an accessible theme toggle. I added role="switch", as I think it should be used for toggles. I also added aria-checked with a default value of false, to tell screen readers the state of the toggle. I used JavaScript to toggle the states on click - if it's false it changes to true, otherwise it changes back to false.