search

Financial-Times / x-dash

:x::heavy_minus_sign::newspaper: shared front-end components for FT.com and the FT Apps
https://financial-times.github.io/x-dash
38 stars 6 forks source link

Apply new origami focus styling to x-follow-button #694

Closed fenglish closed 1 year ago

fenglish commented 1 year ago

x-follow-button has the same issue as n-myft-ui's follow button after origami team released new focus styling across ft.com.

The detail is in this n-myft-ui PR.

This PR is to apply the same changes in n-myft-ui to x-follow-button. We always need to update two repos (n-myft-ui & x-follow-button) when some changes in myftLozenge mixins. x-follow-button was originally created to replace all the n-myft-ui follow buttons on ft.com however we haven't done that yet. It causes some features are unsynced because we forget to update two of them.

To avoid the issue, we should use n-myft-ui's myftLozenge mixins until we move all the follow button to x-follow-button.

This PR has two parts

  1. Remove own myftLozenge mixins, change to use n-myft-ui's mixins ⚠️ Need to check no difference between own ones and n-myft-ui ones

  2. Update n-myft-ui to the latest version to apply new focus styling from o-normalise & o-buttons

1. Remove own myftLozenge mixins, change to use n-myft-ui's mixins

No big difference when I replaced the own lozenge mixins to n-myft-ui ones. Only this n-myft-ui change had been forgotten to sync to x-follow-button. aria-pressed=false aria-pressed=true
Own lozenge mixins main main-aria-pressed
n-myft-ui lozenge mixins myworking-branch my-working-branch-aria-pressed

2. Update n-myft-ui to the latest version to apply new focus styling from o-normalise & o-buttons

aria-pressed=false aria-pressed=true
New focus styling Screenshot 2023-01-30 at 16 41 27 Screenshot 2023-01-30 at 16 41 42