search

uiowa / uids

UI Design System
http://uids.brand.uiowa.edu
7 stars 1 forks source link

Implement container queries polyfill library #722

Open pyrello opened 2 years ago

pyrello commented 2 years ago

Motivation

We would like to eventually use query containers to be the basis of determining text scaling for components at different container widths. It seems possible that we could even get away from using media queries as everything would always be in a container, even if the container was the same width as the device width. This would allow for us to simplify the logic of how we set sizes of things and do it in a way that is consistent whether we are talking about one column on a mobile device or 3 columns on a desktop.

The polyfill library: https://github.com/GoogleChromeLabs/container-query-polyfill

Proposed solution

Add polyfill library to UIDS 4.x.

pyrello commented 2 years ago

There is currently a bug with the polyfill library that seems to be fixed by the PR: https://github.com/GoogleChromeLabs/container-query-polyfill/pull/33. However, there has not been much movement in getting that PR merged. In the meantime, if we end up pulling in this work, we can just add the PR branch as the library instead, tagged to the last commit.