Sass Blog

Page 2 of 9

Previous page

  • Sass and Native Nesting

    Posted 29 March 2023 by Natalie Weizenbaum

    The stable release of Chrome 112, which is releasing today, is the first stable browser to add support for the new native CSS nesting feature. This feature—inspired by Sass’s nesting—adds the ability to nest style rules in plain CSS, and even uses Sass’s convention of & to refer to the parent selector.

    We here at Sass HQ are honored every time our language design inspires improvements in CSS itself. We’re excited to see the usability and clarity benefits of nesting brought to even more CSS authors as more browsers continue to roll out support for this feature.

    The Future of Sass NestingThe Future of Sass Nesting permalink

    This raises an important question, though: what will happen to Sass’s nesting? First of all, we won’t ever change existing valid Sass code so that it starts emitting CSS that’s incompatible with widely-used browsers. This means that even if we did decide to phase out Sass nesting and just emit plain CSS nesting instead, we wouldn’t do so until 98% of…

  • Security Alert: Tar Permissions

    Posted 10 December 2022 by Natalie Weizenbaum

    The Sass team was recently alerted by prolific external contributor @ntkme to a security issue in our release process.

    TL;DRTL;DR permalink

    If you’re using Linux or Mac OS, run ls -ax path/to/sass. If the last group of letters in the first column contains w, you’re vulnerable:

    Vulnerable:
-rwxr-xrwx 1 nweiz primarygroup 407 Dec 13 12:33 sass-1.56.2/sass

Not vulnerable:
-rwxr-xr-x 1 nweiz primarygroup 407 Dec 13 12:33 sass-1.56.2/sass

    If you’re using the sass-embedded package, do the same thing for node_modules/sass-embedded/dist/lib/src/vendor/dart-sass-embedded/dart-sass-embedded.

    Who’s Affected?Who’s Affected? permalink

    While we don’t expect this issue to be a problem for the vast majority of users, it does affect the following groups:

    • Users who downloaded the stand-alone Dart Sass, Dart Sass Embedded, or Sass Migrator .tar.gz archives from the Dart Sass website and extracted them as the Unix root user.

    • Users who installed the sass-embedded npm package as the Unix root user prior to version 1.54.5.

    • Users who installed the “non-native” version of the community-maintained sass-embedded RubyGems package as the Unix root…

  • Request for Comments: Color Spaces

    Posted 21 September 2022 by Miriam Suzanne and Natalie Weizenbaum

    There’s been a lot of exciting work in the CSS color specifications lately, and as it begins to land in browsers we’ve been preparing to add support for it in Sass as well. The first and largest part of that is adding support for color spaces to Sass, which represents a huge (but largely backwards-compatible) rethinking of the way colors work.

    Historically, all colors in CSS have existed in the same color space, known as “sRGB”. Whether you represent them as a hex code, an hsl() function, or a color name, they represented the same set of visible colors you could tell a screen to display. While this is conceptually simple, there are some major downsides:

    • As monitors have improved over time, they’ve become capable of displaying more colors than can be represented in the sRGB color space.

    • sRGB, even when you’re using it via hsl(), doesn’t correspond very well with how humans perceive colors. Cyan looks noticeably lighter than purple with the same saturation and lightness values.

    • There’s…

  • Request for Comments: Strict Unary Operators

    Posted 15 June 2022 by Natalie Weizenbaum

    Do you know what margin: $a -$b does in Sass? If you said “the same thing as margin: $a (-$b), I’m sorry, but you’re wrong. It’s actually the same thing as margin: $a - $b. Don’t worry, you’re not the first person to get tripped up by this weird corner of Sass’s parser! But our new language proposal aims to fix that.

    In the Strict Unary Operators proposal, which is currently open for community feedback, we propose to first deprecate and then eventually disallow expressions of the form $a -$b. We know deprecations are never pleasant, but this should be fairly painless as they go: you can simply write $a - $b or $a (-$b), depending which you intend. We’ll also provide a Sass migrator migration to automatically update your stylesheets.

    Deprecated:

    • $a -$b will no longer be allowed, because it’s unclear what the author intended and the current behavior is likely to be incorrect.

    Still allowed:

    • $a - $b will continue to work, since it’s…

  • Embedded Sass is Live

    Posted 1 February 2022 by Natalie Weizenbaum

    After several years of planning and development, I’m excited to finally announce the stable release of Embedded Dart Sass along with its first official wrapper, the sass-embedded package available now on npm!

    Embedded Sass is an ongoing effort to make a highly-performant Sass library available to as many different languages as possible, starting with Node.js. Although Node.js already has access to the pure-JS sass package, the nature of JavaScript inherently limits how quickly this package can process large Sass files especially in asynchronous mode. We expect sass-embedded to be a major boon to developers for whom compilation speed is a concern, particularly the remaining users of node-sass for whom performance has been a major reason to avoid Dart Sass.

    The sass-embedded package fully supports the new JS API as well as the legacy API other than a few cosmetic options. You can use it as a drop-in replacement for the sass package, and it should work with all the same build plugins and libraries. Note that sass-embedded is a bit…

Next page