FYI: Polymer now uses native CSS custom properties

[Tim Sergeant]

I'm currently landing a CL (https://codereview.chromium.org/2252633002/) to enable native CSS custom properties on Polymer pages. This will cause a couple of immediately noticeable changes:

1. Everything will get slightly faster to load. MD History improves by 4%, other pages should improve a similar amount
2. Devtools will show the actual variables instead of their resolved values: 

Other than that, hopefully everything will Just Work, but keep an eye on your Polymer pages for minor CSS changes just in case.

[Michael Giuffrida]

FYI, you can always inspect the value of custom properties on particular elements getComputedStyle, which, like any CSS property, takes into account cascading rules, inheritance, etc.

getComputedStyle(myDiv).getPropertyValue('--some-color') " blue"

Note the unwieldy names in Tim's example -- that's the result of Polymer's @apply shim for mixins, which we still use, switching to native custom properties.

--
You received this message because you are subscribed to the Google Groups "Chromium-Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email to chromium-polym...@chromium.org.
To post to this group, send email to chromium...@chromium.org.
To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/chromium-polymer/CAHxk7iBDf2x846F0ja%2B7V9iCUB8SabzsrjEvg%2BD_rGMdLT0iww%40mail.gmail.com.

[Samuel Li]

Devtools computed styles pane should also show all resolved custom properties values.

To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/chromium-polymer/CACi5S_201LEj9xZ%3DrA6%3D1fTsdvYDu2N4bM-3LL6CD54djodhFw%40mail.gmail.com.