Skip to content
Submitted over 2 years ago

Responsive dashboard using SCSS and vanilla Javascipt with JSON

#accessibility#sass/scss#bem
Elaine•11,400
@elaineleung
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Time tracking dashboard
  • HTML
  • CSS
  • JS
2junior

Design comparison

SolutionDesign

Solution retrospective

I'd be interested to know what the others use in their HTML for the clickable/interactive components (e.g., the timeframe selectors and ellipsis) in such a dashboard component, and I wonder what's the best practice for accessibility in this case

Community feedback

  • Naleeka•470
    @NaleekaPosted over 2 years ago

    All of your solutions are pixel perfect. How do you align them so perfectly ? Do you use any Software to get widths and heights correctly ?

    1
    David•8,000
    @DavidMorgadePosted over 2 years ago

    @Naleeka she probably uses this chrome extension

    1
    Naleeka•470
    @NaleekaPosted over 2 years ago

    @DavidMorgade u r a real savior

    0
    Elaine•11,400
    @elaineleungPosted over 2 years ago

    @Naleeka I just use my eyes really! All I do is put the designs next to each other and compare them, no rocket science or black magic here 😊

    Thank you @DavidMorgade for sharing the extension, which I've heard about, but sadly I use Firefox; hopefully there's a Firefox one out there!

    1

Please log in to post a comment

Log in with GitHub

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