korosu• 60
@korosu
Submitted
P
Sean Langley
@slangley
All comments
- PSean Langley• 50
@slangley
Posted
I like what you've done here. It looks good!
A couple things. I'd suggest trying to do layouts like this with as little hard coding of sizes as possible. Using relative sizing where possible helps make the implementation more future proof for different sizes of screens.
A good example of this is your smaller breakpoints. With relative sizing, it would be easier to get the design looking good when you are at 320px wide (try using Chrome Devtools in responsive mode) to look at the widths as you drag back and forth.
A couple tiny nitpicky things, the font on the large price doesn't match with the bold heading. And when on small screens, there is still a large border on left and right which compresses the content alot.
0 - Kit• 60
@keithfrancisb
Submitted
PSean Langley• 50@slangley
Posted
Looks really good!
0 - Olaniyi-Fatola• 30
@Olaniyi-Fatola
Submitted
What are you most proud of, and what would you do differently next time?
Doing this project has made me understand a lot about Tailwind CSS as it's the first project that I'm using it with, and it's really interesting.
What challenges did you encounter, and how did you overcome them?
The first challenge I encountered when doing this project was the configuration of Tailwind CSS as I configured it using node js. I thought a one-time configuration would suffice all the code I'll be writing not knowing that I'll have to do that on every new code folder. I was able to solve it by doing some research on how I can use it without the occasional configuration which is somehow stressful, so I copied the folder that I'd configured before and pasted it into the new folder I used for this project.
Secondly, I was not able to get the correct colors used in the project as the style. readme wasn't precise enough and I had to use similar colors that I believe are closest to the project given.
What specific areas of your project would you like help with?
I'd like help with the tailwind styling that I did, as I believe I still need lots of practice for me to master it well. Also, I'd love to ask if Tailwind CSS be the best to use as a beginner or continue with the native CSS.
PSean Langley• 50@slangley
Posted
I was a bit frustrated with the colors on this one too. They didn't quite match the design.
Regarding Tailwind vs CSS. I've started with Tailwind as well. From what I understand you still need to know CSS concepts to use it. ie how the box model works, how grid, and flex work. Tailwind just makes it easier to apply to your layouts without having collisions.
0 - Nguyễn Duy Hùng• 450
@banhmisg9509
Submitted
PSean Langley• 50@slangley
Posted
Looks great! I really like the attention to detail on this one. You are really close to the original design.
I like how you put the hover and focus modes on the main text. Love it.
0 - Stefan Mohenski• 30
@stefanelli990
Submitted
What are you most proud of, and what would you do differently next time?
I'm most proud of how I used Tailwind CSS to quickly build a clean and responsive layout. The design matches the challenge's specifications, and I was able to ensure that the component looks great on various screen sizes. This project demonstrated the power of utility-first CSS in accelerating my workflow and improving my overall productivity.
PSean Langley• 50@slangley
Posted
Looks great to me! I like how you used straight HTML with this.
1
