Sass and Compass Designer's Cookbook

coverpage

Sass and Compass Designer's Cookbook

Credits

About the Author

About the Reviewers

www.PacktPub.com

eBooks discount offers and more

Preface

What this book covers

What you need for this book

Who this book is for

Sections

Conventions

Reader feedback

Customer support

Chapter 1. Getting Started with Sass

Introduction

Installing Sass for command line usage

Installing Compass

Using Sass on the command line

Using the Sass interactive mode and SassScript

Using the sass-gulp plugin with Gulp

Using Sass in the browsers

Writing Sass or SCSS

Choosing your output style

Working with partials

Writing your code in a text editor

Chapter 2. Debugging Your Code

Introduction

Using CSS source maps to debug your code

Editing and debugging your Sass code in a browser

Commenting your code in the SCSS syntax

Building style guides with tdcss.js

Building style guides with the Kalei Styleguide

Using the @debug @warn and @error directives

Playing on SassMeister

Chapter 3. Variables Mixins and Functions

Introduction

Using variables

Applying operations in Sass

Declaring variables with !default

Interpolation of variables

Leveraging mixins

Writing mixins with arguments

Duplicating mixins and name collisions

Creating pure Sass functions

Chapter 4. Nested Selectors and Modular CSS

Introduction

Using nested selectors

Creating more intuitive code and making inheritance clear

Referencing parent selectors with the & sign

Using multiple & signs to refer to the parent selector more than once

Using the & operator to change the selector order

Utilizing the @extend directive

Using placeholder selectors with the @extend directive

Using the @extend directive together with the @media at-rule

Using the @extend directive with care

Emitting rules at the root of the document

Avoiding nested selectors too deeply for more modular CSS

Applying the OOCSS SMACSS and BEM methodologies

Chapter 5. Built-in Functions

Introduction

Color functions

String functions

Number functions

List functions

Map functions

Selector functions

Introspection functions

Conditional assignments

Adding custom functions to Sass

Chapter 6. Using Compass

Introduction

Extending Sass with Compass helper functions

Truncating Text with ellipses

Tuning vendor prefixes from Compass stylesheets

Adding Compass to an existing Sass project

Maintaining your applications with Compass

Using Bootstrap with Compass

Chapter 7. Cross-Browser CSS3 Mixins

Introduction

Browser support

Using vendor prefixes

Cross browser CSS3 with Compass

The Can I Use database

Applying progressive enhancement

The -prefix-free library

Mobile first strategies

Chapter 8. Advanced Sass Coding

Introduction

Using @if

Using @for

Using @each

Loops with @while

Creating a vertical rhythm for your website

Creating color contrasts automatically

Using icon fonts

Image sprites with Compass

Media queries with Breakpoint

Chapter 9. Building Layouts with Sass