Submitted almost 4 years ago

3-column-card component with SASS using the SMACSS methodology

@said-alrove

A solution to the 3-column preview card component challenge

Solution retrospective

Hi!, what's up? I had already made this challenge a few weeks ago, but I started to remade my projects (including the Frontend Mentor challenges) trying to apply new things I've learned, such as SASS (I had already known SASS, but just recently I finished of reading the documentation and practicing with it, so just now I feel confident enough to build projects with SASS).

I have to add that I used my own kinda library with mixins for SASS, such as mixins for media queries, Flexbox, and Grid.

Also, something important to mention is that I used the SMACSS methodology for structuring this project. I've already used this methodology a couple of times, but I'm still in the process of mastering it.

Feedback is always appreciated :D.

P.D. Likewise I've implemented the use of logical properties such as inline-size (width), and block-size (height) due to nowadays there's already enough browser support for them.

Code

Couldn’t fetch repository

Please log in to post a comment

Community feedback

Halí V.•230
@halivert
Posted almost 4 years ago
For your three accessibility issues:

1, 3. Document should have one main landmark

You could wrap the three cards inside a <main>
1. Page should contain a level-one heading
Sections could have an h1 level heading

Also the way you write your styles is great for modularity.

Good job 👍🏽
Ahmed Faisal•5,095
@afrussel
Posted almost 4 years ago
Hi, nice work using all latest trends technology and library. I found a issue. Your main container is not center align both horizontal and vertical. So make it center. Other then it's nice.

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