feat: add footer dashboard

This commit is contained in:
Sonny
2024-11-03 16:06:44 +01:00
committed by Sonny
parent 01a21ddef8
commit d796e4d38a
2 changed files with 5 additions and 9 deletions

View File

@@ -1,16 +1,11 @@
.footer { .footer {
width: 100%; width: 100%;
margin-top: rem(40px);
border-top: rem(1px) solid
light-dark(var(--mantine-color-gray-2), var(--mantine-color-dark-5));
} }
.inner { .inner {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
padding-top: var(--mantine-spacing-md);
padding-bottom: var(--mantine-spacing-md);
@media (max-width: $mantine-breakpoint-xs) { @media (max-width: $mantine-breakpoint-xs) {
flex-direction: column; flex-direction: column;

View File

@@ -9,6 +9,7 @@ import {
import { useDisclosure } from '@mantine/hooks'; import { useDisclosure } from '@mantine/hooks';
import DashboardProviders from '~/components/dashboard/dashboard_provider'; import DashboardProviders from '~/components/dashboard/dashboard_provider';
import LinkItem from '~/components/dashboard/link/link_item'; import LinkItem from '~/components/dashboard/link/link_item';
import { MantineFooter } from '~/components/footer/mantine_footer';
import { DashboardNavbar } from '~/mantine/components/dashboard/dashboard_navbar'; import { DashboardNavbar } from '~/mantine/components/dashboard/dashboard_navbar';
import { MantineDashboardLayout } from '~/mantine/layouts/mantine_dashboard_layout'; import { MantineDashboardLayout } from '~/mantine/layouts/mantine_dashboard_layout';
import { CollectionWithLinks } from '~/types/app'; import { CollectionWithLinks } from '~/types/app';
@@ -30,7 +31,6 @@ export default function MantineDashboard(props: Readonly<DashboardPageProps>) {
<AppShell <AppShell
layout="alt" layout="alt"
header={{ height: 60 }} header={{ height: 60 }}
footer={{ height: 60 }}
navbar={{ navbar={{
width: 300, width: 300,
breakpoint: 'sm', breakpoint: 'sm',
@@ -41,7 +41,6 @@ export default function MantineDashboard(props: Readonly<DashboardPageProps>) {
breakpoint: 'md', breakpoint: 'md',
collapsed: { mobile: !openedAside }, collapsed: { mobile: !openedAside },
}} }}
padding={0}
classNames={{ classNames={{
aside: classes.ml_bg_color, aside: classes.ml_bg_color,
footer: classes.ml_bg_color, footer: classes.ml_bg_color,
@@ -58,7 +57,7 @@ export default function MantineDashboard(props: Readonly<DashboardPageProps>) {
hiddenFrom="sm" hiddenFrom="sm"
size="sm" size="sm"
/> />
Ma super collection {props.activeCollection.name}
</Group> </Group>
<Burger <Burger
opened={openedAside} opened={openedAside}
@@ -92,7 +91,9 @@ export default function MantineDashboard(props: Readonly<DashboardPageProps>) {
/> />
</Group> </Group>
</AppShell.Aside> </AppShell.Aside>
<AppShell.Footer p="md">Footer</AppShell.Footer> <AppShell.Footer pl="xs" pr="xs">
<MantineFooter />
</AppShell.Footer>
</AppShell> </AppShell>
</DashboardProviders> </DashboardProviders>
</MantineDashboardLayout> </MantineDashboardLayout>