Watch videos with subtitles in your language, upload your videos, create your own subtitles! Click here to learn more on "how to Dotsub"

Introduction to the Sass and Compass Series

0 (0 Likes / 0 Dislikes)
[Drupalize.Me: Learn Drupal] [♪ music ♪] [Introduction to the Series Learning Sass and Compass, Chapter 1] [with Kyle Hofmeyer and Addison Berry] In this series, we're going to be covering CSS preprocessors. Mainly we're going to be covering Sass, and along with Sass, we're going to be covering Compass, because they pretty much go hand in hand. We're doing this series—It's really not necessarily Drupal specific, but a lot of themes are starting to embed and build on Sass and Compass inside them. It's also just a really good thing to have in your arsenal of skills, especially if you do front-end design work. Now, CSS preprocessors are not a new thing. But they're kind of what I would call the new kid on the block. So, this series we're going to be covering them, we're going to dive into them and start to understand the basics of them. This is kind of a beginner series, but we really wanted to get you started learning Sass and Compass. >>Before we dive into actually working with Sass, first we want to give some context. So we're going to be looking at what exactly is a CSS preprocessor, what is Sass and how does that relate, and we're also going to compare Sass with another very popular CSS preprocessor that's out there today, called LESS, just so that you have some sense of what the differences are and what the real features are. And then we're going to wrap up our context by figuring out how Compass fits in with all of these concepts. >>Yes, so not only are we going to learn what a CSS preprocessor is, why Sass, Sass versus LESS, but we're also going to start to dive into the terminology of Sass. And we're going to start learning things like mixins and variables and functions, nesting, and what you can do with those things. We're also going to start and learn how Compass works along with Sass. Now Sass itself is a standalone that you can use. Compass requires Sass and basically just enhances Sass. I don't really see a reason at this point not to use Compass if you're using Sass. But we're also going to start learning the terminology and some other stuff that we're going to do with those. >>So after we have Sass pretty well figured out and nailed down, we're going to turn our attention to Compass. Make sure you have configured properly and your config.rb file. Look at how you can use some commands with Compass. And then we're going to start to play around with just a couple of the Compass mixins, so you can get a sense of what Compass is offering you, versus what Sass was giving you. To wrap everything up, we're going to go ahead and take a look at how you can extend beyond what we've covered in just the Sass and Compass basics. So we'll be looking at other libraries that you can use with Sass. There are many libraries aside from Compass. So we'll take a quick tour of what those are and how you might want to use those. And then we'll also look at just some other tools out there, other pieces of software that use Sass or other ways that you can make yourself more efficient when working with Sass on your next project. So, let's go ahead and get started. [Drupalize.me: Learn Drupal]

Video Details

Duration: 3 minutes
Country: United States
Language: English
License: All rights reserved
Genre: None
Views: 45
Posted by: drupalizeme on May 20, 2013

Sass is a very popular CSS preprocessor, which makes managing your CSS much easier, as well as providing a wealth of powerful tools to let you do more with your CSS. Compass is the de facto tool used in conjunction with Sass to extend the Sass library and provide you with a very robust set of CSS tools. In this brief introduction, we explain what we will be covering in this series, from terminology to additional libraries.

Caption and Translate

    Sign In/Register for Dotsub to translate this video.