Sass: The @extend Directive

Have you ever wanted one selector to inherit the styles of another? Maybe you have a .button class for standard buttons across the site and now you want to create a larger button that should be styled the same as the rest of your buttons, except it should be larger.

Continue reading

Sass: Directory Structures That Help You Maintain Your Code

As projects grows larger, the need to modularize directory and file structure increases. This is particularly true if you want to create code that can be used in other projects, in components and patterns across one or more projects, or in templates you share with others.

Continue reading

Sass: The @import Directive

One way to writer DRYer code is to separate concerns and keep related code in separate files. This allows you to maintain code in one file as opposed to maintaining the same code over several or many files.

Continue reading

Sass: The @media Directive

One of the cornerstones of responsive design is the media query. The @media directive provides a mechanism for serving different styles to different devices with different characteristics. Sass both supports and extends the @media rule.

Continue reading

Sass: @-Rules and Directives

While CSS isn’t a programming language, it includes some programming-like features. For example @-rules provide a simple control mechanism for running one block of code instead of another. Sass as you would guess extends these rules and provides a few of its own.

Continue reading