Skip to content

Instantly share code, notes, and snippets.

Avatar

Mark Otto mdo

View GitHub Profile
@mdo
mdo / scss-tests.scss
Last active Aug 29, 2015
You can create the same set of components with HTML and (S)CSS in a handful of ways. Here's how the same set of buttons looks with base and modifier classes, as well as extends and placeholders. The goal is to measure the output—the total number of selectors and declarations. Personally, I consider fewest selectors to be more optimal (for you an…
View scss-tests.scss
// Original
//
// Markup:
//
// <button class="button">Button</button>
// <button class="button button-primary">Button</button>
// <button class="button button-danger">Button</button>
//
// Total selectors: 6
// Total declarations: 19