Smashing Conference NYC 2016
The FutureofPreprocessors
View Slide
@Roy
2 0 0 6
0607080910111213141516
0607080910111213141516Made CSSGreat Again
how aboutcss features?
0607080910111213141516CSS AnimationsProposed
0607080910111213141516CSS Animations-webkit- in Chrome
0607080910111213141516CSS Animationsin Internet Explorer
0607080910111213141516CSS Animationswithout -webkit-
0607080910111213141516CSS Animationsstill Working Draft
why so long?
Idea
Write Editor's Draft
Browsers mayexperiment withimplementing
Write Working Draft
Browsers startimplementing
CandidateRecommendation
Two correct,independentimplementations
Recommendation
Natalie approves
It's implemented
Works inall browsers
Sass gave usthe featureS weneedeD. Fast.
CSS iscatching up
calc(100% - 80px)
Custom Properties
Sass > CSSCSS > Sass
#languagedesign
@if media(...) {...}
No morepreprocessors
Variables, nesting,placeholders, extend,mixins, functions,control structures,lists/maps, math, ...
Programmingin your CSS
CSS is amachine language
Creativity >Repetition
Configuration >Search & replace
Fun > Frustration
Sass is great fornon-developers too
Don't overdo it
The following codewas copy & pastedby trained monkeys.Do not try this athome.