Watch for upcoming native CSS features

[chrisblakley]

A few features to watch for that will occur natively in CSS rather than needing a preprocessor like Sass:

Custom Selectors:

https://cssdb.org/#custom-selectors

@custom-selector :--heading h1, h2, h3, h4, h5, h6;
article :--heading + p {}

Nesting:

https://cssdb.org/#nesting-rules

article {
  & p {
    color: #333;
  }
}

system-ui Font Family:

https://caniuse.com/font-family-system-ui https://cssdb.org/#system-ui-font-family

body {
  font-family: system-ui;
}

I really like this site to track the stages of upcoming CSS features: https://cssdb.org/

[chrisblakley]

The system-ui font family can start to be considered at this point: https://caniuse.com/font-family-system-ui

[chrisblakley]

In the future, I may split this into individual issues.

[chrisblakley]

Nesting on caniuse.com: https://caniuse.com/css-nesting

[chrisblakley]

Scroll timeline: https://caniuse.com/css-scroll-timeline

[chrisblakley]

Closing this as I've split it into individual issues.