Skip to content
Submitted 24 days ago

Responsive Blog Card with Scss and fluid typography

Sergio Eduardo Castro Ceballos•300
@SergioCasCeb
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Blog preview card
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

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

As a very simple challenge there is not much to talk about, but it was a nice reminder how fluid typography can spare you the work of adding media queries for responsiveness.

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

None.

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

Honestly I don't want any help in specific, but I am more than happy to improve my approach if there is any feedback. :D

Community feedback

  • Kellen James•120
    @KellenkjamesPosted 22 days ago

    Hi @SergioCasCeb,

    I think you did a great job with this project, especially setting up a scalable and modular codebase.

    The code demonstrates a good start in using BEM principles. However, there's room for improvement in consistently applying the methodology.

    For example, the class .card-tags could be renamed to .blog-card__content__tags to better reflect its hierarchical relationship within the .blog-card block. This would improve code readability and maintainability.

    Consider applying similar adjustments to other classes like .card-date, .card-title, etc., to ensure a consistent BEM structure throughout the component.

    Here's an article which goes into more detail on best practices for BEM: https://getbem.com/introduction/

    Hope this feedback helps and keep up the great work!

    Marked as helpful
    0

Please log in to post a comment

Log in with GitHub

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