Github-tracker - efstasia#17
Conversation
katiewu1
left a comment
katiewu1
left a comment
There was a problem hiding this comment.
Nice responsive web page! 🤩 Met all the blue level requirements ✅ Your page is very clean and pretty. Your code is also very clean and easy to follow!
I'm a huge fan of comments so it made it easier for me to follow the code 👍 Great job! 👏 🎉
| ## The problem | ||
|
|
||
| Describe how you approached to problem, and what tools and techniques you used to solve it. How did you plan? What technologies did you use? If you had more time, what would be next? | ||
| I had a problem with knowing how to start writing the JavaScript. I took a look at last week's project (project-weather-app) and used that as a guide for the API fetch. |
| const ctx = document.getElementById("chart").getContext("2d"); | ||
|
|
||
| //"Draw" the chart here 👇 | ||
| Chart.defaults.font.size = 16; |
There was a problem hiding this comment.
Nice! Looks more easier to change the font size here (I put it inside the datasets... 😅 )
| </head> | ||
| <body> | ||
| <header> | ||
| <button class="toggleBtn" onclick="myFunction()">Toggle dark mode</button> |
| <script src="./chart.js"></script> | ||
| </body> | ||
| </html> No newline at end of file | ||
| <section class="grid-container"> |
There was a problem hiding this comment.
Maybe use a more descriptive class name for the section?
| `; | ||
| }); | ||
| }; | ||
| profile(); // invoking the profile function |
There was a problem hiding this comment.
Really like all the explaining comments, easy to follow! 💯
| text-align: center; | ||
| } | ||
| /* variables to style the dark mode, add these in another variable in dark mode and add those to the selectors */ | ||
| :root { |
There was a problem hiding this comment.
Great idea with root! So much easier to try change colors and so on 😃
| margin: auto; | ||
| } | ||
|
|
||
| fieldset { |
There was a problem hiding this comment.
Like the fieldset, seems quite easy to create (maybe I can try this out for the next project) ⭐
| } | ||
|
|
||
| img { | ||
| animation: myAnim 2s ease 0s 1 normal forwards; |
There was a problem hiding this comment.
Always some kind of animation in your projects, cool! 😉
|
|
||
| .links:hover { | ||
| transition: all 1s; | ||
| background: #5f939a; |
There was a problem hiding this comment.
I've seen that you have used this color a couple of times. Maybe can try to put this color in the root and store it in a variable? 🦊
2 participants
No description provided.