Water drinking is very important for our health. This website is to track your daily water intake. The goal is 2L and each glass of water is 250ml. The big cup and the small cups both have U shape made with border-radius. The percentage and litres remaining are dynamically changing depending of how many glasses you have clicked. You can also click the forth cup for exaple and all the cups before it will be made full including the forth cup. This is made with two forEach loops comparing the indexes of all the cups and the current clicked one. If the index of the cup is lower than the current, all the cups that are not cliked will be filled till the cup that is clicked. The percentages and litres are made with simple calculations to show exactly 1/8 of the of the big cup and 250ml from 2L. The design is responsive and is made with:
Other images of the project:
.png)
.png)
.png)
.png)
.png)
Comments
Post a Comment