@hadeedji
@chivicks-hazard
Submitted
What are you most proud of, and what would you do differently next time?
I'm very proud of the fact that I was able to do this within 4 hours which I hope it isn't too much.
What challenges did you encounter, and how did you overcome them?
My major issues were simply debugging the code but ChatGPT was very helpful in the whole process.
@hadeedji
Posted
It differs considerably from the design.
@DearNatthaphong
Submitted
What are you most proud of, and what would you do differently next time?
...
What challenges did you encounter, and how did you overcome them?
...
What specific areas of your project would you like help with?
About the alignment of list-display of ul tag. It's not in the middle vertical. Please review my code.
@hadeedji
Posted
Good job on completing the project!
Immediately you can notice that the fonts are incorrect, this is because when specifying arbitrary font values using tailwind, replace spaces with _. So the font-['Young_Serif'] class will fix the fonts issues.
Having said that, I would not recommend this approach, your fonts should be specified in your tailwindconfig. And I would not recommend using tailwind from a CDN either, learn how to use the tailwind cli, or vite or some similar solution.
Your list displays are almost correct. A left margin and left padding on the list items should help get it looking like how it does on the designs.
Marked as helpful
@hadeedji
Posted
Good job.
You can define all your typographic styles in tailwind config, that can include line height, font weight, font size and font family. You don't need to set font family in css file, you can set default font family in tailwind config.
I don't like how you've handled card width, you don't need to do anything complicated for this challenge. A simple w-full max-w-sm should be enough on your card
Marked as helpful
@aapa1993
Submitted
@hadeedji
Posted
Excellent work using tailwind css. Some of the padding numbers are different. You can customize your scales with tailwind config, do look into that. Really well made otherwise
@alimassidik210
Submitted
What are you most proud of, and what would you do differently next time?
"I am proud to have created a clear README.md file. Moving forward, I will create clear README.md files in my future projects."
What challenges did you encounter, and how did you overcome them?
"I feel challenged to create a README.md file, something I have ignored until now. To complete it, I used ChatGPT."
What specific areas of your project would you like help with?
"In the future, I will use SASS to make styling my web projects easier."
@hadeedji
Posted
Great job!
I noticed on small screen widths that card is right up against the edge of the screen, some margins would help. And on small screen heights, the background color isn't applying. Using min-height: 100vh on your container class should help.
