Add lists hint

This commit is contained in:
Freeplay 2023-05-29 15:08:33 -04:00
parent 4bead341a1
commit d232ba2aff
3 changed files with 16 additions and 15 deletions

View File

@ -83,6 +83,7 @@ exportRequested: "You've requested an export. This may take a while. It will be
\ to your Drive once completed."
importRequested: "You've requested an import. This may take a while."
lists: "Lists"
listsDesc: "Lists let you create timelines with specified users. They can be accessed from the timelines page."
noLists: "You don't have any lists"
note: "Post"
notes: "Posts"

View File

@ -490,5 +490,8 @@ defineExpose({
.list > :deep(._button) {
margin-inline: auto;
margin-bottom: 16px;
&:last-of-type:not(:first-child) {
margin-top: 16px;
}
}
</style>

View File

@ -8,16 +8,17 @@
/></template>
<MkSpacer :content-max="700">
<div class="qkcjvfiv">
<div class="buttonWrapper">
<MkInfo
class="_gap"
:icon="'list-bullets'"
:card="true"
>
<p>{{ i18n.ts.listsDesc }}</p>
<MkButton primary class="add" @click="create"
><i class="ph-plus ph-bold ph-lg"></i>
{{ i18n.ts.createList }}</MkButton
>
<MkButton @click="deleteAll"
><i class="ph-trash ph-bold ph-lg"></i>
{{ i18n.ts.deleteAll }}</MkButton
>
</div>
</MkInfo>
<MkPagination
v-slot="{ items }"
@ -34,6 +35,10 @@
<div class="name">{{ list.name }}</div>
<MkAvatars :user-ids="list.userIds" />
</MkA>
<MkButton @click="deleteAll"
><i class="ph-trash ph-bold ph-lg"></i>
{{ i18n.ts.deleteAll }}</MkButton
>
</MkPagination>
</div>
</MkSpacer>
@ -45,6 +50,7 @@ import {} from "vue";
import MkPagination from "@/components/MkPagination.vue";
import MkButton from "@/components/MkButton.vue";
import MkAvatars from "@/components/MkAvatars.vue";
import MkInfo from "@/components/MkInfo.vue";
import * as os from "@/os";
import { i18n } from "@/i18n";
import { definePageMetadata } from "@/scripts/page-metadata";
@ -92,15 +98,6 @@ definePageMetadata({
<style lang="scss" scoped>
.qkcjvfiv {
> .buttonWrapper {
display: grid;
justify-content: center;
> .add {
margin: 0 auto var(--margin) auto;
}
}
> .lists {
> .list {
display: block;