add dark mode in BaseSelectInput

resources/scripts/components/base/BaseFileUploader.vue

@@ -21,7 +21,6 @@
       group
       min-h-[100px]
       bg-gray-50
-      dark:bg-gray-700 dark:border-gray-600
     "
     :class="avatar ? 'w-32 h-32' : 'w-full'"
   >
@@ -50,7 +49,7 @@
 
       <a
         href="#"
-        class="absolute z-30 bg-white rounded-full -bottom-3 -right-3 group dark:bg-gray-900"
+        class="absolute z-30 bg-white rounded-full -bottom-3 -right-3 group"
         @click.prevent.stop="onBrowse"
       >
         <BaseIcon
@@ -96,7 +95,7 @@
 
     <div
       v-else-if="localFiles.length && avatar && !multiple"
-      class="flex w-full h-full border border-gray-200 rounded dark:border-gray-600"
+      class="flex w-full h-full border border-gray-200 rounded"
     >
       <img
         v-if="localFiles[0].image"
@@ -170,11 +169,10 @@
           -right-3
           group
           hover:border-gray-300
-          dark:border-gray-600 dark:bg-gray-900 dark:hover:border-gray-700
         "
         @click.prevent.stop="onAvatarRemove(localFiles[0])"
       >
-        <BaseIcon name="XIcon" class="h-4 text-xl leading-6 text-black dark:text-white" />
+        <BaseIcon name="XIcon" class="h-4 text-xl leading-6 text-black" />
       </a>
     </div>
 
@@ -197,7 +195,6 @@
           hover:border-gray-500
           relative
           max-w-md
-          dark:border-gray-600 dark:bg-transparent dark:hover:border-gray-700
         "
         @click.prevent
       >
@@ -273,7 +270,6 @@
             -right-3
             group
             hover:border-gray-300
-            dark:border-gray-600 dark:bg-gray-900 dark:hover:border-gray-700
           "
           @click.prevent.stop="onFileRemove(index)"
         >
@@ -297,7 +293,6 @@
           hover:border-gray-500
           relative
           max-w-md
-          dark:border-gray-600 dark:bg-gray-800 dark:hover:border-gray-700
         "
         @click.prevent
       >
@@ -373,11 +368,10 @@
             -right-3
             group
             hover:border-gray-300
-            dark:border-gray-600 dark:bg-gray-900 dark:hover:border-gray-700
           "
           @click.prevent.stop="onFileRemove(index)"
         >
-          <BaseIcon name="XIcon" class="h-4 text-xl leading-6 text-black dark:text-white" />
+          <BaseIcon name="XIcon" class="h-4 text-xl leading-6 text-black" />
         </a>
       </a>
     </div>

resources/scripts/components/base/BaseSelectInput.vue

@@ -12,7 +12,7 @@
   >
     <ListboxLabel
       v-if="label"
-      class="block text-sm not-italic font-medium text-gray-800 mb-0.5"
+      class="block text-sm not-italic font-medium text-gray-800 mb-0.5 dark:text-white"
     >
       {{ label }}
     </ListboxLabel>
@@ -28,6 +28,7 @@
           pr-10
           text-left
           bg-white
+          dark:bg-gray-700
           border border-gray-200
           rounded-md
           shadow-sm
@@ -89,6 +90,7 @@
             ring-1 ring-black ring-opacity-5
             focus:outline-none
             sm:text-sm
+            dark:bg-gray-700
           "
         >
           <ListboxOption
@@ -100,7 +102,7 @@
           >
             <li
               :class="[
-                active ? 'text-white bg-primary-600' : 'text-gray-900',
+                active ? 'text-white bg-primary-600' : 'text-gray-900 dark:text-white',
                 'cursor-default select-none relative py-2 pl-3 pr-9',
               ]"
             >