Skip to content
OverviewSolutions
2
Comments
7
Patolin3084
@Patolin3084

All comments

  • Patolin3084•20
    @Patolin3084Submitted 3 months ago
    What are you most proud of, and what would you do differently next time?

    I've learned a lot more about how to sort elements with flexbox, but I still need a lot of practice with this. I need a lot of help to make my designs responsive, it is still a problem for me. I have managed to get the hover to work but not the focus, I'm not sure I'm using it correctly.

    What challenges did you encounter, and how did you overcome them?

    I didn't remember how to use hover and I went over this looking for information. I also had problems adding the fonts on my computer, so I decided to do it through the link.

    What specific areas of your project would you like help with?

    I can help beginners who have problems with flex.

    blog-preview-card-main with hover and focus

    3
    Patolin3084•20
    @Patolin3084Posted 2 months ago

    Thank you very much for the link, very interesting and complete!

    0
  • Patolin3084•20
    @Patolin3084Posted 2 months ago

    Oh! I've never seen that it could be done like that. Thank you very much for your reply!

    0
  • Patolin3084•20
    @Patolin3084Posted 3 months ago

    Hello! Your code was very easy to read and understand, and I think it meets all the requirements of the exercise. Congratulations! There is only one thing I don't understand because I'm a newbie: @font-face { font-family: 'FigtreeSemiBold'; src: url('../fonts/static/Figtree-SemiBold.ttf'); }

    @font-face { font-family: 'FigtreeExtraBold'; src: url('../fonts/static/Figtree-ExtraBold.ttf'); }

    @font-face { font-family: 'FigtreeRegular'; src: url('../fonts/Figtree-VariableFont_wght.ttf'); }

    I don't really know what this code is doing. I would really appreciate it if you could give me a little explanation. Thanks!

    0
  • MwapeDoreen•30
    @Doreen2002Submitted 3 months ago
    What are you most proud of, and what would you do differently next time?

    The degree of accuracy to the Figma design, I think I tried

    What challenges did you encounter, and how did you overcome them?

    Centering the div with QR code and content, I managed using justify-content and align-items with value center.

    What specific areas of your project would you like help with?

    Improve accuracy of designs without using figma

    REsponse qr code site using flex box

    2
    Patolin3084•20
    @Patolin3084Posted 3 months ago

    The result you achievent is almost perfect, congratulations!

    0
  • Patolin3084•20
    @Patolin3084Posted 3 months ago

    Hi! Good effort but there are some details missing, such as centering the text, which you could do with text-align for example, and adding a background color to contrast with the card. Good luck and happy learning!

    0
  • Patolin3084•20
    @Patolin3084Posted 3 months ago

    Hi! These suggestions were made to me at work and I found them very useful: HTML:

    Add a <main> element to wrap all of your content except the <header> and <footer>. This improves accessibility and acts as a landmark for your webpage. Make sure to include your card within the <main> element.

Consider changing your <p class="para1"> tag to an <h2> tag. Typically, a page should only have one <h1> tag for the main heading. Since this challenge doesn’t include a main heading, it would be appropriate to use an <h2> tag instead.

    I hope they serve you too.

    0
  • aniketinTech•30
    @aniketinTechSubmitted 3 months ago
    What are you most proud of, and what would you do differently next time?

    What am I proud of and what I would do differently next time:

    1. The code is easy to understand and follows a logical structure.
    2. Closely matching the design specifications.
    3. Ensuring the component looks good on different screen sizes.
    What challenges did you encounter, and how did you overcome them?

    Challenges encountered:

    1. Matching Design Precisely: Challenge: Ensuring the component matched the provided design down to the smallest detail. Solution: Used design tool Figma(since this is Free+) and browser inspection to measure elements and fine-tune CSS properties.
    What specific areas of your project would you like help with?
    1. Ensuring the component looks good on different screen sizes.
    2. How to use media query?

    QR Code Component | Flexbox | HTML | CSS

    2
    Patolin3084•20
    @Patolin3084Posted 3 months ago

    It has turned out almost perfect, it is a little too wide and that is why the distribution of the words in the text is not correct. It is likely that correcting the width and text justification value can be resolved.

    0