I would like to know if there was a better way to structure my HTML code, and if any header level would be used for the first sentence used in the QR-code component.
Also, I used CSS Variables and tried my best in styling the component, but I feel there always could be better. Are there any guides or rules to follow that I've missed in my approach to style the HTML elements? Could they be less verbose, if applicable?
I'm proud of the work I did to get the preferred outcome.
What challenges did you encounter, and how did you overcome them?I encountered challenges with CSS Flexbox but a couple of video tutorials helped me.
What specific areas of your project would you like help with?CSS Flexbox.
Great job on doing the project and submitting it, but there are few comments that you need to take care of.
You need to use Semantic HTML for accessibility (e.g, Use <main> tag for main content, or role attribute with value "main"), so the content is contained in one landmark region.
The image corners need to be rounded according to the design.
Your second paragraph needs to be aligned with the first paragraph. When you spot the differences between the two paragraphs, you would find that the second paragraph is exceeding the first paragraph horizontally.
The second paragraph's font-size should be 15px not 16px.
In your HTML code, you could have linked the img using the relative path instead of the absolute path (much easier and way cleaner).
The base.css file have a general well known naming convention, which is style.css. The project is small enough, that it doesn't require you to change your naming convention.
Generally, Your code is readable and well structured. You did a great job in using CSS Variables.
