Skip to content

Latest commit

 

History

History
50 lines (26 loc) · 2.2 KB

README.md

File metadata and controls

50 lines (26 loc) · 2.2 KB
Raw

Frontend Mentor - Time tracking dashboard

This Repo is a study Repo, created for my solution of the Time Tracking Dashboard Challenge from Frontend Mentor.

Viewing

The project is hosted by a Github Pages domain, so you can click on the image below to see it working:

It works in mobile too!

Design preview for the Time tracking dashboard coding challenge

If you want to see my solution page in the Frontend Mentor website, you can click right here!

How it was made

This is a challenge that I've took some time to complete, more than I actually needed to do so. Several events occurred while I was developing it and this took me a lot of this time.

Requeriments

For the challenge to be accepted finished, it needs to follow some requeriments. They are:

  • View the optimal layout for the site depending on their device's screen size;
  • See hover states for all interactive elements on the page;
  • Switch between viewing Daily, Weekly, and Monthly stats.

Technologies

The technologies I've used to develop it are:

  • HTML;
  • Sass;
  • JavaScript (without any framework).

This project is a learning experience that I've used to start developing with the DOM, so furthermore I can get to use some frontend framework (like ReactJS, Vue or Angular).

Forking it

If you want to fork it and create your own project using it as a base one, be free to do it right now!

Unfortunately, I won't be accepting pull requests in this repo because it need to be an demonstration of my work only.

Compiling

In order to make the styles work, you will need to compile all the Sass files into the dist. You can make it with the compiler you want, I personally like to use the Live Sass Compiler Extension, avaliable in VSCode.

But you can try to learn about the npm compile-sass feature from NodeJS.