Skip to content

add Callout component#10309

Merged
brad-decker merged 1 commit intodevelopfrom
add-callout-component
Feb 2, 2021
Merged

add Callout component#10309
brad-decker merged 1 commit intodevelopfrom
add-callout-component

Conversation

@brad-decker
Copy link
Copy Markdown
Contributor

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

Rationale

The new add-ethereum-chain request UI designs have a redesigned alert component for gaining the user's attention. I've dubbed this component the 'Callout' because it could stand its own as just information with significance. Passing a 'dismiss' function to the Callout renders a dismissible Callout that acts as a sort of an alert. A close button is rendered (x), and clicking that button animates the Callout opacity. It's up to the parent component to not render a dismissed Callout.

Examples

Non dismissible callout
Single dismissible callout
Multiple dismissible callouts
Animation

@brad-decker brad-decker requested a review from a team as a code owner January 28, 2021 20:41
@brad-decker brad-decker requested review from danjm and removed request for a team January 28, 2021 20:41
@brad-decker brad-decker force-pushed the add-callout-component branch from 690dedc to a6b6014 Compare January 28, 2021 20:43
@brad-decker brad-decker changed the title add inverted info icon, and update props add Callout component Jan 28, 2021
@brad-decker brad-decker marked this pull request as draft January 28, 2021 20:47
@metamaskbot
Copy link
Copy Markdown
Collaborator

Builds ready [a6b6014]
Page Load Metrics (905 ± 73 ms)
PlatformPageMetricMin (ms)Max (ms)Average (ms)StandardDeviation (ms)MarginOfError (ms)
ChromeHomefirstPaintNaNNaNNaNNaNNaN
domContentLoaded553113889914770
load555120090515273
domInteractive552113889914770

Base automatically changed from add-inverted-info-icon to develop February 1, 2021 18:10
@brad-decker brad-decker force-pushed the add-callout-component branch from a6b6014 to 85e1c5d Compare February 1, 2021 18:11
@metamaskbot
Copy link
Copy Markdown
Collaborator

Builds ready [85e1c5d]
Page Load Metrics (572 ± 46 ms)
PlatformPageMetricMin (ms)Max (ms)Average (ms)StandardDeviation (ms)MarginOfError (ms)
ChromeHomefirstPaint448758105
domContentLoaded3257445709646
load3277455729746
domInteractive3257445709646

@brad-decker brad-decker marked this pull request as ready for review February 1, 2021 18:34
@brad-decker brad-decker requested a review from rekmarks February 1, 2021 18:34
Copy link
Copy Markdown
Contributor

@danjm danjm 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 12161bb into develop Feb 2, 2021
@brad-decker brad-decker deleted the add-callout-component branch February 2, 2021 15:21
@github-actions github-actions bot locked and limited conversation to collaborators Feb 2, 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.

4 participants