list pagination

src/views/website/detail/DownloadPage.tsx

@@ -72,6 +72,7 @@ export default defineComponent({
                 );
               }}
               pagination={{
+                showSizeChanger: false,
                 hideOnSinglePage: true,
                 current: artStore.listController.state.page * 1,
                 pageSize: artStore.listController.state.size,

src/views/website/detail/List.tsx

@@ -36,6 +36,8 @@ export default defineComponent({
               return <List.Item>{slots.item?.(item, index)}</List.Item>;
             }}
             pagination={{
+              responsive: true,
+              showSizeChanger: false,
               hideOnSinglePage: true,
               current: actions.state.page * 1,
               pageSize: actions.state.size,
@@ -52,13 +54,50 @@ export default defineComponent({
   },
 });
 const ListContent = css`
-  .ant-list-pagination {
+  .ant-pagination {
     text-align: center;
-    .ant-pagination-item-active {
-      background: var(--vt-c-primary);
-      border-color: var(--vt-c-primary);
-      a {
-        color: #fff;
+
+    .ant-pagination-item {
+      &:hover {
+        border-color: var(--vt-c-primary);
+        color: var(--vt-c-primary);
+        a {
+          color: var(--vt-c-primary);
+        }
+      }
+      &.ant-pagination-item-active {
+        background: var(--vt-c-primary);
+        border-color: var(--vt-c-primary);
+        a {
+          color: #fff;
+        }
+      }
+    }
+    &.mini {
+      .ant-pagination-item {
+        &:hover {
+          border-color: transparent;
+        }
+      }
+      .ant-pagination-prev,
+      .ant-pagination-next {
+        .ant-pagination-item-link {
+          border-color: transparent;
+        }
+        &:hover {
+          .ant-pagination-item-link {
+            border-color: transparent;
+          }
+        }
+      }
+    }
+    .ant-pagination-prev,
+    .ant-pagination-next {
+      &:hover {
+        .ant-pagination-item-link {
+          border-color: var(--vt-c-primary);
+          color: var(--vt-c-primary);
+        }
       }
     }
   }