src/components/admin/management/setting/BaseSetting.vue

@@ -6,12 +6,12 @@
       <SuccessCheckmark v-else-if="status == 'success'" />
       <FailureXMark v-else-if="status == 'failed'" />
       <div v-else-if="enableEdit" class="flex flex-row gap-2">
-        <button type="submit" class="!w-fit !h-fit !p-0">
+        <button type="submit" class="w-fit! h-fit! p-0!">
           <CheckIcon class="h-5 w-5 cursor-pointer" />
         </button>
         <button
           type="reset"
-          class="!w-fit !h-fit !p-0"
+          class="w-fit! h-fit! p-0!"
           @click="
             enableEdit = false;
             $emit('reset');

src/main.css

@@ -31,6 +31,8 @@
   }
 }
 
+@custom-variant hover (&:hover);
+
 /* ===== Scrollbar CSS ===== */
 /* Firefox */
 * {