Skip to content
OverviewSolutions
7
Comments
7
achallett
@achallett

All comments

  • achallett•160
    @achallettPosted 3 months ago

    Incredible!

    Looking at the css, I might recommend against the -- on class names:

    E.g. "testimonial --daniel" -> "testimonial testimonial--daniel"

    0
  • achallett•160
    @achallettPosted 3 months ago

    Looks good - have a look at linear gradients for the top section of the card:

    e.g. background: linear-gradient(0deg, var(--color-secondary-light-gray) 98.5%, var(--color-primary-cyan) 3%);

    0
  • achallett•160
    @achallettPosted 3 months ago

    Looks good; but here are a few pointers;

    • Design for mobile first, then add the adaptation for desktop - this makes it more performant.
    • Maybe use a flex box in the card, so the image is 1 child item, and the card content is the other - it's easier to set it to 50% then.
    • The desktop image currently overflows on your site, if you make the image 50% as per point above, and lock the aspect ratio it should not overflow
    Marked as helpful
    0
  • achallett•160
    @achallettPosted 3 months ago

    Look to understand margins and paddings and how they interact with each other.

    Design is looking great, but just need to sort out.

    Link to code doesn't work.

    0
  • achallett•160
    @achallettPosted 3 months ago

    Great - just need to update the text color and adjust the font size!

    Marked as helpful
    0
  • achallett•160
    @achallettPosted 3 months ago

    Great work - looks pretty close.

    Worth just looking at the font-size, and the hover should render a pointer

    Marked as helpful
    0
  • Lord-Zethes•140
    @Lord-ZethesSubmitted 3 months ago
    What are you most proud of, and what would you do differently next time?

    This is my first time using HTML and CSS. Just happy i was able to make it look like the preview.

    not have any inline css in my html

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

    Figuring out how to get the qr code inside the rectangle and then round the corners. then formatting the font

    HTML CSS

    1
    achallett•160
    @achallettPosted 3 months ago

    Great work!

    The design is pretty much there - there is a small miscalculation with the sizing and padding, but easy to fix.

    One thing that it might be worth changing is the class name around gray text - its generally not a great idea to have a color in the class name, because what if the gray text is no longer gray

    Marked as helpful
    1