mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-11-22 09:57:02 +01: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:
parent
9a9625d96c
commit
eb506a5694
@ -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"
|
||||
|
@ -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={
|
||||
|
@ -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()}
|
||||
|
@ -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;
|
||||
}
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user