mirror of
https://github.com/Sonny93/my-links.git
synced 2025-12-09 23:15:36 +00:00
feat: add footer dashboard
This commit is contained in:
@@ -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;
|
||||||
|
|||||||
@@ -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>
|
||||||
|
|||||||
Reference in New Issue
Block a user