fix: article list 和 search bar 样式

gethexon · Nov 12, 2021 · 48bfd22 · 48bfd22
1 parent ff530d7
commit 48bfd22
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 5 deletions.
diff --git a/packages/hexon-web/src/components/HSearchBar.vue b/packages/hexon-web/src/components/HSearchBar.vue
@@ -20,9 +20,15 @@ const onInput: any = (value: string) => emits("update:modelValue", value);
   <HToolbar>
     <div class="flex w-full px-6">
       <div class="flex-1"></div>
-      <!-- <HInput :modelValue="modelValue" @update:model-value="onInput" clearable>
+      <HInput
+        :modelValue="modelValue"
+        @update:model-value="onInput"
+        type="secondary"
+        placeholder="搜索"
+        clearable
+      >
       </HInput>
-      <HButton class="ml-2" round><HIcon :name="HIconName.Search" /></HButton> -->
+      <!-- <HButton class="ml-2" round><HIcon :name="HIconName.Search" /></HButton> -->
       <HButton class="ml-2" round @click="emits('on-add')"
         ><HIcon :name="HIconName.Add"
       /></HButton>

diff --git a/packages/hexon-web/src/pages/HomePage.vue b/packages/hexon-web/src/pages/HomePage.vue
@@ -137,11 +137,13 @@ const articleListData = computed(() =>
     </template>
     <template v-slot:second>
       <div
-        class="overflow-auto w-full h-full"
+        class="flex flex-col w-full h-full"
         :style="{ backgroundColor: theme.color.background.c2 }"
       >
-        <HSearchBar v-model="search" />
-        <HArticleList :articles="articleListData" />
+        <HSearchBar v-model="search" class="flex-shrink-0" />
+        <div class="overflow-auto flex-1">
+          <HArticleList :articles="articleListData" />
+        </div>
       </div>
     </template>
     <template v-slot:third>