feat: replace interactive elements with semantic button elements for …

[extolkom]

closes #903

You are resolving GitHub issue #903 (FE-072) on EarnQuestOne/stellar_Earn.

Task

Find all interactive non-button elements (divs, spans, li, etc. with onClick handlers) and replace them with semantic elements.

What to do

1. First, explore the codebase:

   • Search for onClick handlers attached to non-button elements (div, span, li, a, img, etc.)
   • Search for role="button" as a sign of elements pretending to be buttons
   • Check the existing component/styling patterns so replacements match the current style
   • Identify if there is a shared Button component already — prefer using it over raw

Replace non-semantic elements:

• Swap each interactive non-button element with a

or the existing Button component

Preserve all existing onClick logic, classNames, and children exactly

Remove any manual role="button", tabIndex={0}, onKeyDown workarounds that were compensating for non-semantic elements —

handles these natively

Make sure styling is preserved — buttons may need CSS reset (background: none, border: none, padding: 0, cursor: pointer) to match prior appearance if not using a shared component

Verify accessibility:

• Each button must have an accessible label (visible text, aria-label, or aria-labelledby)
• Confirm keyboard navigation (Tab, Enter, Space) works correctly after changes

Rules to avoid merge conflicts & CI issues

• Do NOT reformat files you are not directly changing
• Do NOT change unrelated logic, imports, or styling
• Match the exact code style and conventions already in the repo
• Run existing tests before and after your changes to make sure nothing breaks
• Only touch elements directly related to this issue
• Keep the diff minimal and focused

[drips-wave]

@extolkom Great news! 🎉 Based on an automated assessment of this PR, the linked Wave issue(s) no longer count against your application limits.

You can now already apply to more issues while waiting for a review of this PR. Keep up the great work! 🚀

Learn more about application limits

[RUKAYAT-CODER]

LGTM
Thank you for your contribution.