This is a solution to the Time tracking dashboard challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.
Users should be able to:
-
View the optimal layout for the site f0r laptop view(1350px) and mobile view(375px)
-
Switch between viewing Daily, Weekly, and Monthly stats
- Solution URL: Code Git hub
- Live Site URL: Time Tracking Challenge Frontend Mentor
- Semantic HTML5 markup
- CSS custom properties
- Flexbox
- CSS Grid
- JS
I Learned a couple of things about CSS
- Be careful with giving z-index to elements as it caused troubles on selecting the child elements
- How to utilise json file in plain JS.
MY JS code i feel definitely needs some improvement, i will think of ways to utilise event propagation to make my code follow DRY Principle.For now it works but i'll definitely try to refactor the JS Code to make it more efficient and scalable
- Css tricks flex box - This helped me gente reminder of css flex box's properties.
- CSS tricks grid - THis helped me with gentle reminder of CSS grid;s properties.
- Stack overflow- - THis helped me with ways to utilise JSON file in JS along with discussion with my friend Vinit.
- Website - Ajay
- Frontend Mentor - AjayBAins
- Twitter - AjaygetBusy
I'd like to thank you my friend Vinitk for guding me about different ways to utilise json file in a JS file. I'd also like to thank Stackoverflow and CSS tricks and MDN Docs for refreshment of concepts.