From c232c6e5f6d839e24006afca2cbc05df58ee0f9e Mon Sep 17 00:00:00 2001
From: snowy <snowykami@outlook.com>
Date: Mon, 15 Jul 2024 00:22:52 +0800
Subject: [PATCH] =?UTF-8?q?:sparkles:=20=E6=8F=92=E4=BB=B6=E5=95=86?=
 =?UTF-8?q?=E5=BA=97=E5=8F=8A=E8=B5=84=E6=BA=90=E5=95=86=E5=BA=97=E6=96=B0?=
 =?UTF-8?q?=E5=A2=9E=E6=90=9C=E7=B4=A2=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 docs/.vuepress/components/PluginStore.vue |  9 ++++-----
 docs/.vuepress/components/ResStore.vue    | 13 +++++++------
 docs/.vuepress/styles/index.scss          | 12 +++++++++++-
 3 files changed, 22 insertions(+), 12 deletions(-)

diff --git a/docs/.vuepress/components/PluginStore.vue b/docs/.vuepress/components/PluginStore.vue
index 24790be1..35e15eed 100644
--- a/docs/.vuepress/components/PluginStore.vue
+++ b/docs/.vuepress/components/PluginStore.vue
@@ -32,16 +32,15 @@ fetch('https://registry.nonebot.dev/plugins.json')
       items.value = items.value.concat(data)
     })
 
-
 </script>
 
 <template>
-  <div>
+  <div class="market">
     <h1>插件商店</h1>
     <p>内容来自<a href="https://nonebot.dev/store/plugins">NoneBot插件商店</a>和轻雪商店，在此仅作引用，具体请访问NoneBot插件商店</p>
     <!--    搜索框-->
-    <input class="item-search-box" type="text" placeholder="搜索插件" v-model="search"/>
-    <div class="market">
+    <div class="search-box-div"><input class="item-search-box" type="text" placeholder="搜索插件" v-model="search"/></div>
+    <div class="items">
       <!-- 使用filteredItems来布局商品 -->
       <ItemCard v-for="item in filteredItems" :key="item.id" :item="item"/>
     </div>
@@ -55,7 +54,7 @@ h1 {
   font-weight: bold;
 }
 
-.market {
+.items {
   display: grid;
   grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
   gap: 10px;
diff --git a/docs/.vuepress/components/ResStore.vue b/docs/.vuepress/components/ResStore.vue
index ec858371..548c5ace 100644
--- a/docs/.vuepress/components/ResStore.vue
+++ b/docs/.vuepress/components/ResStore.vue
@@ -6,13 +6,13 @@ import * as url from "node:url";
 // 从public/assets/resources.json加载插件
 let filteredItems = computed(() => {
   if (!search.value) {
-    return items.value
+    return items.value.reverse()
   }
   return items.value.filter(item =>
       item.name.toLowerCase().includes(search.value.toLowerCase()) ||
       item.description.toLowerCase().includes(search.value.toLowerCase()) ||
       item.author.toLowerCase().includes(search.value.toLowerCase())
-  )
+  ).reverse()
 })
 // 插件商店Nonebot
 let items = ref([])
@@ -23,14 +23,15 @@ fetch("/assets/resources.json")
     items.value = data
   })
   .catch(error => console.error(error))
+// 列表倒序
 
 </script>
 
 <template>
-  <div>
+  <div class="market">
     <h1>主题/资源商店</h1>
-    <input class="item-search-box" type="text" placeholder="搜索资源" v-model="search" />
-    <div class="market">
+    <div class="search-box-div"><input class="item-search-box" type="text" placeholder="搜索资源" v-model="search" /></div>
+    <div class="items">
       <!-- 使用filteredItems来布局商品 -->
       <ItemCard v-for="item in filteredItems" :key="item.id" :item="item"/>
     </div>
@@ -44,7 +45,7 @@ h1 {
   font-weight: bold;
 }
 
-.market {
+.items {
   display: grid;
   grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
   gap: 10px;
diff --git a/docs/.vuepress/styles/index.scss b/docs/.vuepress/styles/index.scss
index 32bc71c0..3ba3b40a 100644
--- a/docs/.vuepress/styles/index.scss
+++ b/docs/.vuepress/styles/index.scss
@@ -83,8 +83,18 @@ code {
 
 .item-search-box {
   border-radius: 100px;
-  width: 100%;
+  width: 80%;
   padding: 10px;
   margin: 10px 0;
   border: 1px solid #ccc;
+}
+
+.search-box-div {
+  display: flex;
+  justify-content: space-around;
+  margin: 10px 0;
+}
+
+.item-search-box {
+  width: 80%;
 }
\ No newline at end of file