add dark mode in BreadCrumb and PageHeader.

resources/scripts/admin/views/estimates/Index.vue

@@ -130,7 +130,6 @@
           mt-5
           list-none
           border-b-2 border-gray-200 border-solid
-          dark:border-gray-600
         "
       >
         <!-- Tabs -->

resources/scripts/admin/views/invoices/Index.vue

@@ -127,7 +127,6 @@
           mt-5
           list-none
           border-b-2 border-gray-200 border-solid
-          dark:border-gray-600
         "
       >
         <!-- Tabs -->

resources/scripts/admin/views/recurring-invoices/Index.vue

@@ -121,7 +121,6 @@
           mt-5
           list-none
           border-b-2 border-gray-200 border-solid
-          dark:border-gray-600
         "
       >
         <!-- Tabs -->

resources/scripts/components/base/BaseBreadcrumb.vue

@@ -1,6 +1,6 @@
 <template>
   <nav>
-    <ol class="flex flex-wrap py-4 text-gray-900 rounded list-reset">
+    <ol class="flex flex-wrap py-4 text-gray-900 rounded list-reset dark:text-gray-400">
       <slot />
     </ol>
   </nav>

resources/scripts/components/base/BaseBreadcrumbItem.vue

@@ -8,7 +8,9 @@
         font-medium
         leading-5
         text-gray-900
+        dark:text-gray-400
         outline-none
+        dark:focus:ring-offset-gray-900
         focus:ring-2 focus:ring-offset-2 focus:ring-primary-400
       "
       :to="to"

resources/scripts/components/base/BasePageHeader.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="flex flex-wrap justify-between">
     <div>
-      <h3 class="text-2xl font-bold text-left text-black">
+      <h3 class="text-2xl font-bold text-left text-black dark:text-white">
         {{ title }}
       </h3>
       <slot />

resources/scripts/components/base/BaseTabGroup.vue

@@ -7,7 +7,7 @@
     >
       <TabList
         :class="[
-          'flex border-b border-grey-light dark:border-gray-600',
+          'flex border-b border-grey-light',
           'relative overflow-x-auto overflow-y-hidden',
           'lg:pb-0 lg:ml-0',
         ]"
@@ -22,8 +22,8 @@
             :class="[
               'px-8 py-2 text-sm leading-5 font-medium flex items-center relative border-b-2 mt-4 focus:outline-none whitespace-nowrap',
               selected
-                ? 'border-primary-400 text-black font-medium dark:text-white'
+                ? ' border-primary-400 text-black font-medium'
-                : 'border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300 dark:text-gray-400 dark:hover:border-gray-500',
+                : 'border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300',
             ]"
           >
             {{ tab.title }}