[UX]: Introduce highlighting in Explorer

[donouwens]

IMPACT

• High
• Medium
• Low

URGENCY

• Critical
• Major
• Medium
• Minor

PRODUCT ENVIRONMENT

No response

DESCRIPTION OF ISSUE

To make address recognition easier and more accessible we'll implement a small feature that brings highlighting to transaction pages, like Etherscan does (see screenshot in the activity panel on the right). Whenever a user hovers an account address the highlight shows up on it and highlights the other places where the address is shown on the page.

On mobile, this also applies when the user holds down on an address.

Please note: this new behavior still also shows the address hover on named accounts (dedicated visuals in the right-hand activity feed).

DEVICE / VIEWPORT

• Desktop
• Mobile

STEPS TO REPRODUCE

No response

ALTERNATIVES AND SUGGESTIONS

No response

[donouwens]

Designs:

[donouwens]

Desktop
https://www.figma.com/file/8dwSyYOOm3vlgbvxPGT29p/Block-Explorer-(Post-Launch)?type=design&node-id=10018%3A114295&mode=design&t=JxS8XMoHyJYMzN3Z-1

[donouwens]

Mobile design
https://www.figma.com/design/8dwSyYOOm3vlgbvxPGT29p/Block-Explorer-(Post-Launch)?node-id=6092%3A215364&t=SCWq4m5e6ocQ59ao-1

[donouwens]

Visual for behavior for named accounts
https://www.figma.com/design/8dwSyYOOm3vlgbvxPGT29p/Block-Explorer-(Post-Launch)?node-id=10059%3A90269&t=29cuQQq4EEELgodp-1