feat: add titles to join and registration dates

This commit is contained in:
Twig 2025-07-19 16:41:04 +02:00
parent 7e7b0ad0f8
commit ae653a77c9
No known key found for this signature in database

View file

@ -15,7 +15,7 @@
{{ pronouns }} {{ pronouns }}
</span> </span>
</div> </div>
<div id="status">Status goes here lorem ipsum or something</div> <!-- <div id="status">Status goes here lorem ipsum or something</div> -->
<div v-if="me.uuid != uuid" id="action-buttons-container"> <div v-if="me.uuid != uuid" id="action-buttons-container">
<Button text="Message" variant="normal" :callback="buttonSendMessage"></Button> <Button text="Message" variant="normal" :callback="buttonSendMessage"></Button>
@ -35,21 +35,21 @@
</div> </div>
</div> </div>
</div> </div>
<VerticalSpacer /> <VerticalSpacer v-if="aboutMe" />
<div id="profile-footer"> <div id="profile-footer">
<div id="dates"> <div id="dates">
<div v-if="registrationDate" class="date-entry"> <div v-if="registrationDate" class="date-entry">
<span class="date-entry-title">Registered At</span><br> <span class="date-entry-title">Registered at</span><br>
<span class="date-entry-value">{{ registrationDate }}</span> <span class="date-entry-value" :title="registrationDate.toLocaleTimeString()">{{ toDateString(registrationDate) }}</span>
</div> </div>
<div v-if="joinDate" class="date-entry"> <div v-if="joinDate" class="date-entry">
<span class="date-entry-title">Joined At</span><br> <span class="date-entry-title">Joined at</span><br>
<span class="date-entry-value">{{ joinDate }}</span> <span class="date-entry-value" :title="joinDate.toLocaleTimeString()">{{ toDateString(joinDate) }}</span>
</div> </div>
<div v-if="friendsSince" class="date-entry"> <div v-if="friendsSince" class="date-entry">
<span class="date-entry-title">Friends Since</span><br> <span class="date-entry-title">Friends Since</span><br>
<span class="date-entry-value">{{ friendsSince }}</span> <span class="date-entry-value" :title="friendsSince.toLocaleTimeString()">{{ toDateString(friendsSince) }}</span>
</div> </div>
</div> </div>
</div> </div>
@ -75,13 +75,17 @@ const username = getUsername(props.profile)
const pronouns = getPronouns(props.profile) const pronouns = getPronouns(props.profile)
const aboutMe = getAboutMe(props.profile) const aboutMe = getAboutMe(props.profile)
const registrationDate = getRegistrationDate(props.profile)?.toLocaleDateString(undefined, { day: '2-digit', month: 'short', year: 'numeric' }) const registrationDate = getRegistrationDate(props.profile)
const joinDate = getGuildJoinDate(props.profile)?.toLocaleDateString(undefined, { day: '2-digit', month: 'short', year: 'numeric' }) const joinDate = getGuildJoinDate(props.profile)
const friendsSince = friendsSinceRequest?.toLocaleDateString(undefined, { day: '2-digit', month: 'short', year: 'numeric' }) const friendsSince = friendsSinceRequest
const uuid = getUuid(props.profile) const uuid = getUuid(props.profile)
const me = await fetchMe() as UserResponse const me = await fetchMe() as UserResponse
function toDateString(date: Date): string {
return date.toLocaleDateString(undefined, { day: '2-digit', month: 'short', year: 'numeric' })
}
function buttonSendMessage() { function buttonSendMessage() {
navigateTo(`/me/${uuid}`) navigateTo(`/me/${uuid}`)
} }
@ -163,7 +167,6 @@ function buttonEditProfile() {
} }
#username-and-pronouns { #username-and-pronouns {
margin-top: -0.2em;
font-size: .9em; font-size: .9em;
color: var(--secondary-text-color); color: var(--secondary-text-color);
} }