MetaMask / MetaMask/metamask-extension

Dapp connection browser fox badge

Open
#16,362 0 comments 0 reactions 0 assignees View on GitHub
area-UI external-contributor INVALID-ISSUE-TEMPLATE type-enhancement ux-papercuts
Dominant language
TypeScript
Stars
13.2k
Forks
5.6k
Avg merge
2d 5h
Merged PRs (30d)
451

Description

## Background
We want to make it easily identifiable when an account is connected to a dapp by indicating a green dot badge on the MM browser extension fox icon. We should provide a 128x128 icon with a connection on/off option to be used during installation and by Chrome and Firefox stores. Extensions should also provide a 48x48 icon, which is used in the extensions management page (chrome://extensions). You can also specify a 16x16 icon to be used as the favicon for an extension's.

## User Story
As a user I want to see a green dot badge on the MM browser extension fox when I'm connected to a site

- The green dot should be visible when the selected account is connected with the site
- If the account is unselected or another account is active that's not connected to the site, the regular non-green dot icon should be used

## Designs
https://www.figma.com/file/aNEjTbMR6FsARVZBMbVNK4/Browser-fox-badge?node-id=0%3A84

Contributor guide

Open the contributing guide

Research direction

Start with the linked Figma design and the browser extension icon configuration for the Chrome and Firefox stores, then trace how the selected account's connection to a site is represented. Done means the green-dot fox icon appears only for a connected selected account, while other account states use the regular icon and the required 128x128, 48x48, and 16x16 assets are provided.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
frontend
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.