feat: pool load button

src/views/pool/Pool.vue

@@ -39,6 +39,8 @@ onMounted(async () => {
         />
       </div>
 
+      <div class="load"><span>点击继续加载</span></div>
+
       <KUNGalgameFooter />
     </div>
 
@@ -55,7 +57,7 @@ onMounted(async () => {
 }
 
 .pool-container {
-  transition: all 0.2s;
+  transition: width 0.2s;
   width: v-bind(poolPageWidth);
   margin: 0 auto;
   display: flex;
@@ -74,6 +76,24 @@ onMounted(async () => {
   gap: 10px;
 }
 
+.load {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  padding-top: 20px;
+
+  span {
+    font-size: 20px;
+    cursor: pointer;
+    color: var(--kungalgame-blue-4);
+    border-bottom: 2px solid var(--kungalgame-trans-white-9);
+
+    &:hover {
+      border-bottom: 2px solid var(--kungalgame-blue-4);
+    }
+  }
+}
+
 @media (max-width: 700px) {
   .pool-container {
     width: 100%;

src/views/pool/components/Topic.vue

@@ -62,7 +62,7 @@ onMounted(() => {
 </script>
 
 <template>
-  <div class="topic">
+  <RouterLink class="topic" :to="`/topic/${topic.tid}`">
     <div class="title">
       {{ topic.title }}
     </div>
@@ -85,7 +85,7 @@ onMounted(() => {
       <Icon class="hourglass" icon="eos-icons:hourglass" />
       <div>{{ loliTime }}</div>
     </div>
-  </div>
+  </RouterLink>
 </template>
 
 <style lang="scss" scoped>
@@ -101,7 +101,9 @@ onMounted(() => {
   max-width: 300px;
 
   &:hover {
+    transition: all 0.2s;
     background-color: var(--kungalgame-trans-white-2);
+    box-shadow: var(--kungalgame-shadow-1);
   }
 }
 
@@ -121,6 +123,11 @@ onMounted(() => {
 
 .content {
   overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 10;
+  overflow-wrap: break-word;
   font-size: 14px;
   padding: 0 10px;
   margin: 7px 0;
@@ -146,7 +153,7 @@ onMounted(() => {
   font-size: small;
   letter-spacing: 1px;
   overflow: hidden;
-  padding: 7px 0;
+  padding: 7px;
 
   .hourglass {
     flex-shrink: 0;

src/views/topic/components/Content.vue

@@ -19,8 +19,8 @@ const props = defineProps<{
 </template>
 
 <style lang="scss" scoped>
-/* Right side content area for the topic */
 .kungalgame-topic-content {
+  width: 100%;
   min-height: 200px;
   font-size: 15px;
   padding: 17px;
@@ -31,7 +31,6 @@ const props = defineProps<{
   overflow-x: auto;
 }
 
-/* Mobile responsiveness */
 @media (max-width: 700px) {
   .kungalgame-topic-content {
     width: 100%;