@SuperMustard
@Yaqoob1410
Submitted
What are you most proud of, and what would you do differently next time?
Completing this to make it as accurate to the design as possible
What challenges did you encounter, and how did you overcome them?
making the image responsive, I overcame it using max-width(100%) for the img element.
What specific areas of your project would you like help with?
making the project responsive to mobile phones and other devices
@SuperMustard
Posted
For the instruction part, you can use list-style-position: inside; to put the number inside the block.
You can consider using a flex-box other than the original <ul> or <ol> cause the design needs lots of custom styles. For example, the gap between bullets and text.
@SuperMustard
Submitted
What are you most proud of, and what would you do differently next time?
I find a way to set gaps between li and remove the first gap.
What challenges did you encounter, and how did you overcome them?
I want to use ul and li instead of div and flexbox. I want to add gaps between li, but I can't remove the first gap at the beginning. Then I found out how to use li:firstchildren to remove the first gap. I also find a way to change the color inside a . I can use li:hover a or I can set the color in to inherit.
What specific areas of your project would you like help with?
how to remove warnings in frontend mentor?
@SuperMustard
Posted
Thank you for your advice!
@Alex-Archer-I
Submitted
What are you most proud of, and what would you do differently next time?
It was quite easy, so I just pleased to finish another project.
What challenges did you encounter, and how did you overcome them?
I often use flex gap for creating space between elements, but in those design space between paragraphs was smaller that between the rest tags. So I ended up using negative margins.
What specific areas of your project would you like help with?
Nothing special for this challenge, but I always up for advises, criticism, comments, small talks and deep conversations.
@SuperMustard
Posted
Pretty Good implementation! I should learn how you organize your CSS file.
@MaxOleynik
Submitted
What are you most proud of, and what would you do differently next time?
1
What challenges did you encounter, and how did you overcome them?
1
What specific areas of your project would you like help with?
1
@SuperMustard
Posted
good implement
@omk1r
Submitted
What are you most proud of, and what would you do differently next time?
I'm most proud of the clean and responsive design achieved for the QR code component. It effectively communicates the message and provides a visually appealing experience for users.
Next time, I would focus on improving accessibility features. This could involve ensuring proper contrast ratios for text elements, adding ARIA attributes for screen readers, and conducting thorough testing across different assistive technologies. Accessibility is crucial for ensuring inclusivity and reaching a wider audience, so it's an area I would prioritize in future projects.
What challenges did you encounter, and how did you overcome them?
Integrating the QR code image posed a challenge as I needed to ensure it was properly sized and displayed without distortion. I addressed this challenge by using CSS to set the image width to 100% of its container, ensuring it scaled proportionally across different screen sizes while maintaining its aspect ratio.
Overall, these challenges were overcome through a combination of experimentation, testing, and leveraging CSS techniques to create a responsive and visually appealing QR code component.
What specific areas of your project would you like help with?
I would appreciate feedback on the accessibility of my project. Specifically, I'm interested in suggestions for improving accessibility features such as ensuring proper contrast ratios for text elements, adding ARIA attributes for screen readers, and any other techniques that could enhance the accessibility of the QR code component. Additionally, any insights or tips on conducting thorough accessibility testing across different assistive technologies would be helpful.
@SuperMustard
Posted
The solution is smaller than the design, and the text color is not the same as the solution.
Marked as helpful
