feat: 添加推荐主题和标签搜索页面

refactor: 优化CSS媒体查询和响应式布局
fix: 移除重复的媒体查询规则
style: 调整搜索框和侧边栏样式
docs: 更新HTML文档结构和元信息

css/public.less

@@ -3,8 +3,6 @@
     padding: 0;
     box-sizing: border-box;
     font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
-    // font-weight: 400;
-    // font-style: normal;
     word-break: break-word;
 }
 
@@ -406,13 +404,14 @@ body {
             color: #000000;
             line-height: 36px;
             margin-bottom: 7px;
+            display: block;
         }
 
         .message {
             font-size: 14px;
             color: #555555;
             margin-bottom: 20px;
-            width: 100%; 
+            width: 100%;
         }
 
         .total {
@@ -2530,6 +2529,12 @@ td {
     }
 }
 
+@media screen and (max-width: 1218px) {
+    .index-footer {
+        min-width: inherit !important;
+    }
+}
+
 @media screen and (max-width: 1200px) {
     header.page-header {
         min-width: auto !important;
@@ -2547,10 +2552,6 @@ td {
             margin-right: 10px;
         }
     }
-
-    .index-footer {
-        min-width: inherit !important;
-    }
 }
 
 // 媒体查询 最大宽度 768px 时
@@ -2573,32 +2574,6 @@ td {
         display: none !important;
     }
 
-    #search {
-        .search-box {
-            width: auto !important;
-            margin: 0 10px 20px;
-            height: 40px !important;
-        }
-        .classify {
-            margin-left: 10px;
-            margin-right: 10px;
-        }
-
-        .matter {
-            .matter-content {
-                margin: 0 10px;
-            }
-            .sidebar-box {
-                display: none;
-            }
-
-            .search-box {
-                margin-left: 10px;
-                margin-right: 10px;
-            }
-        }
-    }
-
     .item-box {
         padding: 18px 10px 0;
         .comment .text {
@@ -2610,16 +2585,6 @@ td {
     }
 }
 
-@media screen and (max-width: 500px) {
-    #search .classify .item {
-        min-width: inherit;
-        font-size: 13px;
-        height: 28px;
-        line-height: 28px;
-        border-radius: 8px;
-    }
-}
-
 @media screen and (max-width: 480px) {
     .head-top.flexacenter {
         margin-bottom: 10px !important;
@@ -2635,12 +2600,6 @@ td {
     }
 }
 
-@media screen and (max-width: 450px) {
-    #search .classify .item {
-        padding: 0 5px;
-    }
-}
-
 .huddle-box {
     position: fixed;
     top: 0;