@DivineUgorji
Posted
Good effort and congratulations on making an effort on this challenge. Just as @jacksen has pointed out some things you could do to improve the project, I would also like to point out a few more things to assist you.
-
I noticed that you did not load the custom fonts provided for this project. The font for each project is provided in the style guide file. Use Google fonts to select the font family and font sizes of the fonts as provided in the style guide, then copy the generated script and paste it into the header of your HTML file in the project. Then copy the font family and paste it in the body of your CSS file or create a custom property for it.
-
Your project is not centered on the page, to achieve this, add the following lines of code to the body in your CSS;
body {
display: flex;
align-items: center;
justify-contents: center;
min-height: 100vh;
}
- Learn to be more semantic in naming your CSS classes and selectors. it is usually advised to name your selectors according to the context of the project you are building. This helps you in organizing the code base, and maintenance of the project in the future. For more about this, you can learn how to use BEM methodology, which is widely used in many CSS projects.
There's an overuse of pixels in your project. You need to learn how to use relative units such as rem, em, vh, percentages, etc. Relative units help in making your projects to be more responsive.
- You do not have a custom Readme page for your project on GitHub. Itβs always a good practice to have a custom Readme for your projects, using the Readme template provided as a guide. The readme page is a good way to document your project and helps with future contributions to the project.
To learn more about building responsive web pages, I'd recommend this course,conquering responsive layouts course by Kevin Powel.. This course would help you to understand more about building responsive web pages in less than no time. I hope these few suggestions help you along as you continue to learn, build, and grow.
Once again, nice effort π, Happy coding!π