forked from Mirrors/elk
fix: use some more semantic elements
This commit is contained in:
parent
d0ec3676b8
commit
d40b27982c
4 changed files with 10 additions and 8 deletions
|
@ -7,11 +7,11 @@ const props = defineProps<{
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div flex flex-col gap-2>
|
<article flex flex-col gap-2>
|
||||||
<div flex gap-2 flex-wrap text-sm px-2>
|
<div flex gap-2 flex-wrap text-sm px-2>
|
||||||
with
|
with
|
||||||
<AccountInlineInfo v-for="account in conversation.accounts" :key="account.id" :account="account" />
|
<AccountInlineInfo v-for="account in conversation.accounts" :key="account.id" :account="account" />
|
||||||
</div>
|
</div>
|
||||||
<StatusCard v-if="conversation.lastStatus" :status="conversation.lastStatus" :actions="false" />
|
<StatusCard v-if="conversation.lastStatus" :status="conversation.lastStatus" :actions="false" />
|
||||||
</div>
|
</article>
|
||||||
</template>
|
</template>
|
||||||
|
|
|
@ -4,7 +4,7 @@ const buildTimeAgo = useTimeAgo(buildTime)
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div p4 text-sm text-secondary-light flex="~ col">
|
<footer p4 text-sm text-secondary-light flex="~ col">
|
||||||
<div flex="~ gap2">
|
<div flex="~ gap2">
|
||||||
<button i-ri-sun-line dark:i-ri-moon-line text-lg mb4 @click="toggleDark()" />
|
<button i-ri-sun-line dark:i-ri-moon-line text-lg mb4 @click="toggleDark()" />
|
||||||
<button
|
<button
|
||||||
|
@ -13,8 +13,10 @@ const buildTimeAgo = useTimeAgo(buildTime)
|
||||||
@click="toggleZenMode()"
|
@click="toggleZenMode()"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<a cursor-pointer hover:underline @click="openPreviewHelp">Show intro</a>
|
<button cursor-pointer hover:underline @click="openPreviewHelp">
|
||||||
|
Show intro
|
||||||
|
</button>
|
||||||
<div>A Mastodon client made with 🧡</div>
|
<div>A Mastodon client made with 🧡</div>
|
||||||
<div>Built <time :datetime="buildTime" :title="buildTime">{{ buildTimeAgo }}</time> · <a href="https://github.com/elk-zone/elk" target="_blank">GitHub</a></div>
|
<div>Built <time :datetime="buildTime" :title="buildTime">{{ buildTimeAgo }}</time> · <a href="https://github.com/elk-zone/elk" target="_blank">GitHub</a></div>
|
||||||
</div>
|
</footer>
|
||||||
</template>
|
</template>
|
||||||
|
|
|
@ -7,7 +7,7 @@ const { notification } = defineProps<{
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div flex flex-col>
|
<article flex flex-col>
|
||||||
<template v-if="notification.type === 'follow'">
|
<template v-if="notification.type === 'follow'">
|
||||||
<div flex ml-4 items-center>
|
<div flex ml-4 items-center>
|
||||||
<div i-ri:user-follow-fill mr-3 color-primary />
|
<div i-ri:user-follow-fill mr-3 color-primary />
|
||||||
|
@ -57,5 +57,5 @@ const { notification } = defineProps<{
|
||||||
[DEV] MISSING notification.type: '{{ notification.type }}'
|
[DEV] MISSING notification.type: '{{ notification.type }}'
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</div>
|
</article>
|
||||||
</template>
|
</template>
|
||||||
|
|
|
@ -11,7 +11,7 @@ const { paginator } = defineProps<{
|
||||||
<template>
|
<template>
|
||||||
<CommonPaginator :paginator="paginator" virtual-scroller>
|
<CommonPaginator :paginator="paginator" virtual-scroller>
|
||||||
<template #default="{ item, active }">
|
<template #default="{ item, active }">
|
||||||
<DynamicScrollerItem :item="item" :active="active">
|
<DynamicScrollerItem :item="item" :active="active" tag="article">
|
||||||
<StatusCard
|
<StatusCard
|
||||||
:status="item"
|
:status="item"
|
||||||
border="b base" py-3
|
border="b base" py-3
|
||||||
|
|
Loading…
Reference in a new issue