RSCSS

Reasonable System for CSS Stylesheet Structure.

 

Introduction

Any CSS greater than 1000 lines will get unwieldy. You’ll eventually run into these common pitfalls:

  • “What does this class mean?”
  • “Is this class still being used?”
  • “If I make a new class green, will there be a clash?”

rscss is an attempt to make sense of all these. It is not a framework. It’s simply a set of ideas to guide your process of building maintainable CSS for any modern website or application.

 

  • Think in components, named with 2 words (.screenshot-image)
  • Components have elements, named with 1 word (.blog-post .title)
  • Name variants with a dash prefix (.shop-banner.-with-icon)
  • Components can nest
  • Remember you can extend to make things simple