优化置顶样式

kingwrcy · Apr 21, 2024 · d809ac9 · d809ac9
1 parent 065f717
commit d809ac9
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 6 deletions.
diff --git a/components/FriendsMemo.vue b/components/FriendsMemo.vue
@@ -1,6 +1,6 @@
 <template>
 
-  <div class="memo flex flex-row gap-2 sm:gap-4 text-sm border-x-0 pt-2 " >
+  <div class="memo flex flex-row gap-2 sm:gap-4 text-sm border-x-0 pt-2 p-2 sm:p-4" :class="{'bg-slate-100 dark:bg-neutral-700':props.memo.pinned}">
     <img :src="props.memo.user.avatarUrl" class="avatar w-9 h-9 rounded" />
     <div class="flex flex-col gap-.5 flex-1">
       <div class="flex flex-row justify-between items-center">

diff --git a/pages/index.vue b/pages/index.vue
@@ -3,16 +3,17 @@
 
     <MemoInput v-if="token" @memo-added="refresh" />
 
-    <div class="content flex flex-col divide-y divide-gray-100/50 p-2 sm:p-4 gap-2">
+    <div class="content flex flex-col divide-y divide-gray-100/50 gap-2">
       <div v-if="(data?.data as any as Memo[]).length === 0 && !token" class="text-center">
         <div class="my-2 text-sm">什么也没有,赶紧去登录发表Moments吧!</div>
         <Button @click="navigateTo('/login')">去登录</Button>
       </div>
       <FriendsMemo :memo="memo" v-for="(memo, index) in data?.data as any as Memo[]" :key="index" :show-more="true"
         @memo-update="refresh" />
-
+
+    </div>
+    <div class="cursor-pointer text-center text-sm opacity-70  my-4" @click="loadMore()" v-if="state.hasNext">点击加载更多...
     </div>
-    <div class="cursor-pointer text-center text-sm opacity-70  my-4" @click="loadMore()" v-if="state.hasNext">点击加载更多...</div>
   </div>
 </template>
 
@@ -29,7 +30,7 @@ useHead({
 const state = reactive({
   memoList: Array<Memo>(),
   page: 1,
-  hasNext:false
+  hasNext: false
 })
 
 
@@ -44,7 +45,7 @@ state.memoList = data.value?.data as any as Memo[]
 state.hasNext = data.value?.hasNext || false
 
 const loadMore = async () => {
-  const {data,hasNext} = await $fetch('/api/memo/list', {
+  const { data, hasNext } = await $fetch('/api/memo/list', {
     key: 'memoList',
     method: 'POST',
     body: JSON.stringify({