diff options
-rw-r--r-- | packages/website/ts/components/portal/portal.tsx | 14 | ||||
-rw-r--r-- | packages/website/ts/style/z_index.ts | 1 |
2 files changed, 10 insertions, 5 deletions
diff --git a/packages/website/ts/components/portal/portal.tsx b/packages/website/ts/components/portal/portal.tsx index c9f2b2633..4166fde53 100644 --- a/packages/website/ts/components/portal/portal.tsx +++ b/packages/website/ts/components/portal/portal.tsx @@ -243,8 +243,7 @@ export class Portal extends React.Component<PortalProps, PortalState> { style={{ backgroundColor: colors.lightestGrey, position: 'fixed', - // Hack: used to make onboarding z-index logic work for both mobile and desktop - zIndex: utils.isMobile(this.props.screenWidth) ? zIndex.topBar : undefined, + zIndex: zIndex.topBar, }} maxWidth={LARGE_LAYOUT_MAX_WIDTH} /> @@ -696,9 +695,14 @@ interface LargeLayoutProps { } const LargeLayout = (props: LargeLayoutProps) => { return ( - <div className="mx-auto flex flex-center" style={{ maxWidth: LARGE_LAYOUT_MAX_WIDTH }}> + <Container className="mx-auto flex flex-center" maxWidth={LARGE_LAYOUT_MAX_WIDTH}> <div className="flex-last"> - <Container width={LEFT_COLUMN_WIDTH} position="fixed" marginLeft={LARGE_LAYOUT_MARGIN}> + <Container + width={LEFT_COLUMN_WIDTH} + position="fixed" + zIndex={zIndex.aboveTopBar} + marginLeft={LARGE_LAYOUT_MARGIN} + > {props.left} </Container> </div> @@ -707,7 +711,7 @@ const LargeLayout = (props: LargeLayoutProps) => { {props.right} </Container> </Container> - </div> + </Container> ); }; diff --git a/packages/website/ts/style/z_index.ts b/packages/website/ts/style/z_index.ts index 0411cdd91..a3998f59b 100644 --- a/packages/website/ts/style/z_index.ts +++ b/packages/website/ts/style/z_index.ts @@ -1,5 +1,6 @@ export const zIndex = { topBar: 1100, + aboveTopBar: 1101, overlay: 1105, aboveOverlay: 1106, }; |