fix: design abnormalities

Rule-34 · Aug 14, 2023 · b4484b8 · b4484b8
1 parent 210a8b9
commit b4484b8
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 10 deletions.
diff --git a/components/layout/navigation/SidebarWrapper.vue b/components/layout/navigation/SidebarWrapper.vue
@@ -67,13 +67,13 @@
               >
                 <div class="absolute left-full top-0 flex w-16 justify-center pt-5">
                   <button
-                    class="focus-visible:focus-outline-util hover:hover-bg-util -m-2.5 rounded-md p-2.5"
+                    class="focus-visible:focus-outline-util hover:hover-text-util hover:hover-bg-util -m-2.5 rounded-md p-2.5"
                     type="button"
                     @click="toggleMenu(false)"
                   >
                     <span class="sr-only">Close menu</span>
 
-                    <XMarkIcon class="hover:hover-text-util h-6 w-6 text-base-content-highlight" />
+                    <XMarkIcon class="h-6 w-6" />
                   </button>
                 </div>
               </TransitionChild>

diff --git a/components/pages/posts/navigation/DomainSelector.vue b/components/pages/posts/navigation/DomainSelector.vue
@@ -23,6 +23,7 @@
     as="template"
     @update:modelValue="emit('update:modelValue', $event)"
   >
+    <!-- TODO: Fix width -->
     <Float
       :offset="16"
       as="div"
@@ -73,7 +74,7 @@
         class="max-h-[23rem] w-full max-w-sm overflow-auto rounded-md bg-base-1000 py-1 ring-1 ring-base-0/20 focus:outline-none sm:text-sm"
       >
         <!-- Header -->
-        <header class="relative border-b border-base-0/20 pb-1">
+        <header class="relative pb-1.5">
           <h2
             v-tooltip="
               'A Booru is a type of website imageboard that specializes in parodies of anime, manga and video game related content'
@@ -165,10 +166,8 @@
         </ListboxOption>
 
         <!-- Add more button -->
-        <div class="hover:hover-text-util group flex items-center px-3 py-2">
-          <PlusIcon
-            class="group-hover:hover-text-util group-hover:hover-bg-util h-5 w-5 rounded p-0.5 ring-1 ring-base-0/20"
-          />
+        <div class="hover:hover-text-util hover:hover-bg-util group flex items-center px-3 py-2">
+          <PlusIcon class="group-hover:hover-text-util h-5 w-5 rounded" />
 
           <NuxtLink
             class="focus-visible:focus-outline-util ml-3"

diff --git a/components/pages/settings/SettingNumber.vue b/components/pages/settings/SettingNumber.vue
@@ -26,7 +26,7 @@
 
     <input
       :value="modelValue"
-      class="focus-visible:focus-outline-util h-6 w-12 rounded-full border-none bg-inherit px-2 text-center text-base-content-highlight ring-1 ring-base-0/20"
+      class="focus-visible:focus-outline-util hover:hover-bg-util h-6 w-12 rounded-full border-none bg-inherit px-2 text-center text-base-content-highlight ring-1 ring-base-0/20"
       min="0"
       type="number"
       v-bind="$attrs"

diff --git a/pages/premium/backup.vue b/pages/premium/backup.vue
@@ -130,7 +130,7 @@
 
       <!-- Backup -->
       <button
-        class="focus-visible:focus-outline-util hover:hover-text-util hover:hover-bg-util inline-flex min-w-[5rem] flex-col items-center gap-1.5 rounded-md p-2 ring-1 ring-base-0/20"
+        class="focus-visible:focus-outline-util hover:hover-text-util hover:hover-bg-util inline-flex min-w-[5rem] flex-col items-center gap-1.5 rounded-md p-2"
         type="button"
         @click="createBackup"
       >
@@ -149,7 +149,7 @@
       />
 
       <button
-        class="focus-visible:focus-outline-util hover:hover-text-util hover:hover-bg-util inline-flex min-w-[5rem] flex-col items-center gap-1.5 rounded-md p-2 ring-1 ring-base-0/20"
+        class="focus-visible:focus-outline-util hover:hover-text-util hover:hover-bg-util inline-flex min-w-[5rem] flex-col items-center gap-1.5 rounded-md p-2"
         type="button"
         @click="$refs.fileInputElement.click()"
       >