feat: style

src/components/CardStatisticsVertical.vue

@@ -53,7 +53,7 @@ const isPositive = controlledComputed(
       </p>
 
       <div v-if="props.subtitle" size="x-small" class="font-semibold">
-        <span class="text-truncate">{{ props.subtitle }}</span>
+        <span class="truncate">{{ props.subtitle }}</span>
       </div>
     </div>
   </div>

src/components/PaginationBar.vue

@@ -36,10 +36,14 @@ function gotoPage(pageNum: number) {
 
 </script>
 <template>
-    <div class="my-5 text-center">
+    <div class="my-5">
         <div v-if="total && limit" class="btn-group">
-            <button v-for="{ page, color } in pages" class="btn btn-md" :class="color" @click="gotoPage(page)">{{ page
-            }}</button>
+            <button v-for="{ page, color } in pages" :key="page"
+                class="btn bg-gray-100 text-gray-500 hover:text-white border-none dark:bg-gray-800 dark:text-white" :class="{
+                    '!bg-primary text-white': color === 'btn-primary',
+                }" @click="gotoPage(page)">
+                {{ page }}
+            </button>
         </div>
     </div>
 </template>