versia-pub/frontend
2
0
Fork 0
mirror of https://github.com/versia-pub/frontend.git synced 2026-03-13 03:29:16 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: 💄 UI changes, new collapsible sidebars

Browse source
This commit is contained in:
Jesse Wierzbinski 2024-05-08 02:15:21 -10:00
parent 45eb8c6309
commit d8c7558bcb
No known key found for this signature in database
14 changed files with 222 additions and 180 deletions
Download patch file Download diff file Expand all files Collapse all files

47
pages/[username]/index.vue
View file

@ -1,30 +1,19 @@
<template>
<NuxtLayout name="app">
<div class="max-h-dvh overflow-y-scroll">
<SocialElementsUsersAccount v-if="isMobile" :account="account ?? undefined" />
<TimelinesTimelineScroller>
<TimelinesAccount :id="accountId ?? undefined" :key="accountId ?? undefined" />
</TimelinesTimelineScroller>
</div>
<template #right>
<SocialElementsUsersAccount v-if="!isMobile" :account="account ?? undefined" />
<div v-else>
</div>
</template>
</NuxtLayout>
<div class="max-h-dvh overflow-y-scroll w-full">
<SocialElementsUsersAccount :account="account ?? undefined" />
<TimelinesTimelineScroller>
<TimelinesAccount :id="accountId" :key="accountId" />
</TimelinesTimelineScroller>
</div>
</template>
<script setup lang="ts">
import type { Account } from "~/types/mastodon/account";
definePageMeta({
layout: false,
layout: "app",
});
const { width } = useWindowSize();
const isMobile = computed(() => width.value < 1024);
const route = useRoute();
const client = useMegalodon(undefined, true);
const username = (route.params.username as string).replace("@", "");
@ -33,12 +22,22 @@ const accounts = useAccountSearch(client, username);
const account = computed<Account | null>(
() => accounts.value?.find((account) => account.acct === username) ?? null,
);
const accountId = computed(() => account.value?.id ?? null);
const accountId = computed(() => account.value?.id ?? undefined);
useSeoMeta({
title: account.value?.display_name,
description: account.value?.note,
ogImage: account.value?.avatar,
profileUsername: account.value?.acct,
useServerSeoMeta({
title: computed(() =>
account.value ? account.value.display_name : "Loading",
),
ogTitle: computed(() =>
account.value ? account.value.display_name : "Loading",
),
ogImage: computed(() => (account.value ? account.value.avatar : undefined)),
ogType: "profile",
ogDescription: computed(() =>
account.value ? account.value.note : undefined,
),
description: computed(() =>
account.value ? account.value.note : undefined,
),
});
</script>