Add clipboard btn hover state to checkout MR instructions

Annabel Dunstone Grayrequested to merge
checkout-modal-btn into master

What does this MR do and why?

  • Removes unnecessary styles in checkout instructions clipboard buttons
    • Add hover state
    • Align button to top of pre block
  • Removes automatic focus on copy button
  • Migrates old classes to tailwind

What does this MR not do?

We could potentially move the copy button into the code block, similar to how a copy button appears on hover (although I don't think it should be ever hidden in this scenario). For now though, this is what I'm going with.

Screenshots or screen recordings

Before After
Screenshot_2024-07-26_at_10.42.33_AM Screenshot_2024-07-26_at_10.37.38_AM

How to set up and validate locally

Project > Merge request > Code > Check out branch

Links

Edited by Annabel Dunstone Gray

Merge request reports