baoagency/polaris_view_components

Polaris v12 styles

kirillplatonov opened this issue ยท 6 comments

Based on suggestions in #352 we're going to add support for v12 styling on v11 markup. Upgrade to new styles will be done by adding Polaris-Summer-Editions-2023 class on html tag. During installation we'll enable this tag by default, but it should be still possible to stay on the old v11 styling. The target version for these changes is v1.5. No breaking changes is expected in this release. #352 PR will kickoff the upgrade.

TODOs

Exciting!

@forsbergplustwo let's use this issue to keep track of the upgrade progress

@kirillplatonov - Great! I've created branch v1.5-develop and merged the original #352 PR to it. That way we can base other PRs off that branch, making dev easier before a release. Ok with you?

@forsbergplustwo yeah, sounds good. The only suggestion is to rename v1.5-develop branch to polaris-v12 since v1.5 may include other changes not related to Polaris upgrade.

I've now gone through every component and made adjustments for what I could see needed changing. The CSS isn't super clean, but Shopify uses !important in their own Summer-Editions-2023 overrides, so they cannot be avoided.

A couple of notes:

  1. Button: outline option no longer exists in Polaris. I've set it to render a normal button instead, but open to better fallbacks. Usually I would have used these in Page footer for destructive actions, so falling back to normal destructive button would be correct there.
  2. SettingsToggle: is deprecated and quite far from being up to date, so I haven't spent the time upgrading it.

Before merging this I'll try it out on our apps for a while in development, as I'm sure there are minor things needing taking care of. Will report back how it goes. Would appreciate others doing the same and posting PRs or Issues for anything found ๐Ÿ˜Š

Incredible job with the update! ๐Ÿ‘

The plan sounds good! Let's test this out with real apps and release v2.0 once we're confident.