m/metamask-extension
1
0
Fork 0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-11-22 09:57:02 +01:00
Code

UX: Multichain: Make MetaFox logo more accessible (#19395)

Browse Source 
* UX: Multichain: Make MetaFox logo more accessible

* Fix jest snapshots
This commit is contained in:
David Walsh 2023-06-02 11:43:20 -05:00 committed by GitHub
parent 9195057136
commit 931b126831
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 21 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
ui/components/multichain/app-header/__snapshots__/app-header.test.js.snap
View File

@ -29,8 +29,8 @@ exports[`App Header should match snapshot 1`] = `
/>
</button>
</div>
<div
class="app-header__logo-container app-header__logo-container--clickable"
<button
class="box app-header__logo-container app-header__logo-container--clickable box--flex-direction-row box--background-color-transparent"
data-testid="app-header-logo"
>
<svg
@ -220,7 +220,7 @@ exports[`App Header should match snapshot 1`] = `
class="app-header__metafox-logo--icon"
src="./images/logo/metamask-fox.svg"
/>
</div>
</button>
</div>
</div>
</div>

18
ui/components/ui/metafox-logo/__snapshots__/metafox-logo.component.test.js.snap
View File

@ -2,8 +2,8 @@
exports[`MetaFoxLogo does match snapshot with custodyImgSrc 1`] = `
<div>
<div
class="app-header__logo-container"
<button
class="box app-header__logo-container box--flex-direction-row box--background-color-transparent"
data-testid="app-header-logo"
>
<div />
@ -21,14 +21,14 @@ exports[`MetaFoxLogo does match snapshot with custodyImgSrc 1`] = `
src="/test"
width="42"
/>
</div>
</button>
</div>
`;
exports[`MetaFoxLogo does not set icon height and width when unsetIconHeight is true 1`] = `
<div>
<div
class="app-header__logo-container"
<button
class="box app-header__logo-container box--flex-direction-row box--background-color-transparent"
data-testid="app-header-logo"
>
<div />
@ -37,14 +37,14 @@ exports[`MetaFoxLogo does not set icon height and width when unsetIconHeight is
class="app-header__metafox-logo--icon"
src="./images/logo/metamask-fox.svg"
/>
</div>
</button>
</div>
`;
exports[`MetaFoxLogo should match snapshot with img width and height default set to 42 1`] = `
<div>
<div
class="app-header__logo-container"
<button
class="box app-header__logo-container box--flex-direction-row box--background-color-transparent"
data-testid="app-header-logo"
>
<div />
@ -55,6 +55,6 @@ exports[`MetaFoxLogo should match snapshot with img width and height default set
src="./images/logo/metamask-fox.svg"
width="42"
/>
</div>
</button>
</div>
`;

8
ui/components/ui/metafox-logo/metafox-logo.component.js
View File

@ -1,6 +1,8 @@
import React, { PureComponent } from 'react';
import PropTypes from 'prop-types';
import classnames from 'classnames';
import Box from '../box/box';
import { BackgroundColor } from '../../../helpers/constants/design-system';
import MetaFoxHorizontalLogo from './horizontal-logo';
export default class MetaFoxLogo extends PureComponent {
@ -88,13 +90,15 @@ export default class MetaFoxLogo extends PureComponent {
///: END:ONLY_INCLUDE_IN
return (
<div
<Box
as="button"
onClick={onClick}
className={classnames({
'app-header__logo-container': !isOnboarding,
'onboarding-app-header__logo-container': isOnboarding,
'app-header__logo-container--clickable': Boolean(onClick),
})}
backgroundColor={BackgroundColor.transparent}
data-testid="app-header-logo"
>
{renderHorizontalLogo()}
@ -115,7 +119,7 @@ export default class MetaFoxLogo extends PureComponent {
this.renderCustodyIcon(iconProps, custodyImgSrc)
///: END:ONLY_INCLUDE_IN
}
</div>
</Box>
);
}
}

6
ui/pages/onboarding-flow/onboarding-app-header/__snapshots__/onboarding-app-header.test.js.snap
View File

@ -8,8 +8,8 @@ exports[`OnboardingAppHeader should match snapshot 1`] = `
<div
class="onboarding-app-header__contents"
>
<div
class="onboarding-app-header__logo-container"
<button
class="box onboarding-app-header__logo-container box--flex-direction-row box--background-color-transparent"
data-testid="app-header-logo"
>
<svg
@ -199,7 +199,7 @@ exports[`OnboardingAppHeader should match snapshot 1`] = `
class="onboarding-app-header__metafox-logo--icon"
src="./images/logo/metamask-fox.svg"
/>
</div>
</button>
<div
class="dropdown"
>