Responsive Time Tracking Dashboard with React and Sass
Solution retrospective
If I could ask something about it, since it's my first solo project with React, surely I would like to know if I wrote everything properly or if there's anything out of the ordinary going on with my code xD
Please log in to post a comment
Log in with GitHubCommunity feedback
- @grace-snow
Hi
This looks nice and functions pretty well on a touch device.
However, you've fallen into a really common issue with this challenge - people often don't understand the base ui pattern it's using, which is a tab interface. That means you have some significant issues here with accessibility because this needs to be 3 tab buttons, then 3 tab panels, each containing all the cards. Clicking on a different tab button in the tab list switches the panels, undating relevant attributes and moving focus as needed.
It's worth taking some time to look up how to make tabbed interfaces accessible - there's good info on inclusive components if you want to look it up.
Luckily because this is built with React I think all that would be relatively simple to fix.
One other accessibility issue I notice - the alt on the person's image is not a description of that image. It should at least be the person's name
I hope this gives you some ideas and is helpful. Good luck
Marked as helpful - @melwynt
Great job with the design and React!
I was curious about the 3 dots on each card but it doesn't do anything, does it?
Cheers!
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