studio/docs
Archived
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

💄(frontend) darken the background as the mockup

Browse Source 
Darken the background as the mockup to make the
elements more visible.
This commit is contained in:
Anthony LC
2024-07-05 18:39:06 +02:00
committed by Anthony LC
parent 03953f0fe7
commit 3d370e5714
1 changed files with 4 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/frontend/apps/impress/src/layouts/MainLayout.tsx
View File

@@ -1,8 +1,11 @@
import { Box } from '@/components'; import { Box } from '@/components';
import { useCunninghamTheme } from '@/cunningham';
import { Footer } from '@/features/footer/Footer'; import { Footer } from '@/features/footer/Footer';
import { HEADER_HEIGHT, Header } from '@/features/header'; import { HEADER_HEIGHT, Header } from '@/features/header';
export function MainLayout({ children }: { children: React.ReactNode }) { export function MainLayout({ children }: { children: React.ReactNode }) {
const { colorsTokens } = useCunninghamTheme();
return ( return (
<Box> <Box>
<Box $height="100vh"> <Box $height="100vh">
@@ -12,6 +15,7 @@ export function MainLayout({ children }: { children: React.ReactNode }) {
as="main" as="main"
$height={`calc(100vh - ${HEADER_HEIGHT})`} $height={`calc(100vh - ${HEADER_HEIGHT})`}
$width="100%" $width="100%"
$background={colorsTokens()['primary-bg']}
> >
{children} {children}
</Box> </Box>