fix ui

src/views/discover/MediaCardListView.vue

@@ -136,10 +136,4 @@ const fetchData = async ({ done }) => {
   grid-template-columns: repeat(auto-fill, minmax(9.375rem, 1fr));
 }
 
-.centered {
-  position: absolute;
-  inset-block-start: 50%;
-  inset-inline-start: 50%;
-  transform: translate(-50%, -50%);
-}
 </style>

src/views/reorganize/DownloadingListView.vue

@@ -79,10 +79,4 @@ onUnmounted(() => {
   padding-block-end: 1rem;
 }
 
-.centered {
-  position: absolute;
-  inset-block-start: 50%;
-  inset-inline-start: 50%;
-  transform: translate(-50%, -50%);
-}
 </style>

src/views/site/SiteCardListView.vue

@@ -24,6 +24,12 @@ onBeforeMount(fetchData)
 </script>
 
 <template>
+  <VProgressCircular
+    class="centered"
+    v-if="!isRefreshed"
+    indeterminate
+    color="primary"
+  ></VProgressCircular>
   <div
     class="grid gap-3 grid-site-card"
     v-if="dataList.length > 0"

src/views/subscribe/SubscribeListView.vue

@@ -46,6 +46,12 @@ const filteredDataList = computed(() => {
 </script>
 
 <template>
+  <VProgressCircular
+    class="centered"
+    v-if="!isRefreshed"
+    indeterminate
+    color="primary"
+  ></VProgressCircular>
   <PullRefresh v-model="loading" @refresh="onRefresh">
     <div class="grid gap-3 grid-subscribe-card" 
       v-if="filteredDataList.length > 0">