Is Sass Dead Yet? CSS Mixins and Functions
summary
CSS now prototypes author-defined functions and mixins in Chrome: functions are callable like variables, accept parameters with defaults, can contain conditions (media, prefers-color-scheme) and return a single declarative result, but cannot use !important and disallow container queries in their conditionals; mixins literally expand where applied, currently expose all internal declarations (no private scope) and still crash or lack parameters in browsers; claim: these features reduce some Sass use but do not replace Sass features like loops and data structures.
AI-written summary · about
chapters (32)
- 0:00Introduction
- 1:05CSS evolution
- 3:31Role of abstractions
- 6:24CSS mixins and functions
- 8:10Feedback and CSSWG process
- 8:30CSS functions syntax
- 13:59Declarative vs imperative
- 15:43Functions with conditions
- 17:55Mixins syntax and limits
- 20:07Gradient text with @supports
- 21:57Mixins vs functions
- 23:00Inline conditions with if()
- 25:29Custom properties
- 27:14Lexical vs DOM scoping
- 30:29Value resolution
- 34:06Invalid values and fallbacks
- 37:15Cascade and importance
- 39:21Functions in cascade
- 40:04Mixins for design tokens
- 41:29Parameterized variables
- 43:15Custom properties inheritance
- 44:37Inheritance rules
- 45:19Initial values
- 47:07Guaranteed invalid values
- 48:09Typing in CSS
- 49:12Functions passing keywords
- 50:38Complex CSS demos
- 51:40Conditional border radius
- 52:43AI color palettes
- 53:04Performance and mixins
- 54:06Is Sass dead?
- 54:50Q&A
