Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Responsive Blog Preview Card with SASS

P
Ashley 80

@AshlavaDev

Desktop design screenshot for the Blog preview card coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


What are you most proud of, and what would you do differently next time?

I am proud of the whole card and how it turned out. I am specifically proud of how responsive it is with only small alterations to code. I would maybe use a library, or even experiment with a component library card to achieve the same effect.

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

I encountered no real challenges, the biggest thing was looking at the optional challenge of not using media queries. The solution was to google the problem and experiment a little with the function I found.

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

There is no area I need help with, I feel.

Community feedback

@DanCodeCraft

Posted

Hey @AshlavaDev, Congrats on the result!

It's very close to the proposed image. If I may add:

  • Add some line height to have better spacing and hierarchy.
  • The hovering effect could use some transition properties to make it smooth. It has tenths of options, but in this very case you can have only 2 of them and it will work like a charm
  • The font size for the main text is a bit smaller.

Keep up the good work!

Marked as helpful

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord