1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-10-22 11:22:43 +02:00

UX Multichain: fixed padding for edit screen (#19707)

* fixed padding for edit screen

* Use network picker for header trigger

* Fix swaps display

* updated snapshot

---------

Co-authored-by: David Walsh <davidwalsh83@gmail.com>
This commit is contained in:
Nidhi Kumari 2023-06-26 23:27:56 +05:30 committed by GitHub
parent 9a9625d96c
commit eb506a5694
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 8 additions and 7 deletions

View File

@ -200,7 +200,7 @@ exports[`App Header should match snapshot 1`] = `
</button>
</div>
<div
class="box multichain-app-header box--display-flex box--flex-direction-row box--align-items-center box--width-full box--background-color-background-alternative"
class="box multichain-app-header box--margin-bottom-4 box--display-flex box--flex-direction-row box--align-items-center box--width-full box--background-color-background-alternative"
>
<div
class="box multichain-app-header__contents multichain-app-header-shadow box--padding-2 box--padding-right-4 box--padding-left-4 box--gap-2 box--flex-direction-row box--align-items-center box--width-full box--background-color-background-default box--display-flex"

View File

@ -149,6 +149,10 @@ export const AppHeader = ({ location }) => {
});
}, [chainId, dispatch, trackEvent]);
// This is required to ensure send and confirmation screens
// look as desired
const headerBottomMargin = disableNetworkPicker ? 4 : 0;
return (
<>
{isUnlocked && !popupStatus ? (
@ -175,6 +179,7 @@ export const AppHeader = ({ location }) => {
className={classnames('multichain-app-header', {
'multichain-app-header-shadow': !isUnlocked || popupStatus,
})}
marginBottom={headerBottomMargin}
alignItems={AlignItems.center}
width={BlockSize.Full}
backgroundColor={

View File

@ -562,10 +562,7 @@ export default class Routes extends Component {
{accountDetailsAddress ? (
<AccountDetails address={accountDetailsAddress} />
) : null}
<Box
className="main-container-wrapper"
paddingTop={isUnlocked && [0, 4]}
>
<Box className="main-container-wrapper">
{isLoading ? <Loading loadingMessage={loadMessage} /> : null}
{!isLoading && isNetworkLoading ? <LoadingNetwork /> : null}
{this.renderRoutes()}

View File

@ -57,8 +57,7 @@
background: var(--color-background-default);
box-shadow: var(--shadow-size-xs) var(--color-shadow-default);
border: 1px solid var(--color-border-muted);
border-top: 0;
border-radius: 0 0 8px 8px;
border-radius: 8px;
height: 620px;
}
}