From ddffa640edca6c4be8e09cf76573c2fa201f4e26 Mon Sep 17 00:00:00 2001
From: Seth Sharp <sesharp@outlook.com>
Date: Wed, 21 Aug 2024 14:19:03 +1000
Subject: [PATCH] wipping slowly

---
 package-lock.json                            |  8 ++++----
 package.json                                 |  2 +-
 resources/js/Components/Editor/Editor.vue    |  2 +-
 resources/js/Components/Links/NavLink.vue    |  2 +-
 resources/js/Layouts/AuthenticatedLayout.vue | 12 ++++++------
 resources/js/Layouts/IndexBlogsLayout.vue    |  2 +-
 resources/views/app.blade.php                |  2 +-
 tailwind.config.js                           |  2 ++
 8 files changed, 17 insertions(+), 15 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index bf028cd..ae2ff67 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8,7 +8,7 @@
                 "@alpinejs/intersect": "^3.13.7",
                 "@headlessui/vue": "^1.7.16",
                 "@heroicons/vue": "^2.0.18",
-                "@sethsharp/ui": "1.0.0-alpha.2.0.29",
+                "@sethsharp/ui": "1.0.0-alpha.2.0.33",
                 "@tiptap/extension-bubble-menu": "^2.2.1",
                 "@tiptap/extension-code-block-lowlight": "^2.2.4",
                 "@tiptap/extension-document": "^2.2.1",
