hngprojects / hng_boilerplate_nextjs

https://deployment.nextjs.boilerplate.hng.tech
Apache License 2.0
205 stars 264 forks source link

[FIX] [FE: ANCHOR] Adjust Position of Loading Spinner in Stripe Checkout #1212

Open Tearsmith0 opened 3 weeks ago

Tearsmith0 commented 3 weeks ago

Description

Description:

When the "Confirm Order" button is clicked during Stripe checkout, the loading spinner is too close to the "Processing" text. This creates a visually unappealing and unclear user interface. We need to adjust the positioning of the loading spinner so that it maintains a proper distance from the "Processing" text to improve readability and aesthetics.

Acceptance Criteria

Acceptance Criteria:

  1. The loading spinner should be positioned at least 10 pixels away from the "Processing" text.
  2. The spacing between the spinner and the text should be consistent across different screen sizes and resolutions.
  3. The spinner and "Processing" text should be properly centered vertically within the button.
  4. The adjustment should be tested and verified in all major browsers (Chrome, Firefox, Safari, Edge) to ensure consistency.
  5. The changes should be reviewed and approved by the design team before merging.

Links

| FIGMA LINK

Images

image

Feng-09 commented 3 weeks ago

I will work on this