Update header style, add theme to head

2 files changed, 23 insertions, 15 deletions

diff --git a/resources/views/includes/head.blade.php b/resources/views/includes/head.blade.php
index 1191836..2a5ad6e 100644
--- a/resources/views/includes/head.blade.php
+++ b/resources/views/includes/head.blade.php
@@ -3,6 +3,7 @@
     <meta property="og:type" content="website">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <meta name="theme-color" content="#333333">
+    <link rel="stylesheet" href="/css/colorschemes/catppuccin-macchiato.css" id="css-colorscheme"/>
     <link rel="stylesheet" href="/css/master.css"/>
     <link rel="icon" type="image/png" href="/favicon-32x32.png" sizes="32x32"/>
     <link rel="icon" type="image/png" href="/favicon-16x16.png" sizes="16x16"/>
diff --git a/resources/views/includes/header.blade.php b/resources/views/includes/header.blade.php
index 9a020d2..ee3d077 100644
--- a/resources/views/includes/header.blade.php
+++ b/resources/views/includes/header.blade.php
@@ -1,18 +1,25 @@
     <nav>
-        <div>
-            <h1>diskfloppy.me | <strong>@yield('title')</strong></h1>
-            <a href="/" title="Home"><img src="/images/icons/nav/home.png" alt="Home" width="32" height="32"></a>
-            <a href="//git.diskfloppy.me/" title="cgit"><img src="/images/icons/nav/repo.png" alt="cgit" width="32" height="32"></a>
-            <a href="/pub/" title="Public Files"><img src="/images/icons/nav/pubfiles.png" alt="Public Files" width="32" height="32"></a>
-            <a href="/computers/" title="Computers"><img src="/images/icons/nav/computers.png" alt="Computers" width="32" height="32"></a>
-            <a href="/bookmarks/" title="Bookmarks"><img src="/images/icons/nav/bookmarks.png" alt="Bookmarks" width="32" height="32"></a>
-            <a href="/guestbook/" title="Guestbook"><img src="/images/icons/nav/guestbook.png" alt="Guestbook" width="32" height="32"></a>
-            <!--<a href="/contact/" title="Contact"><img src="/images/icons/nav/mail.png" alt="Contact" width="32" height="32"></a>-->
-            <a href="/weather/" title="Weather"><img src="/images/icons/nav/weather.png" alt="Weather" width="32" height="32"></a>
-            <a href="/music/" title="Music"><img src="/images/icons/nav/music.png" alt="Music" width="32" height="32"></a>&nbsp;&nbsp;
-            @if (auth()->check())
-                <a href="/admin/">admin</a>
-                ({{ auth()->user()->name }}) <a href="/logout">logout</a>
-            @endif
+        <h1>diskfloppy.me | <strong>@yield('title')</strong></h1>
+        <div class="nav-wrapper">
+            <div>
+                <a href="/" title="Home"><img src="/images/icons/nav/home.png" alt="Home" width="32" height="32"></a>
+                <a href="//git.diskfloppy.me/" title="cgit"><img src="/images/icons/nav/repo.png" alt="cgit" width="32" height="32"></a>
+                <a href="/pub/" title="Public Files"><img src="/images/icons/nav/pubfiles.png" alt="Public Files" width="32" height="32"></a>
+                <a href="/computers/" title="Computers"><img src="/images/icons/nav/computers.png" alt="Computers" width="32" height="32"></a>
+                <a href="/bookmarks/" title="Bookmarks"><img src="/images/icons/nav/bookmarks.png" alt="Bookmarks" width="32" height="32"></a>
+                <a href="/guestbook/" title="Guestbook"><img src="/images/icons/nav/guestbook.png" alt="Guestbook" width="32" height="32"></a>
+                <!--<a href="/contact/" title="Contact"><img src="/images/icons/nav/mail.png" alt="Contact" width="32" height="32"></a>-->
+                <a href="/weather/" title="Weather"><img src="/images/icons/nav/weather.png" alt="Weather" width="32" height="32"></a>
+                <a href="/music/" title="Music"><img src="/images/icons/nav/music.png" alt="Music" width="32" height="32"></a>&nbsp;&nbsp;
+            </div>
+            <div class="theme-selector">
+                <form>
+                    <label for="theme">Theme</label>
+                    <select name="theme" id="theme-selector" onmousedown="this.value='';" onchange="swapTheme(this.value);">
+                        <option value="catppuccin-macchiato">Catppuccin Macchiato</option>
+                        <option value="blind-yourself">blind yourself</option>
+                    </select>
+                </form>
+            </div>
         </div>
     </nav>