💄 Styling and responsiveness

Co-authored-by: Walkx <walkxnl@gmail.com>

src/components/layout/Footer.tsx

@@ -54,24 +54,12 @@ export function Footer({ links }: FooterCenteredProps) {
     </Anchor>
   ));
 
-  return (
-    <FooterComponent height="auto" style={{ border: 'none' }}>
-      <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>
+  return ( 
+    <FooterComponent p={5} height="auto" style={{ border: 'none', position: 'fixed', bottom: 0, right: 0 }}>
+      <Group position="right" mr="xs" mb="xs">
+        <ActionIcon<'a'> component="a" href="https://github.com/ajnart/homarr" size="lg">
+          <BrandGithub size={18} />
+        </ActionIcon>
         <Text
           style={{
             fontSize: '0.90rem',

src/components/layout/Layout.tsx

@@ -6,9 +6,6 @@ import Navbar from './Navbar';
 
 const useStyles = createStyles((theme) => ({
   main: {
-    [theme.fn.largerThan('md')]: {
-      maxWidth: 1500,
-    },
   },
 }));
 
@@ -21,7 +18,6 @@ export default function Layout({ children, style }: any) {
       header={<Header links={[]} />}
       footer={<Footer links={[]} />}
     >
-      <Center>
         <main
           className={cx(classes.main)}
           style={{
@@ -30,7 +26,6 @@ export default function Layout({ children, style }: any) {
         >
           {children}
         </main>
-      </Center>
     </AppShell>
   );
 }

src/components/layout/Navbar.tsx

@@ -14,7 +14,7 @@ export default function Navbar() {
         base: 'auto',
       }}
     >
-      <Group mt="sm" direction="column">
+      <Group mt="sm" direction="column" align="center">
         <ModuleWrapper module={DateModule} />
       </Group>
     </MantineNavbar>