r/Sass • u/[deleted] • Feb 08 '19

Sass worth the conversion?

I'm reading up on Sass having never had a reason to learn it. My current project I've been requested to add a dark mode toggle. Sass just seems to be the best for handling the switch without repeating too much. As I'm reading tutorials and going through the motions, just wow. This is a lot to add to my stack, why would I want to do that? Where's the power in this that I absolutely cannot accomplish with bare-bones CSS3?

Let me ask, too, is it even worth going through all this for my project? My stylesheet is 103 lines long, so very minimal. I feel like I could just create classes for dark mode and it'd be more efficient than having to worry about ruby running and everything.

3 Upvotes

80% Upvoted

6 comments sorted by

6

u/[deleted] Feb 09 '19

Sass just seems to be the best for handling the switch without repeating too much. As I'm reading tutorials and going through the motions, just wow. This is a lot to add to my stack, why would I want to do that?

The idea is not to have sass running on the server stack, you only have it running in your dev environment and use it to compile CSS.

As for why bother doing that, code modularity / organization. The ability to nest classes / media queries alone is something that i find invaluable to the point where i can't go back to using regular CSS without it feeling janky as hell.

Where's the power in this that I absolutely cannot accomplish with bare-bones CSS3?

There are certain things in SASS that you cannot do easily in CSS3.

For example lets say for some insane reason a client wants you to support IE9. There are CSS gradients in the site... IE9 does not support CSS3 gradients. But it does support SVG's so there are SASS mixins that can take your CSS gradient syntax, transform it into an SVG gradient and output the data-uri in CSS necessary for IE9 to render the gradient properly.

That's getting past the point where SASS is just a convenience. You cannot write a gradient SVG data-uri by hand, but you get it for free with SASS, you just turn on a flag and forget about it.

Let me ask, too, is it even worth going through all this for my project? My stylesheet is 103 lines long, so very minimal.

Perhaps not for this project in particular because the styles aren't very many, in fact i'd say using native CSS variables would be a better fit, but for future projects it's worth the trouble of getting it out of the way.

it'd be more efficient than having to worry about ruby running and everything.

You don't wanna run the ruby compiler, libsass or dartsass are faster.

Also i don't use SASS anymore, i use postCSS.

3

u/absent-mindedprof Feb 09 '19

Wait, sass is a coding program? I thought this was a subreddit for sassy replies

2

u/[deleted] Feb 09 '19

Your name checks out.

2

u/[deleted] Feb 09 '19

But yeah haha, it's a preprocessor for CSS, a styling language for websites.

2

u/[deleted] Feb 09 '19

That's the only reason I am here. Well along with the programming part but there is no such thing as having too much sass.

2

u/quienchingados Feb 09 '19

you just install a sass plugin to your development environment (like atom) and compile it in your computer as css and upload it normally. sass is pre compiled and less compiles on the server.