Skip to content
OverviewSolutions
4
Comments
4
P
Jordan
@jdgarcia277

All comments

  • Jordan•80
    @jdgarcia277Posted 4 months ago

    Hi there!

    I liked how you separated your CSS files to make it easily readable, organized. Your html is well structured. For better semantic HTML, I would suggest using <section> elements instead of <div> to better represent the different sections of your content.

    Additionally, I noticed you preconnected to Google Fonts twice; you only need to do this once.

    Good job on your project!

    Marked as helpful
    0
  • Jordan•80
    @jdgarcia277Posted 5 months ago

    I'm not able to find your code, but the screenshot looks good and you replicated the design pretty well!

    0
  • Younes Iddahamou Idrissi•40
    @iddahadevSubmitted 5 months ago
    What are you most proud of, and what would you do differently next time?

    Things I am proud of

    • Semantic HTML (I tried my best)
    • CSS Variables where it made sense to me (I still have a lot to learn)
    • I added a transition for the box-shadow for the card and the color for the card's title
    What challenges did you encounter, and how did you overcome them?
    • Pixel Perfect -> I tried my best by relying upon the Figma File but it was not enough.
    • Units for spacing and font size: I chose px for padding and rem for the rest.
    What specific areas of your project would you like help with?

    HTML

    • Semantic
    • Accessibility

    CSS

    • Responsive
    • Which unit to choose for spacing (padding, margin, gap...)

    Blog Preview Card using CSS Variables and Flexbox

    1
    Jordan•80
    @jdgarcia277Posted 5 months ago

    I really like the way you structured your html. The comments also gave some insight to why you made the decisions you did. The aria labels are extra thoughtful for the users who need them.

    I think your css was easy to follow. I personally would choose rem units for spacing in this project. You have a root font-size that changes across mobile to desktop view. Rem units will scale and provide a uniform look and change.

    The responsiveness at smallest devices could use a little adjustment. I used google chromes dev tools. All your content is displayed, you're just losing the left and right margin. Overall this is fantastic, and I look forward to using some of your ideas in my future projects!

    Marked as helpful
    0
  • BozJR•250
    @BozJRSubmitted 5 months ago
    What are you most proud of, and what would you do differently next time?

    To be honest as its my first project im more happy that i completed it! Yes i needed help with it, Yes i had to use google and my notes from previous online courses but hey Rome was not built in a day.

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

    The challenges I encountered was remembering Flexbox and the different properties on CSS. Quick check of my notes, little bit of google and we was back on it.

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

    Just a general overview and what i could of maybe done better, what did i miss out (if anything)! All feedback is good feedback.

    Basic QR code component using simple HTML & CSS

    1
    Jordan•80
    @jdgarcia277Posted 5 months ago

    Responsive, well structured. Code is easy to follow. Good job!

    1