govuk-react / govuk-react/govuk-react
Adopt polished for styling utility functions
- Dominant language
- TypeScript
- Stars
- 458
- Forks
- 89
- PR merge metrics
- No merged PRs in 30d
Description
We're looking to adopt [Polished](https://polished.js.org/) [(docs)](https://polished.js.org/docs/) to provide styling utility functions.
This issue is here to advise of that choice, and track suggestions for how it may be used, and where it may be used in our code.
The first planned use is within the [`Button`](https://github.com/govuk-react/govuk-react/blob/master/components/button/src/index.js) component, which tracks the [govuk-frontend button](https://github.com/alphagov/govuk-frontend/blob/master/src/components/button/_button.scss). Specifically we're looking to use the [`darken`](https://polished.js.org/docs/#darken) function to create the hover and shadow colours used for the button.
govuk-frontend also supports the use of a config flag to indicating that font sizes should be [in rems](https://github.com/alphagov/govuk-frontend/blob/master/src/settings/_typography-responsive.scss) which we may look to provide some kind of equivalent support for via the use of Polished's [`rem` utility function](https://polished.js.org/docs/#rem)
Any further suggestions for how we may use Polished functions should be added as comments here.
Contributor guide
Assessment
This issue has not been assessed yet.