@@ -1061,9 +1061,9 @@
             ]
         },
         "node_modules/@sethsharp/ui": {
-            "version": "1.0.0-alpha.2.0.29",
-            "resolved": "https://registry.npmjs.org/@sethsharp/ui/-/ui-1.0.0-alpha.2.0.29.tgz",
-            "integrity": "sha512-HBrcAabC68f8JUj3su/btq8pu+WcuWg1NGdXXSP9Uih2EtOnxBophQHVNExxMN4icglJq/edg+9xkGfRjSHGQA==",
+            "version": "1.0.0-alpha.2.0.33",
+            "resolved": "https://registry.npmjs.org/@sethsharp/ui/-/ui-1.0.0-alpha.2.0.33.tgz",
+            "integrity": "sha512-+j8wIIfW74AwhrSO97jfYv3ukroT9/JgUTd/T1pyfW3rckXuLhF47qY0VmgBjRZSGV6TBm4EvRruwKy5yly5Fw==",
             "dependencies": {
                 "@heroicons/vue": "^2.1.4",
                 "@vueuse/core": "^10.11.0",
diff --git a/package.json b/package.json
index 4dff238..7369731 100644
--- a/package.json
+++ b/package.json
@@ -27,7 +27,7 @@
         "@alpinejs/intersect": "^3.13.7",
         "@headlessui/vue": "^1.7.16",
         "@heroicons/vue": "^2.0.18",
-        "@sethsharp/ui": "1.0.0-alpha.2.0.29",
+        "@sethsharp/ui": "1.0.0-alpha.2.0.33",
         "@tiptap/extension-bubble-menu": "^2.2.1",
         "@tiptap/extension-code-block-lowlight": "^2.2.4",
         "@tiptap/extension-document": "^2.2.1",
diff --git a/resources/js/Components/Editor/Editor.vue b/resources/js/Components/Editor/Editor.vue
index 2c739e1..2c2caef 100644
--- a/resources/js/Components/Editor/Editor.vue
+++ b/resources/js/Components/Editor/Editor.vue
@@ -27,7 +27,7 @@ const editor = useEditor({
     ],
     editorProps: {
         attributes: {
-            class: 'bg-white p-4 max-w-none w-full min-h-[500px] focus:outline-none border border-gray-200 rounded-md max-h-[85vh] overflow-y-scroll overflow-hidden prose prose-img:m-0 ',
+            class: 'bg-white p-4 max-w-none w-full min-h-[500px] focus:outline-none border border-gray-200 rounded-md max-h-[85vh] overflow-y-scroll overflow-hidden prose prose-img:m-0 dark:bg-slate-950',
         },
     },
     onUpdate: ({ editor }) => {
diff --git a/resources/js/Components/Links/NavLink.vue b/resources/js/Components/Links/NavLink.vue
index 61ad1f9..b0c996f 100644
--- a/resources/js/Components/Links/NavLink.vue
+++ b/resources/js/Components/Links/NavLink.vue
@@ -15,7 +15,7 @@ const props = defineProps({
 const classes = computed(() =>
     props.active
         ? 'inline-flex items-center px-1 pt-1 border-b-2 border-primary-400 text-sm font-medium leading-5 text-gray-900 focus:outline-none focus:border-primary-700 transition duration-150 ease-in-out dark:text-gray-300'
-        : 'inline-flex items-center px-1 pt-1 border-b-2 border-transparent text-sm font-medium leading-5 text-gray-400 hover:text-gray-300 hover:border-gray-300 focus:outline-none focus:text-gray-700 focus:border-gray-300 transition duration-150 ease-in-out'
+        : 'inline-flex items-center px-1 pt-1 border-b-2 border-transparent text-sm font-medium leading-5 text-gray-400 hover:text-gray-300 hover:border-gray-300 focus:outline-none focus:text-gray-700 focus:border-gray-300 transition duration-150 ease-in-out dark:focus:text-gray-400'
 )
 </script>
 
diff --git a/resources/js/Layouts/AuthenticatedLayout.vue b/resources/js/Layouts/AuthenticatedLayout.vue
index ad7daab..eaafc48 100644
--- a/resources/js/Layouts/AuthenticatedLayout.vue
+++ b/resources/js/Layouts/AuthenticatedLayout.vue
@@ -1,7 +1,7 @@
 <script setup>
 import { ref } from 'vue'
 import { Head, Link } from '@inertiajs/vue3'
-import { Notifications, Dropdown, DropdownMenuLink } from '@sethsharp/ui'
+import { Notifications, Dropdown, DropdownMenuLink, SecondaryButton } from '@sethsharp/ui'
 import NavLink from '@/Components/Links/NavLink.vue'
 import ApplicationLogo from '@/Components/ApplicationLogo.vue'
 import ResponsiveNavLink from '@/Components/Links/ResponsiveNavLink.vue'
@@ -38,8 +38,8 @@ const links = [
     <Head :title="title" />
 
     <div>
-        <div class="min-h-screen bg-gray-100 dark:bg-gray-900">
-            <nav class="bg-white border-b border-gray-300 dark:bg-gray-800 dark:border-transparent">
+        <div class="min-h-screen bg-gray-100 dark:bg-gray-800">
+            <nav class="bg-white border-b border-gray-300 dark:bg-gray-900 dark:border-transparent">
                 <!-- Primary Navigation Menu -->
                 <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
                     <div class="flex justify-between h-16">
@@ -68,9 +68,9 @@ const links = [
                         <div class="hidden sm:flex sm:items-center sm:ms-6">
                             <Dropdown>
                                 <template #trigger>
-                                    <button class="cursor-pointer">
+                                    <SecondaryButton>
                                         {{ $page.props.auth.user.name }}
-                                    </button>
+                                    </SecondaryButton>
                                 </template>
 
                                 <template #content>
@@ -185,7 +185,7 @@ const links = [
 
             <!-- Page Content -->
             <main>
-                <div class="bg-white rounded-xl m-2 sm:m-6 p-4 sm:p-12 dark:bg-gray-950">
+                <div class="bg-white rounded-xl m-2 sm:m-6 p-4 sm:p-12 dark:bg-gray-900">
                     <slot />
                 </div>
             </main>
diff --git a/resources/js/Layouts/IndexBlogsLayout.vue b/resources/js/Layouts/IndexBlogsLayout.vue
index 7e86ded..4018e8a 100644
--- a/resources/js/Layouts/IndexBlogsLayout.vue
+++ b/resources/js/Layouts/IndexBlogsLayout.vue
@@ -1,6 +1,6 @@
 <script setup>
 import { router, Link } from '@inertiajs/vue3'
-import { PrimaryButton, Tabs, Pagination, Heading } from '@sethsharp/ui'
+import { PrimaryButton, Tabs, Pagination } from '@sethsharp/ui'
 import AuthenticatedLayout from '@/Layouts/AuthenticatedLayout.vue'
 
 const props = defineProps({
diff --git a/resources/views/app.blade.php b/resources/views/app.blade.php
index c936eb9..6eb66c6 100644
--- a/resources/views/app.blade.php
+++ b/resources/views/app.blade.php
@@ -22,7 +22,7 @@
     @vite('resources/js/app.js')
     @inertiaHead
 </head>
-<body class="font-sans antialiased">
+<body class="font-sans antialiased bg-white dark:bg-gray-800">
 @inertia
 </body>
 </html>
diff --git a/tailwind.config.js b/tailwind.config.js
index d543504..2d7100d 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -22,6 +22,8 @@ module.exports = {
     ],
 
     safelist: [
+        'dark',
+
         'grid-cols-1',
         'grid-cols-2',
         'grid-cols-3',