Jay Khatri• 40
@khatri2002
Submitted
Camryn Tidsworth
@CamrynTidsworth
All comments
- Camryn Tidsworth• 60
@CamrynTidsworth
Posted
Good job! The project looks similar to the design aside from some differing colors. The code is well structured and readable, especially the CSS.
Two suggestions:
-
There is room here to incorperate more descriptive HTML tags that will make the code more SEO friendly and accessible. For example, you could use tags like <ol> or <ul> for lists, and <table> for the nutrition table.
-
It may speed up your CSS process to start using custom properties for repeating colors. This can be done by using the var() function to set specific color values that you can then reference instead of writing out the entire hsl value every time.
0 -
- Aram Hagen• 60
@AramHagen
Submitted
Camryn Tidsworth• 60@CamrynTidsworth
Posted
The fade color change on the button hover state is really cool! The only thing I would suggest is using the <button> tag instead of <li> in the HTML.
0 - Joe• 30
@YoussefGaafar
Submitted
What challenges did you encounter, and how did you overcome them?
The black border behind the card is a bit tricky, by the look of it it seems to be easily implemented by border-shadow, but it will not work. So to implement this black box you need to use ::before (Pseudo Element).
Camryn Tidsworth• 60@CamrynTidsworth
Posted
The HTML makes use of alt descriptions which is good for accessibility. Accessiblity could be improved even more by including semantic HTML tags like <article>, <footer>, etc. in place of some of the <div> tags. The box-shadow on the main container looks great! It looks like you may be working with active states I'm not familiar with for the border, but if you want a simple static border all the way around like the design shows, you can simply add a border to the container in CSS.
Marked as helpful
1 - zadi• 10
@peck2285
Submitted
What are you most proud of, and what would you do differently next time?
A travers ce projet j'ai appris sur flexbox comment utilisé
What challenges did you encounter, and how did you overcome them?
j'ai pas rencontré de défie pour ce projet
What specific areas of your project would you like help with?
aucun
Camryn Tidsworth• 60@CamrynTidsworth
Posted
Looks good!
0
