refactor: enhance UI components with improved styling and transitions

- Updated DownloadQueue.vue to use Tailwind CSS for styling and added transition effects for better user experience.
- Refactored InstalledAppsModal.vue to improve layout and responsiveness, incorporating Tailwind CSS styles.
- Enhanced ScreenPreview.vue with transitions and improved button styles for navigation.
- Revamped ThemeToggle.vue to provide a more modern toggle button design with accessibility features.
- Updated TopActions.vue to use Tailwind CSS for buttons and layout adjustments.
- Refined UpdateAppsModal.vue with a cleaner layout, improved button styles, and better handling of loading states.

src/components/AppGrid.vue

@@ -1,20 +1,14 @@
 <template>
-  <div class="grid" v-if="!loading">
-    <AppCard 
-      v-for="(app, index) in apps" 
-      :key="index"
-      :app="app"
-      @open-detail="$emit('open-detail', app)"
-    />
+  <div v-if="!loading" class="mt-6 grid gap-5 sm:grid-cols-2 xl:grid-cols-3 2xl:grid-cols-4">
+    <AppCard v-for="(app, index) in apps" :key="index" :app="app" @open-detail="$emit('open-detail', app)" />
   </div>
-  <div v-else class="loading">
-    <div class="grid">
-      <div v-for="n in 8" :key="n" class="card loading">
-        <div class="icon"></div>
-        <div class="meta">
-          <div class="title">加载中...</div>
-          <div class="muted">正在获取应用数据</div>
-        </div>
+  <div v-else class="mt-6 grid gap-5 sm:grid-cols-2 xl:grid-cols-3 2xl:grid-cols-4">
+    <div v-for="n in 8" :key="n"
+      class="flex gap-4 rounded-2xl border border-slate-200/60 bg-white/80 p-4 shadow-sm dark:border-slate-800/60 dark:bg-slate-900/50">
+      <div class="h-16 w-16 animate-pulse rounded-2xl bg-slate-200 dark:bg-slate-800"></div>
+      <div class="flex flex-1 flex-col justify-center gap-2">
+        <div class="h-4 w-2/3 animate-pulse rounded-full bg-slate-200 dark:bg-slate-800"></div>
+        <div class="h-3 w-1/2 animate-pulse rounded-full bg-slate-200/80 dark:bg-slate-800/80"></div>
       </div>
     </div>
   </div>
@@ -37,7 +31,3 @@ defineProps({
 
 defineEmits(['open-detail']);
 </script>
-
-<style scoped>
-/* 该组件样式已在全局样式中定义 */
-</style>