Ayakhaled0197• 180
@Ayakhaled0197
Submitted
tylerhyndman484
@tylerhyndman484
All comments
- tylerhyndman484• 100
@tylerhyndman484
Posted
Hello!
You have the right idea here but a couple of things I can suggest to improve:
- Need to add some spacing at the top of page above the title text
- Add some spacing below the sub "Powered by Technology" text
- Add a little more spacing below the "Our artificial" text
- The cards need to have more padding around the top, left and right side
- The cards need to have less padding on the bottom of the cards underneath the image
- The cards need to be smaller but fixing a lot of the issues about and below should help with that
- The text needs to be bigger in general across the board. Start with the 15px baseline and then increase everything else accordingly that seems to need to be bigger
The gap on the grid and the layout look great though! Nice job on that!
I hope this helps! Let me know if you have any questions!
0 - Papi• 230
@Papi84
Submitted
What are you most proud of, and what would you do differently next time?
having reached here it an honor and i planning to learn even more.
What challenges did you encounter, and how did you overcome them?
deployment was hard but i am getting used to it.
What specific areas of your project would you like help with?
i am still learning but git & github are my main challenge now.
tylerhyndman484• 100@tylerhyndman484
Posted
Very good work here. Your code looks great semantically and I can tell you took great care in making sure you used the correct tags for what was needed.
I liked your use of data attributes to include the shopping cart svg. You also had great mind to make the strike through price available to be written by a screen reader.
I like your use of css variables to make the code cleaner and easier to scale!
Well done!
Marked as helpful
0 - DemoStephen• 360
@DemoStephen
Submitted
tylerhyndman484• 100@tylerhyndman484
Posted
I think you are on the right track! I would focus on your line spacing as I see there could be some opportunities to increase it to better match the design. As well as setting your body and html elements to a height of 100% so the background and span across the whole page. But its looking good!
0 - PMAGENE Sem Joel• 300
@Jomagene
Submitted
What are you most proud of, and what would you do differently next time?
I'm most proud of integrating custom fonts using @font-face and maintaining a responsive layout through a mobile-first approach. Next time, I’d explore CSS Grid for more complex layouts and focus more on performance optimization, like using font-display: swap and serving fonts in WOFF2 format for faster load times.
What challenges did you encounter, and how did you overcome them?
A significant challenge was creating a responsive design that adapts seamlessly across different screen sizes without overusing media querries. I used Flexbox for layout management, which allowed me to center elements both horizontally and vertically with the my custom classes .flex and .flex-center. Additionally, I employed a media query to adjust the width of the list of links on larger screens, ensuring a consistent and balanced layout.
What specific areas of your project would you like help with?
Any suggestions for enhancing the code organisation and accessibility, would be appreciated.
tylerhyndman484• 100@tylerhyndman484
Posted
Looks very close to the design! Very well done! I did notice though that the font for the name of Jessica Randall looks a little different than the one in the design; but very nice work!
Marked as helpful
0 - Ak120399• 60
@Ak120399
Submitted
tylerhyndman484• 100@tylerhyndman484
Posted
I like the idea of switching up the background color, however, I would have picked a color that was more aligned with the color of the img. I would also check the padding on the category section as i don't believe its as consistent as need.
You nailed the layout though! Good Job!
0 @lucvs07
Submitted
tylerhyndman484• 100@tylerhyndman484
Posted
Nice work!
1
