Skip to content
OverviewSolutions
9
Comments
8
glowri57
@glowri57

All comments

  • glowri57•130
    @glowri57Posted about 2 months ago

    Hi @Thomas-Ngo-1

    Here's what I noticed:

    • font-weight have values 100, 200, 300...900, you don't need to add px
    • add some space at the bottom of your paragraph
    • the paragraph should have color Slate 500
    • Since you styled the class .slate-300 and the rest, the property should be defined in your HTML file. Here's an example:
    <span class="slate-500">...</span>

    Then the color assigned to slate-500 would be styled on the span tag.

    • The background-color: in those color classes should be changed to color: You're trying to define the color of the text, not the background-color of the text.

    I hope you find this helpful!

    0
  • CptnRedbeard•40
    @CptnRedbeardSubmitted about 2 months ago
    What are you most proud of, and what would you do differently next time?

    I was able to make an example similar to the original but it didn't adjust correctly when the window was resized. I'd try to find a solution without watching a video next time.

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

    In my original file, when you resized the window everything would get squished because I was using percentages. I was able to follow along with a video explaining pixels, rem, and padding that helped out a lot.

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

    How do you decide when to use pixels, rem, or percentages?

    QR-Code-Component

    3
    glowri57•130
    @glowri57Posted about 2 months ago

    Hi @CptnRedbeard

    To answer your question, you should use px when dealing with properties that you want to remain fixed in value no matter the viewport. you can use px with properties like: border, border-radius, etc.

    rem and percentages are relative values.

    rem is used with properties like font-size, margin, padding, @mediaquery min-width and max-width values.

    percentages are mostly used in width, height, min-width, max-width, min-height and max-height properties. They are relative to the width or height of the webpage. Check this article to understand more. Why font size must NEVER be in pixels

    I hope you found this helpful!

    0
  • glowri57•130
    @glowri57Posted about 2 months ago

    Your GitHub repo is not visible. You probably set it to private. It would help if you changed it to public so that others could view your code and give feedback.

    0
  • glowri57•130
    @glowri57Posted about 2 months ago

    This is a wonderful piece of work. You could use the <s> for the old price.

    Marked as helpful
    0
  • glowri57•130
    @glowri57Posted 2 months ago

    Hi, this is a good code. This are a few things I noticed:

    • You should avoid using px as it is an absolute unit and not a responsive unit like rem or em, You should look at this article from a Frontend mentor dev, Why font-size must NEVER be in pixels

    • Another great resource to check out is px to rem converter.

    • Try to use the fonts, font weights and colors given to you in the style guide. The essence of the project is to ensure that your work look like the design given in the design folder in this project.

    I hope you found some of this information helpful, You should give the articles a good read. Happy coding! 💻

    Marked as helpful
    0
  • glowri57•130
    @glowri57Posted 2 months ago

    Hi Ajinkya Hajere, This is good work but here are a few things I noticed:

    • You should consider that there are mobile devices with more than 375px. You can use the inspect option and click the desktop icon beside Elements to see a lot of devices and their widths. This would help you consider other devices while trying to make your website responsive. Check out this article also from a Frontend mentor dev responsive-meaning, she goes into more detail.

    • You should avoid using px as it is an absolute unit and not a responsive unit like rem or em, You should look at this article from a Frontend mentor dev, Why font-size must NEVER be in pixels

    -Another great resource to check out is px to rem converter.

    I hope you found some of this information helpful, You should give the articles a good read. Happy coding! 💻

    0
  • glowri57•130
    @glowri57Posted 2 months ago

    Hi Minagamingotaku52

    This is a good work you should be proud of, here's a few things I noticed:

    • It is best practice to use margin-inline: auto; to center left and right then than just margin: auto; You can center the height by using this code snippet:
      min-height: 100svh;
 display: flex;
 justify-content: center;
 flex-direction: column;`

    • Your code couldn't display as a live page. You could try to re-deploy on netlify, vercel or github pages.

    • You should rewrite your readme template using the guidelines given to you. The README is there to guide people going through your project and give them an understanding of what you did in your project.

    • Try to use the fonts, font weights and colors given to you in the style guide. The essence of the project is to ensure that your work look like the design given in the design folder in this project.

    I hope you found some of this information helpful, Happy coding! 💻

    0
  • glowri57•130
    @glowri57Posted 2 months ago

    To avoid repetition, you could learn to express your margin and padding with two values instead of four. Other than that, this is a wonderful work.

    1