This commit is contained in:
parent
59373c6380
commit
6515bda730
18 changed files with 728 additions and 39 deletions
30
frontend-vue/src/components/user/PreviewHeader.vue
Normal file
30
frontend-vue/src/components/user/PreviewHeader.vue
Normal file
|
@ -0,0 +1,30 @@
|
|||
<script setup lang="ts">
|
||||
import { defineProps } from "vue"
|
||||
import type { User } from '../../stores/userdata'
|
||||
import ProfilePicture from '@/components/user/ProfilePicture.vue'
|
||||
import FormattedText from '@/components/util/FormattedText.vue'
|
||||
const props = defineProps<{
|
||||
user: User
|
||||
}>()
|
||||
</script>
|
||||
<template>
|
||||
<div class="account-header">
|
||||
<ProfilePicture :username="props.user.username" :media="props.user.profilePicture" />
|
||||
<div class="account-info">
|
||||
<FormattedText :raw-text="props.user.displayName"/>
|
||||
<p>{{props.user.username}}</p>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.account-header {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
.account-header {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
}
|
||||
</style>
|
Loading…
Add table
Add a link
Reference in a new issue