 Instead of, because we've seen some fairly advanced topics and things. Actually, I should just mirror my screen, because otherwise I won't be able to see what I'm doing. But not everyone has been doing this forever. So, each time we have a meetup, we'll basically color some basic element of CSS, or in this case, SAS. My screen's now crazy. So, I'm just going to do an intro to SAS, basically. As you can see from the text, SAS does rock. Less than SAS are kind of competing with each other a bit. SAS, I think, is winning, maybe. Go SAS. I'll show you a few times. Then there are other things like post-CSS, which lets you do all sorts of crazy things, which is kind of the same, but not quite. SAS is fairly well documented. So, if you're curious about diving into something other than basic CSS, SAS is probably the way to go at the moment. I'll just explain a couple of the features. This is meant to be five minutes long, but I haven't timed it or prepped it properly soon. Just to give you an idea of how it works. So, I've got a really basic HTML structure here. It really doesn't do all that much. I've got a header section, paragraph list, nothing really major. Using boring old CSS, so variables, actually. Let's go through this in order. I've got my paragraph and my list item colored right here. Now, ordinarily, if I need to change the color because the designer said, hey, red's probably not so great as a text color, then I'd have to go through and change each one like that. This is easy because I've got two, but imagine you've got a massive CSS file here to go through each and every one. If I have variables, I can just grab the variable and drop that in there instead. Now, if I want to change the primary color, I can just go and edit my one spot in the SAS, and I'm done. That basically sells SAS on its own for me. CSS variables are coming in as a standard, but to adopt them until they've got 100% adoption, it's basically impossible to put them into your projects. That's really difficult, but this alone is really good. The other thing that you get by naming things is it's easy to understand what's going on. Here, I've got primary, secondary, tertiary color according to what they actually mean. When you're going into your code, it's like, well, I need this thing to have whatever color you can just refer to and it makes it a whole lot easier to understand what's going on. Obviously, here, I've just got colors on the variables, but you might put your video query breakpoints, font stacks, anything else that might be relevant to you. If you're putting it in there more than months, then it should be a variable, basically. Nesting. Nesting is really awesome. I'm going to color my section. Except I've broken my code now. Here, I've got my section. I've got different things inside. This is how you'd normally write it in CSS. When you go sass, everything is nicer. I already know I'm in the section to save a lot of trouble like this. This is basically the equivalent. You've got to be really careful with nesting, regardless of which programming language you're using. If you contribute to the Linux core and use more than three levels of nesting, and then a storevolta probably can't shoot you or something, not that I'm suggesting he's prone to violence, probably quite the opposite. I don't know the man. But nesting is something to be careful of. If you're using namespacing along the lines of BEM, then you're probably not going to nest all that much anyway. But when you do, this is pretty handy to be careful about how you use it. Partials. Partials, according to the SAS spec, are one of the most important. Actually, no, I don't think. Partials. It's basically an import like this. With the projects that I'm working on right now in my work, we have a global font size. It's got a global style resource, basically. And everything's split up. So within an individual project, you can override it in any one of these particular things. Using imports, it all basically gets thrown into the one... I can't find the code for it. Too much. Too many tabs. I'm just going to show you. So you can see how I've just basically imported all these different modules. And within an individual project, if I want all of them, that's great. If I don't say, for example, I don't have any tabs, I can just comment out this bit here. And I'm done. So that's pretty good. But instead of having to combine your CSS files or anything else like that, it doesn't include imports. Same thing, basically. Not much difference. Mix-ins. Mix-ins are basically variables of functions. You've got to be careful about using them. But it's just like anything else. When you're repeating your code, then usually you want to actually abstract it in some way. In this case, all you basically need to do, if you need to do a clear fix on something, is call this, and that code gets injected into the element that you're in. And that's fantastic. You don't have to then refer to how to do that. Actually, I've broken my code, but it's important it's nothing. So mix-ins are a really easy way of doing variables. Extensions and inheritance. Apparently this is one of the best parts of SAS. I've never used them, and I've tried to avoid them. So good luck. The last one is operators. Operators basically let you do basic maths. So you've got fixed width of 900, and you need somewhere that needs to be 900 divided by two or something like that. You could just calculate that yourself, but by putting the calculations in the SAS, it makes it really clear the logic behind what you're doing. I don't really use them very often, because it doesn't really seem to come up, but maybe I'm just really bad at it, I'm not too sure. But that's the basics of SAS. So if you're not using it, and you no longer have any excuse to try, not to try, you can go to saslame.com and they cover all the basics and everything else from there. So have a go. We're kind of short on time, because we're minus the speaker. A little bit more time, so I'm just going to chop in a talk. I don't have any slides, because I wasn't planned on speaking, but it's fine. So I'm just going to talk briefly about performance when it comes to CSS animation.