I use mobile first approach to make this project and make it responsive for all devices. HTML/CSS and JavaScript best practices are used to make this project.
If you're interested in working with me or have any questions, feel free to reach out to me via GitHub, LinkedIn, Facebook, Twitter or visit my portfolio.
But I have identified an issue in your code where the code is not working as expected. After debugging, I have determined that the code is not looping through the projects array and adding the HTML elements to the projectsContainer element. I propose you to add a method that will iterate into the projects[] array at line 81 to avoid this error :
proposed solution:
at line 81 try this: projects.map((card) => {.
We need to add this line of code back in order for the code to work correctly. ๐ง
Use more specific class names: Using more specific class names can make the code more readable and easier to understand. For example, instead of using "footer" as a class name, you could use "site-footer" or "page-footer" to provide more context.
Use consistent naming conventions: Make sure to use a consistent naming convention for class names, such as camelCase or kebab-case. This can help make your code more readable and maintainable.
Consolidate styles: Consider consolidating styles that are repeated across multiple classes. For example, the "cursor" and "padding" properties could be defined in a single class and applied to multiple elements.
Capitalized the first letter when committing.
It would be better not to use vh or vw unless there is a good reason.