From c243256180a5fa5a4f0f928a56aa934db2aeb542 Mon Sep 17 00:00:00 2001
From: "Thomas \"ajnart\" Camlong" <thomascamlong@gmail.com>
Date: Sun, 15 May 2022 19:32:02 +0200
Subject: [PATCH] =?UTF-8?q?=F0=9F=92=84=20Improve=20layout=20styling?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/layout/Aside.tsx  |  4 +-
 src/components/layout/Footer.tsx | 68 +++++++++++++++++++-------------
 src/components/layout/Navbar.tsx |  4 +-
 3 files changed, 46 insertions(+), 30 deletions(-)

diff --git a/src/components/layout/Aside.tsx b/src/components/layout/Aside.tsx
index b2372fdb8..d51055c0b 100644
--- a/src/components/layout/Aside.tsx
+++ b/src/components/layout/Aside.tsx
@@ -5,9 +5,11 @@ import ModuleWrapper from '../modules/moduleWrapper';
 export default function Aside() {
   return (
     <MantineAside
-      height="100%"
       hiddenBreakpoint="md"
       hidden
+      style={{
+        border: 'none',
+      }}
       width={{
         base: 'auto',
       }}
diff --git a/src/components/layout/Footer.tsx b/src/components/layout/Footer.tsx
index 0324458e5..b89fb2fcb 100644
--- a/src/components/layout/Footer.tsx
+++ b/src/components/layout/Footer.tsx
@@ -1,5 +1,12 @@
 import React from 'react';
-import { createStyles, Anchor, Text, Group, ActionIcon } from '@mantine/core';
+import {
+  createStyles,
+  Anchor,
+  Text,
+  Group,
+  ActionIcon,
+  Footer as FooterComponent,
+} from '@mantine/core';
 import { BrandGithub } from 'tabler-icons-react';
 
 const useStyles = createStyles((theme) => ({
@@ -48,34 +55,39 @@ export function Footer({ links }: FooterCenteredProps) {
   ));
 
   return (
-    <Group
-      sx={{
-        position: 'fixed',
-        bottom: 0,
-        right: 15,
-      }}
-      direction="row"
-      align="center"
-      mb={15}
-    >
-      <Group className={classes.links}>{items}</Group>
-      <Group spacing="xs" position="right" noWrap>
-        <ActionIcon<'a'> component="a" href="https://github.com/ajnart/homarr" size="lg">
-          <BrandGithub size={18} />
-        </ActionIcon>
-      </Group>
-      <Text
-        style={{
-          fontSize: '0.75rem',
-          textAlign: 'center',
-          color: '#a0aec0',
+    <FooterComponent height="auto" style={{ border: 'none' }}>
+      <Group
+        sx={{
+          position: 'fixed',
+          bottom: 0,
+          right: 15,
         }}
+        direction="row"
+        align="center"
+        mb={15}
       >
-        Made with ❤️ by @
-        <Anchor href="https://github.com/ajnart" style={{ color: 'inherit', fontStyle: 'inherit', fontSize: 'inherit' }}>
-          ajnart
-        </Anchor>
-      </Text>
-    </Group>
+        <Group className={classes.links}>{items}</Group>
+        <Group spacing="xs" position="right" noWrap>
+          <ActionIcon<'a'> component="a" href="https://github.com/ajnart/homarr" size="lg">
+            <BrandGithub size={18} />
+          </ActionIcon>
+        </Group>
+        <Text
+          style={{
+            fontSize: '0.90rem',
+            textAlign: 'center',
+            color: '#a0aec0',
+          }}
+        >
+          Made with ❤️ by @
+          <Anchor
+            href="https://github.com/ajnart"
+            style={{ color: 'inherit', fontStyle: 'inherit', fontSize: 'inherit' }}
+          >
+            ajnart
+          </Anchor>
+        </Text>
+      </Group>
+    </FooterComponent>
   );
 }
diff --git a/src/components/layout/Navbar.tsx b/src/components/layout/Navbar.tsx
index 5d8fb38f8..7bb7a8410 100644
--- a/src/components/layout/Navbar.tsx
+++ b/src/components/layout/Navbar.tsx
@@ -5,9 +5,11 @@ import ModuleWrapper from '../modules/moduleWrapper';
 export default function Navbar() {
   return (
     <MantineNavbar
-      height="100%"
       hiddenBreakpoint="lg"
       hidden
+      style={{
+        border: 'none',
+      }}
       width={{
         base: 'auto',
       }}