CSS in JS

What's wrong with CSS?

• Isolation
• Specifying & loading dependencies
• Tooling
• Dead code
• Sharing constants & 'behaviour'
• Selector precedence
• Extensibility

LESS is more

• Isolation
• Specifying & loading dependencies
• Tooling
• Dead code
• Sharing constants & 'behaviour'
• Selector precedence
• Extensibility

LESS is more

• Isolation
• Specifying & loading dependencies
• Tooling
• Dead code
• Sharing constants & 'behaviour'
• Selector precedence
• Extensibility ...sort of
• Compile step

JS is the new CSS

• Isolation
• Specifying & loading dependencies
• Tooling
• Dead code
• Sharing constants & 'behaviour'
• Selector precedence
• Extensibility

JS is the new CSS

• Isolation
• Specifying & loading dependencies
• Tooling
• Dead code
• Sharing constants & 'behaviour'
• Selector precedence
• Extensibility

TS is the new JS

• Isolation
• Specifying & loading dependencies
• Tooling*
• Dead code
• Sharing constants & 'behaviour'
• Selector precedence
• Extensibility
• Compile step

Tooling

• Interpolated templates
  • F12 on classes
  • Breaks R#'s language injection
• Exposing styles from controller
  • No more F12 (in Angular 1)
  • HTML language injection
  • Can use separate files

What else?

• Reusable styles
• Spacing / layout