Adjust footer and navbar colouring

~ Use neutral over dark colours ~ Run formatter and linter as well
2024-04-20 21:11:38 +10:00
parent 1fb5e9d6e7
commit 501f1a9c94
6 changed files with 48 additions and 18 deletions
@@ -2,10 +2,24 @@
 <html lang="en" data-theme="night">
  <head>
    <meta charset="utf-8" />
-    <link rel="apple-touch-icon" sizes="180x180" href="%sveltekit.assets%/apple-touch-icon.png">
-    <link rel="icon" type="image/png" sizes="32x32" href="%sveltekit.assets%/favicon-32x32.png">
-    <link rel="icon" type="image/png" sizes="16x16" href="%sveltekit.assets%/favicon-16x16.png">
-    <link rel="manifest" href="%sveltekit.assets%/site.webmanifest">
+    <link
+      rel="apple-touch-icon"
+      sizes="180x180"
+      href="%sveltekit.assets%/apple-touch-icon.png"
+    />
+    <link
+      rel="icon"
+      type="image/png"
+      sizes="32x32"
+      href="%sveltekit.assets%/favicon-32x32.png"
+    />
+    <link
+      rel="icon"
+      type="image/png"
+      sizes="16x16"
+      href="%sveltekit.assets%/favicon-16x16.png"
+    />
+    <link rel="manifest" href="%sveltekit.assets%/site.webmanifest" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    %sveltekit.head%
  </head>
@@ -1,11 +1,19 @@
-<footer
-  class="footer items-center pt-4 bg-base-300 dark:bg-neutral dark:text-neutral-content"
->
-  <aside class="items-center grid-flow-col">
+<script lang="ts">
+  import Github from "lucide-svelte/icons/github";
+  import Gitlab from "lucide-svelte/icons/gitlab";
+</script>
+
+<footer class="footer items-center pt-4 bg-neutral text-neutral-content">
+  <aside class="items-center grid-flow-col mx-2">
    <a class="btn btn-ghost text-xl" href="/">nickbland.dev</a>
    <p>Copyright © 2024 - All right reserved</p>
  </aside>
-  <nav class="grid-flow-col gap-4 md:place-self-center md:justify-self-end">
-    <!-- Buttons Here -->
+  <nav class="grid-flow-col gap-4 md:place-self-center md:justify-self-end mx-2">
+    <a role="button" class="btn btn-ghost" href="https://github.com/NickBland"
+      ><Github /></a
+    >
+    <a role="button" class="btn btn-ghost" href="https://git.nickbland.dev/NickBland"
+      ><Gitlab /></a
+    >
  </nav>
 </footer>
@@ -3,9 +3,7 @@
  import Menu from "lucide-svelte/icons/menu";
 </script>

-<div
-  class="navbar bg-base-300 dark:bg-neutral rounded-box mt-1 dark:text-neutral-content"
->
+<div class="navbar bg-neutral text-neutral-content">
  <div class="navbar-start">
    <div class="dropdown">
      <div tabindex="0" role="button" class="btn btn-ghost lg:hidden">
@@ -13,7 +11,7 @@
      </div>
      <ul
        tabindex="-1"
-        class="tablist menu menu-sm dropdown-content mt-3 z-[1] p-2 shadow bg-base-300 dark:bg-neutral rounded-box w-52 dark:text-neutral-content"
+        class="tablist menu menu-sm dropdown-content mt-3 z-[1] p-2 shadow bg-neutral rounded-box w-52 text-neutral-content"
      >
        <li><a href="/">Home</a></li>
        <li><a href="/portfolio">Portfolio</a></li>