Skip to content

Instantly share code, notes, and snippets.

@CHEWX
Created April 1, 2015 10:46
Show Gist options
  • Save CHEWX/55450d70f19981cd28e6 to your computer and use it in GitHub Desktop.
Save CHEWX/55450d70f19981cd28e6 to your computer and use it in GitHub Desktop.
Selector Hierarchy
.selector {
// extend is the very first incase you wish to overwrite
@extend %overlay;
// alphabetical order of rules
text-align: right;
// z-index in increments of 5
z-index: 5;
// includes next whether this be media query of include
@include mobile-first(400px) {
}
// pseudo-classes
&:after {
}
&:before {
}
// modifier classes
&--modifier {
}
.touch & {
}
// grouped child elements in order of markup-ish
// E.G, li will follow ul
ul {
}
li {
}
p {
}
// finish off with classes
.child-class {
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment