Search for a command to run...
Articles tagged with #scss
A lot of the time in designs they give the font-size, line-height and letter-spacing in px. Which isn't helpful as they mean having to get the calculator out to convert them to more useful units. But a combination of Sass functions and mixins can do ...
A while ago I made some fireworks using HTML Canvas. But then I wondered if you could make them without the Canvas. Turns out, the answer is yes. Set up The good news is that for the HTML we don't need anything! We'll use the body for the background ...
The thing that inspired this was Kevin Powell doing some CSS art (with SCSS) that included stars. I wondered how to do it. I initially wanted to see how it was done without looking - I knew from Twitter that he'd used Sass math, but that was it. But ...
Last post I talked about what code splitting was and how you'd do it, and gave an example with CSS. This post I'm going to talk about how to do it in SCSS. We're going to stick with our simple website that has three sections: header, main, footer. An...
Loops are an exciting part of SCSS - it's like you're writing JavaScript in your CSS. But I never had a chance to use them, until recently. The problem I had three cards beside each other and I wanted each one to be a bit lower than the one on the ri...
On the surface, both of these do the same thing. These will both set the background to red. SCSS: body { $red: #ff0000; background: $red; } CSS: body { --red: #ff0000; background: var(--red); } But they are different. There's a CSS Tricks ex...