versia-pub/frontend
2
0
Fork 0
mirror of https://github.com/versia-pub/frontend.git synced 2025-12-06 16:38:20 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

refactor: ♻️ Use "header" HTML tag for note headers

Browse source
This commit is contained in:
Jesse Wierzbinski 2024-11-30 17:17:16 +01:00
parent 33cf7f5806
commit 97566289cd
No known key found for this signature in database
2 changed files with 11 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
components/notes/note.vue
View file

@ -1,6 +1,6 @@
<template> <template>
<Card as="article" class="rounded-none border-0 duration-200 shadow-none"> <Card as="article" class="rounded-none border-0 duration-200 shadow-none">
<CardHeader class="pb-4"> <CardHeader class="pb-4" as="header">
<ReblogHeader v-if="note.reblog" :avatar="note.account.avatar" <ReblogHeader v-if="note.reblog" :avatar="note.account.avatar"
:display-name="note.account.display_name" :url="reblogAccountUrl" /> :display-name="note.account.display_name" :url="reblogAccountUrl" />
<Header :avatar="noteToUse.account.avatar" :corner-avatar="note.reblog ? note.account.avatar : undefined" <Header :avatar="noteToUse.account.avatar" :corner-avatar="note.reblog ? note.account.avatar : undefined"

16
components/ui/card/CardHeader.vue
View file

@ -1,14 +1,18 @@
<script setup lang="ts"> <script setup lang="ts">
import { cn } from "@/lib/utils"; import { cn } from "@/lib/utils";
import { Primitive, type PrimitiveProps } from "radix-vue";
import type { HTMLAttributes } from "vue"; import type { HTMLAttributes } from "vue";
const props = defineProps<{ const props = withDefaults(
class?: HTMLAttributes["class"]; defineProps<PrimitiveProps & { class?: HTMLAttributes["class"] }>(),
}>(); {
as: "div",
},
);
</script> </script>
<template> <template>
<div :class="cn('flex flex-col gap-y-1.5 p-6', props.class)"> <Primitive :as="props.as" :as-child="props.asChild" :class="cn('flex flex-col gap-y-1.5 p-6', props.class)">
<slot /> <slot />
</div> </Primitive>
</template> </template>