diff --git a/src/pages/resource.vue b/src/pages/resource.vue index 6ed3a8c4..1d2c99db 100644 --- a/src/pages/resource.vue +++ b/src/pages/resource.vue @@ -514,17 +514,43 @@ onUnmounted(() => { @media (max-width: 600px) { .search-header { - flex-direction: column; - align-items: flex-start; + padding: 8px 12px; } - + + .search-title { + font-size: 0.95rem; + white-space: nowrap; + } + .search-info-container { - margin-bottom: 12px; - width: 100%; + flex: 1; + gap: 8px; + min-width: 0; + overflow: hidden; } - + + .search-tags { + overflow-x: auto; + flex-wrap: nowrap; + scrollbar-width: none; + margin-right: 8px; + } + + .search-tags::-webkit-scrollbar { + display: none; + } + .view-toggle-container { - align-self: flex-end; + flex-shrink: 0; + } + + .view-toggle-buttons { + padding: 2px; + } + + .view-toggle-btn { + width: 36px; + height: 32px; } } diff --git a/src/views/torrent/TorrentCardListView.vue b/src/views/torrent/TorrentCardListView.vue index 2a802443..81585abb 100644 --- a/src/views/torrent/TorrentCardListView.vue +++ b/src/views/torrent/TorrentCardListView.vue @@ -487,15 +487,15 @@ function loadMore({ done }: { done: any }) { -
+
-
-
-
+
+
+
@@ -727,21 +727,21 @@ function loadMore({ done }: { done: any }) { } .mobile-sort-select { - min-width: 130px; - max-width: 150px; - font-size: 0.9rem; + min-width: 110px; + max-width: 130px; + font-size: 0.8rem; } .filter-buttons-grid { display: grid; grid-template-columns: repeat(3, 1fr); - gap: 6px; + gap: 4px; } .filter-btn-mobile { height: auto; - min-height: 64px; - padding: 8px 0; + min-height: 48px; + padding: 4px 0; background-color: rgba(var(--v-theme-surface), 1); border-radius: 8px; display: flex; @@ -752,12 +752,20 @@ function loadMore({ done }: { done: any }) { } .filter-icon { - margin-bottom: 4px; - font-size: 22px; + margin-bottom: 2px; + font-size: 18px; } .filter-label { - font-size: 0.8rem; + font-size: 0.7rem; text-align: center; } + +.search-header-mobile { + position: sticky; + top: 0; + z-index: 10; + background-color: rgba(var(--v-theme-background), 0.95); + backdrop-filter: blur(10px); +} diff --git a/src/views/torrent/TorrentRowListView.vue b/src/views/torrent/TorrentRowListView.vue index 7625dfb7..7acf1b3d 100644 --- a/src/views/torrent/TorrentRowListView.vue +++ b/src/views/torrent/TorrentRowListView.vue @@ -379,98 +379,101 @@ function toggleFilterMenu(key: string) {