The How – Meet Sass
Lab: Part 2a – Modular CSS Using Sass – Developer’s Genesis Starter Child Theme
Video Runtime: 08:15
So now you know the benefits and how writing your styles in a modular fashion helps you to do more and make more. How are you going to do it? Native CSS doesn’t provide the means for modularity or clean, quality coding.
Meet Sass, Syntactically Awesome Stylesheets. Sass adds the powers of functionality and variables to CSS. You now write your styles in a code-based format that is clean, DRY, and modular. Let’s talk about Sass and how it will help you.
Pro Tip
When you write the acronym, notice that only the first letter is capitalized and not all of the letters. Write it as Sass and not SASS.
Once upon a time, there was a developer... You! This is going to be a good story...
Episodes
Total Lab Runtime: 02:16:49
- 1 Lab Introductionfree 02:17
- 2 The Why of Modular CSSfree 11:50
- 3 The How - Meet Sassfree 08:15
- 4 Overview of the Theme's Sass Architecturepro 08:39
- 5 Layout the Sass File Structurepro 17:14
- 6 Color Variablespro 10:11
- 7 Start Migrating the Stylesheet to Sasspro 11:43
- 8 Migrate Structure and Layoutpro 10:18
- 9 Migrate Common Classespro 04:34
- 10 Migrate Widgetspro 08:43
- 11 Migrate Pluginspro 08:12
- 12 Migrate Skip Linkspro 02:24
- 13 Migrate Site Headerpro 10:09
- 14 Migrate Site Navigationpro 07:34
- 15 Migrate Content & Sidebarspro 06:37
- 16 Migrate Site Footer & Widgetspro 03:08
- 17 Handling Media Queriespro 05:01
- 18 Wrap it Upfree 00:00
