Stats preview card component | PostCSS

Community feedback

• 

  Vikram Ingleshwar•280

  @vikramviPosted over 2 years ago

  Thanks for sharing your project, it looks simply amazing.

  I've looked into the GH repo and have below doubts, please clarify

  1. What's the reference for this structure of css ? components directly and breaking down into individual components Usually all the styling is done in single file style.css

  Please clarify your philosophy behind this practice ?

  2. I didn't understand below in page.css &__main { &__footer {

  are inside .page class, how does that work ? Any reference please

  3. What's this particular naming convention ? page__main, card__container etc

  1

  ---

  

  Anna•1,070

  @annaindistressPosted over 2 years ago

  @vikramvi Hello, thanks for the feedback!

  I'm using the BEM methodology in which each component has its own style file.

  This is not correct CSS, but similar to how we split styles for components in SCSS.

  To build a working version I'm using the Gulp task "styles", in which PostCSS assembles from different components a common CSS file.

  You can see on the gh-pages branch how it looks after the build.

  0

  

  Vikram Ingleshwar•280

  @vikramviPosted over 2 years ago

  @annaindistress Thanks for detailed reply.

  Is it necessary to use SCSS, PostCSS, Gulp etc along with BEM methodology ?

  I'm currently using only plain CSS and would like to try out BEM

  0

  

  Anna•1,070

  @annaindistressPosted over 2 years ago

  @vikramvi You don't have to. You can use BEM in the regular CSS as well. It will look something like this:

  .block { ... }
  
  .block__element { ... }
  

  0

  

  Vikram Ingleshwar•280

  @vikramviPosted over 2 years ago

  @annaindistress Thanks for quick clarification, do you use any "BEM validator" to make sure you're following BEM properly and to catch any mistakes ?

  0

  

  Anna•1,070

  @annaindistressPosted over 2 years ago

  @vikramvi No, I just check myself with the specs and articles if I have doubts

  0

  

  Vikram Ingleshwar•280

  @vikramviPosted over 2 years ago

  @annaindistress Thanks for updates, I have pinged you over slack FM channel; please check and reply back.

  0