traxxx-web/pages/users/@username/+Page.vue

42 lines
673 B
Vue

<template>
<div class="profile">
<div class="profile-header">
<img
v-if="profile.avatar"
:src="profile.avatar"
class="avatar"
>
<h2 class="username">{{ profile.username }}</h2>
</div>
</div>
</template>
<script setup>
import { inject } from 'vue';
const pageContext = inject('pageContext');
const profile = pageContext.pageProps.profile;
</script>
<style scoped>
.profile-header {
display: flex;
align-items: center;
padding: .5rem 1rem;
color: var(--highlight-strong-30);
background: var(--grey-dark-40);
}
.username {
margin: 0;
}
.avatar {
width: 2rem;
height: 2rem;
border-radius: .25rem;
margin-right: 1rem;
}
</style>