Lessons: 16Length: 2.6 hours
- Overview
- Transcript
6.2 Create a "Golden" Layout
The ancient Greeks discovered that a single value named the Golden Ratio had a way of repeatedly popping in things we considered visually beautiful. In this lesson you’ll learn how to easily incorporate this “divine proportion” into your layouts using Stylus variables.
1.Introduction
1.1CSS Needs a Hero01:17
1.1
CSS Needs a Hero
01:17
2.Stylus Superhero Basic Training
2.1Quick and Easy Setup09:19
2.1
Quick and Easy Setup
09:19
2.2Terse or Full Syntax, Your Choice05:50
2.2
Terse or Full Syntax, Your Choice
05:50
2.3Faster Child and Pseudo Element Targeting via Nesting06:50
2.3
Faster Child and Pseudo Element Targeting via Nesting
06:50
3.A Practical Intro to Stylus Variables
3.1Create an "Easy Update Color Scheme"08:02
3.1
Create an "Easy Update Color Scheme"
08:02
3.2Create a "px to rem" Converter Variable14:35
3.2
Create a "px to rem" Converter Variable
14:35
4.Practical Intro to Mixins
4.1Create a "Zebra Stripe" Mixin12:45
4.1
Create a "Zebra Stripe" Mixin
12:45
4.2Use CSS3 Easily with Prebuilt "Nib" Mixins09:07
4.2
Use CSS3 Easily with Prebuilt "Nib" Mixins
09:07
5.Practical Intro to Logic and Functions
5.1Adjust Base Font Size, Perhaps: Using Conditionals and Operators09:38
5.1
Adjust Base Font Size, Perhaps: Using Conditionals and Operators
09:38
5.2What Functions Can Do That Mixins Can't06:16
5.2
What Functions Can Do That Mixins Can't
06:16
5.3Create a "px to rem or em" Converter Function13:55
5.3
Create a "px to rem or em" Converter Function
13:55
5.4Level Up Your Color Schemes With Stylus's Built-In Functions15:13
5.4
Level Up Your Color Schemes With Stylus's Built-In Functions
15:13
6.Stylus Superpowers
6.1Variables on the Fly: Property Lookup09:32
6.1
Variables on the Fly: Property Lookup
09:32
6.2Create a "Golden" Layout14:54
6.2
Create a "Golden" Layout
14:54
6.3Generate H-Tag Styles With a Single Line: Hashes, Iteration and Interpolation16:49
6.3
Generate H-Tag Styles With a Single Line: Hashes, Iteration and Interpolation
16:49
7.Conclusion
7.1Wrapping Up02:34
7.1
Wrapping Up
02:34
