Learn to style your Foundation site with Sass and Compass.
- [Voiceover] Hi, I'm Jen Kramer, welcome to foundation, incorporating Sass and Compass. In this course, I'll show you how to work with Sass and add custom styling to your foundation website. We'll start by configuring your computer with the software you'll need to work with Sass including Ruby, Sass, Compass and the foundation gem. Next, we'll download foundation Sass files and explore their structure. We'll work with the underscore settings .scss which provides lots of control of variables to change colors, fonts spacing and more in your foundation site.
Finally, we'll look at the wide and wonderful side of foundation including functions, math, mix ins, extending styles and much more to create some very cool effects. So if you're ready, let's get started with foundation, incorporating Sass and Compass.
- Installing Ruby, Sass, Compass, and the Foundation gem
- Starting a new project
- Compiling Sass files
- Changing variables with _settings.scss
- Working with Google Fonts and Sass
- Styling the nav bar
- Adjusting spacing between elements
- Styling panel links
- Creating a custom button with mixins