@LuciaVerde
@dibmarco
Submitted
What are you most proud of, and what would you do differently next time?
First ever project. I'm glad to see it opens correctly in the browser.
What challenges did you encounter, and how did you overcome them?
Always consider the box model, and using vw width is quite helpful when adjusting media queries.
@LuciaVerde
Posted
Hi mate ! first of all, congrats con completing this challenge!
I have some suggestions on your work:
I've noticed there are two index.html and two style.css files in the project. I'm not entirely sure if this duplication is intentional or not. However, to keep things organized and consistent, I believe it would be better to consolidate them into just one of each. This would help streamline the project structure and avoid any potential confusion down the line.
It would be beneficial if you could include a README file.
You might want to remove any unnecessary files, such as the provided README.
Keep going !
@pranjalipongde
Submitted
What are you most proud of, and what would you do differently next time?
Challenge was easy
What challenges did you encounter, and how did you overcome them?
Its an easy challenge
@LuciaVerde
Posted
Hi there! Congratulations on completing the challenge!
I have some suggestions that may be helpful:
Landmarks such as <header>, <nav>, <main>, <footer>, etc., are really important in terms of accessibility, SEO, and semantic organization. It would be great to add at least a <main> section to your code.
Perhaps it was intentional, but the background color of each button does not match the challenge's suggestion.
It would be beneficial if you could include a README file.
You might want to remove any unnecessary files, such as the provided README.
Keep going !
@toydala99
Submitted
What are you most proud of, and what would you do differently next time?
I'm proud that I managed to do the challenge, it helps me a lot to measure my level of knowledge and gives me more confidence when doing things and reduces impostor syndrome a little.
What challenges did you encounter, and how did you overcome them?
The challenge I encountered was creating the drop-shadow effect, but I overcame it with a simple search on w3schools
What specific areas of your project would you like help with?
I would like help when making pages accessible, what are the best practices and rules
@LuciaVerde
Posted
Hi mate ! first of all, congrats on the completion of the challenge!
Although I am a newbie, I have some comments on your work that may be helpful:
Landmarks such as <header>, <nav>, <main>, <footer>, etc., are really important in terms of, for example, accessibility, SEO and semantic organization. It would be great to add at least a <main> on your code.
I am not sure if you were able to access the Figma project for this challenge because some measurements are not consistent with the design. For example, the card itself should have a width of 24 rem. Another thing I noticed, is that the box-shadow blur is too blurry, it should be reduced to 0. I think you would like to check the assets provided one more time.
Keep going ! You got this!
Marked as helpful
@viveknagesh21
Submitted
What are you most proud of, and what would you do differently next time?
I have try different display layout for this like CSS Grid, CSS Flexbox. I will use Firefox for CSS debugging, it suits me.
What challenges did you encounter, and how did you overcome them?
I initially faced a challenge centering a QR code without a container div or flexbox/grid. I realized that using flexbox would make this task much easier. This is a common challenge when working with HTML and CSS, and flexbox is a powerful tool for overcoming it.
What specific areas of your project would you like help with?
I am happy with this method.
@LuciaVerde
Posted
Hello ! First of all... congratulations on submitting your QR code solution!
Although I am a beginner, I have two suggestions that may be helpful:
it's a good practice to use landmarks. You would probably like to wrap this card in a <main> landmark. Landmarks are structural elements that help assistive technologies and users navigate through a web page more efficiently by providing semantic meaning to different sections of the content.
It is better for font sizes to use rem instead of px. Rem provides flexibility, accessibility and consistency in web design.
I hope this is useful ! keep going !
@danilscodes
Submitted
What are you most proud of, and what would you do differently next time?
i'm glad that the challenge was not overly complicated for me
What challenges did you encounter, and how did you overcome them?
challenges:
What specific areas of your project would you like help with?
questions i have:
@LuciaVerde
Posted
I don't have much to say, I think it's a very good project. I can only suggest you to rename the css file to style.css because "index" is normally used for html file. Also, instead of using fixed values for the height and width of the .white-container consider using relative measurement units for a more responsive design. Keep going, you got this!
