feat: improve light and dark mode text

Closes #1

Author: natedunn

src/testTheme.ts

@@ -5,6 +5,6 @@ export default {
     _default: "$root.danger",
   },
   Anchor: {
-    button: "inline-flex space-x-2 text(green-700 dark:green-50 hover:shamrock-900) px-2 py-2 rounded hover:(bg(gray-100 dark:gray-700))"
+    button: "inline-flex space-x-2 text(gray-500 dark:gray-300 hover:dark:white hover:green-700) px-2.5 py-2 rounded hover:(bg(green-100 dark:gray-700 opacity-50 dark:opacity-50))"
   }
 };

src/views/components/Footer.vue

@@ -1,5 +1,5 @@
 <template>
-  <footer :class="tw`bg-gray-100 dark:bg-gray-800`">
+  <footer :class="tw`bg-gray-50 border-t border-gray-100 dark:bg-gray-800`">
     <div
       :class="tw`px-4 py-12 mx-auto overflow-hidden max-w-7xl sm:px-6 lg:px-8`"
     >

src/views/components/LightSwitch.vue

@@ -2,7 +2,7 @@
   <button @click="toggleScheme">
     <svg
       v-if="isDark"
-      :class="tw`w-4`"
+      :class="tw`w-5`"
       xmlns="http://www.w3.org/2000/svg"
       viewBox="0 0 20 20"
       fill="currentColor"

src/views/components/MainNav.vue

@@ -25,13 +25,13 @@
     <div :class="tw`flex items-center ml-auto space-x-2`">
       <LightSwitch
         :class="
-          tw`flex items-center text(shamrock-700 dark:shamrock-50 hover:shamrock-900) px-2 py-2 rounded hover:(bg(shamrock-50 dark:gray-700)) uppercase cursor-pointer select-none`
+          tw`items-center inline-flex space-x-2 uppercase cursor-pointer select-none text(gray-500 dark:gray-300 hover:dark:white hover:green-700) px-2.5 py-2 rounded hover:(bg(green-100 dark:gray-700 opacity-50 dark:opacity-50))`
         "
       />
       <Dropdown>
         <DropdownButton
           as="button"
-          classAppend="flex items-center text(shamrock-700 dark:shamrock-50 hover:shamrock-900) px-2 py-2 rounded hover:(bg(shamrock-50 dark:gray-700)) uppercase cursor-pointer"
+          classAppend="items-center uppercase cursor-pointer inline-flex space-x-2 text(gray-500 dark:gray-300 hover:dark:white hover:green-700) px-2.5 py-2 rounded hover:(bg(green-100 dark:gray-700 opacity-50 dark:opacity-50))"
         >
           <div>{{ locale === "zh-CN" ? "中文" : locale }}</div>
           <svg