UI Fixes for Dark Mode (#3337)

* Forced Scroll BG color fix

* pr requested changes
This commit is contained in:
Kanav Arora
2024-01-17 16:24:29 +05:30
committed by GitHub
parent 60e9864e52
commit 5cf0077e3d

View File

@ -1,4 +1,5 @@
import { ReactNode } from 'react';
import { css, Global, useTheme } from '@emotion/react';
import styled from '@emotion/styled';
import { AnimatePresence, LayoutGroup } from 'framer-motion';
@ -62,30 +63,39 @@ type DefaultLayoutProps = {
export const DefaultLayout = ({ children }: DefaultLayoutProps) => {
const onboardingStatus = useOnboardingStatus();
const isMobile = useIsMobile();
const theme = useTheme();
return (
<StyledLayout>
<CommandMenu />
<KeyboardShortcutMenu />
<StyledPageContainer>
<StyledAppNavigationDrawer />
<StyledMainContainer>
{onboardingStatus &&
onboardingStatus !== OnboardingStatus.Completed ? (
<>
<SignInBackgroundMockPage />
<AnimatePresence mode="wait">
<LayoutGroup>
<AuthModal>{children}</AuthModal>
</LayoutGroup>
</AnimatePresence>
</>
) : (
<AppErrorBoundary>{children}</AppErrorBoundary>
)}
</StyledMainContainer>
</StyledPageContainer>
{isMobile && <MobileNavigationBar />}
</StyledLayout>
<>
<Global
styles={css`
body {
background: ${theme.background.tertiary};
}
`}
/>
<StyledLayout>
<CommandMenu />
<KeyboardShortcutMenu />
<StyledPageContainer>
<StyledAppNavigationDrawer />
<StyledMainContainer>
{onboardingStatus &&
onboardingStatus !== OnboardingStatus.Completed ? (
<>
<SignInBackgroundMockPage />
<AnimatePresence mode="wait">
<LayoutGroup>
<AuthModal>{children}</AuthModal>
</LayoutGroup>
</AnimatePresence>
</>
) : (
<AppErrorBoundary>{children}</AppErrorBoundary>
)}
</StyledMainContainer>
</StyledPageContainer>
{isMobile && <MobileNavigationBar />}
</StyledLayout>
</>
);
};