Leverage the Sass preprocessing to empower your CSS practices and master styling complex applications. Mike will show you how styles can be modularized and reused -- avoiding repetition and redundancy, while keeping everything readable and maintainable.
Overview
Syllabus
- Introduction
- CSS Pitfalls
- Preprocesser Benefits
- Course Agenda
- Syntax, Nesting, & Selectors
- Challenge 1: Parental Selectors
- Challenge 1: Solution
- Challenge 2: Parental Selectors 2
- Challenge 2: Solution
- Sass @import and Variables
- Challenge 3: Imports and Variables
- Challenge 3: Solution
- Sass Mixins and Arguments
- Challenge 4: Mixins
- Challenge 4: Solution
- Default Argument Values
- Challenge 5: Mixins 2
- Challenge 5: Solutions
- Introducing Sass Functions
- Challenge 6: Color Functions
- Challenge 6: Solutions
- @if Sass Directive
- Challenge 7: Control Flow
- Challenge 7: Solution
- Data Structures
- Challenge 8: Nudging Classes
- Challenge 8: Solution
- BEM Introduction
- Challenge 9: BEM Buttons
- Challenge 9: Solution
- Reusing Style with Mixins
- Challenge 10: @extend
- Challenge 10: Solution
- Writing Sass Functions
- Challenge 11: Relative Luminance in Sass
- Challenge 11: Solution
- Wrapping Up
Taught by
Mike North
