Introduction

• What is Sass anyway?

• What software do you need?

• VS Code

• The Community

The Setup

• A note before we get started

• Installing Sass with Sass live compiler

• Sass compilers for other text editors

• Using Sass live compiler and live server

• Sass live compiler and live server settings

• A couple of other very useful VS Code Extensions

• CSS output style options

• What are source maps?

• Other command line alternatives (free and premium options)

• Sass vs SCSS - two different ways of writting Sass

• CSS vs Sass comments

Nesting

• Nesting selectors

• SCSS vs Sass nesting

• Nesting and the ampersand (&)

• Nesting properties

• Time for a challenge!

• nesting-challenge-starting-files.zip

• solution.scss

Variables

• What are variables?

• Variable inception (variables inside variables)

• Variables and the cascade

• Naming variables

• It's challenge time!

• Variable Challenge Starting Files

• variable-challenge-solution.scss

Operators

• Introduction to Operators

• Operators - a use case

Building out a pricing table

• Pricing Table - Intro

• Pricing Table Starting Files

• Google font @import

• Writing the markup

• Setting up the variables

• Styling it up

• Pricing Table finished version

Extends

• An introduction to Extends

• Placeholders

• Don't forget about the other stuff you can do

• Problems with extends - 1

• Problems with extends - 2

Mixins basics

• Introduction to Mixins

• Selectors inside mixins

• Mixin arguments - part one

• Mixin arguments part two - optional arguments

• Mixin arguments part three - more ways to work faster

• Mixin arguments part four - keeping things in the right order

• Mixin Challenge - Introduction

• LearnSass - mixin challenge.pdf

• Mixin Challenge - Starting Files

Introduction to functions

• Introduction to Functions

• Some of my favourite Sass functions

Building an e-commerce card

• card-starting-files.zip

• The Markup

• Getting Sass set up and running

• Settin' up the variables

• Creating the mixins

• Styling the typography

• Styling the buttons

• Finishing touches

• my-finished-files.zip

Partials and file organization

• Quick note

• Introduction to partials

• Order matters when importing your partials

• The 7-1 system and what I actually use (file organization)

Closing thoughts

• I hope you enjoyed the course, plus a few other things

• Future Updates