Skip to content

Refactor NetworkDisplay, ConnectedStatusIndicator, etc to use ColorIndicator#10214

Merged
brad-decker merged 4 commits intodevelopfrom
use-color-indicator-component
Jan 27, 2021
Merged

Refactor NetworkDisplay, ConnectedStatusIndicator, etc to use ColorIndicator#10214
brad-decker merged 4 commits intodevelopfrom
use-color-indicator-component

Conversation

@brad-decker
Copy link
Copy Markdown
Contributor

@brad-decker brad-decker commented Jan 19, 2021

Requires: #10209
Explanation: The ColorIndicator component will replace usages of small circles with various color/style treatments. This replaces the various Network Indicators, as well as the connected status indicator circle. Screenshots will be added before coming out of draft

Before






After






Known differences:

  1. On Develop, the custom network color indicator in the main header is bigger than the indicators for other networks, this is now uniform in size.
  2. On Develop, the colors for networks are different in various places, the most correct implementation was the network tab in settings. All usages of colors for networks is now the same in all places, using our palette in design syste.
  3. On Develop, the "chip" in confirmation windows is more square, it is now rounded per the chip styling.

Improved accessibility

accesibility

@brad-decker brad-decker changed the title add new typography component Refactor NetworkDisplay, ConnectedStatusIndicator, etc to use ColorIndicator Jan 19, 2021
@brad-decker brad-decker force-pushed the use-color-indicator-component branch from 8340b19 to 6603f6b Compare January 19, 2021 20:52
@brad-decker brad-decker force-pushed the add-color-indicator branch 3 times, most recently from 58e4c35 to 2a7db8d Compare January 21, 2021 17:13
@brad-decker brad-decker force-pushed the use-color-indicator-component branch from 6603f6b to b3026ff Compare January 21, 2021 18:16
Base automatically changed from add-color-indicator to develop January 22, 2021 21:45
@brad-decker brad-decker force-pushed the use-color-indicator-component branch from b39735f to fdd0f9f Compare January 22, 2021 22:43
@metamaskbot
Copy link
Copy Markdown
Collaborator

Builds ready [fdd0f9f]
Page Load Metrics (537 ± 30 ms)
PlatformPageMetricMin (ms)Max (ms)Average (ms)StandardDeviation (ms)MarginOfError (ms)
ChromeHomefirstPaint40665074
domContentLoaded3175845356230
load3185915376230
domInteractive3165845356230

@brad-decker brad-decker marked this pull request as ready for review January 22, 2021 23:02
@brad-decker brad-decker requested a review from a team as a code owner January 22, 2021 23:02
@metamaskbot
Copy link
Copy Markdown
Collaborator

Builds ready [a4adbd8]
Page Load Metrics (597 ± 56 ms)
PlatformPageMetricMin (ms)Max (ms)Average (ms)StandardDeviation (ms)MarginOfError (ms)
ChromeHomefirstPaint437656105
domContentLoaded31577359611857
load31777459711856
domInteractive31577259511856

Copy link
Copy Markdown
Contributor

@NiranjanaBinoy NiranjanaBinoy left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@brad-decker brad-decker merged commit 3806e0a into develop Jan 27, 2021
@brad-decker brad-decker deleted the use-color-indicator-component branch January 27, 2021 16:52
@github-actions github-actions bot locked and limited conversation to collaborators Jan 27, 2021
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants