Bug report: social button sizing

[wackerow]

Describe the bug

The bottom of every page contains social links/icons in the Footer. Tabbing over these shows a strange shape for the outline of the buttons as a result of mixed sizing between the anchor link and contained SVG.

To reproduce

1. Go to https://ethereum.org or any subpage
2. Scroll to bottom and find GitHub/Twitter/Discord icons
3. Click just before the set of icons to move keyboard focus, then hit "Tab" to highlight one of the icons

(Or, use keyboard to tab all the way down to these elements from the top)

Expected behavior

Outline shown for the button should simply be square-shaped (with rounded corners)

Screenshots

Desktop (please complete the following information)

No response

Smartphone (please complete the following information)

No response

Additional context

We seem to be using BaseLink for these, but given there is no text, I think a more appropriate component would probably be our IconButton component. These should remain proper anchor links, but stylistically feel like buttons. Aria-label must be maintained.

Would you like to work on this issue?

• Yes
• No

[AjayiMike]

Hey @wackerow, may I be assigned this issue?