From 4cf5a4351b68b9d808ebbcfb4337d25b8c280851 Mon Sep 17 00:00:00 2001
From: NoriDev <m1nthing2322@gmail.com>
Date: Tue, 5 Nov 2024 21:25:38 +0900
Subject: [PATCH] fix(frontend): Note header design

---
 .../frontend/src/components/MkNoteHeader.vue  | 20 ++++++++++---------
 1 file changed, 11 insertions(+), 9 deletions(-)

diff --git a/packages/frontend/src/components/MkNoteHeader.vue b/packages/frontend/src/components/MkNoteHeader.vue
index 14e438c785..2de3eb0bae 100644
--- a/packages/frontend/src/components/MkNoteHeader.vue
+++ b/packages/frontend/src/components/MkNoteHeader.vue
@@ -6,15 +6,17 @@ SPDX-License-Identifier: AGPL-3.0-only
 <template>
 <header :class="$style.root">
 	<div :class="$style.section">
-		<div v-if="mock" :class="$style.name">
-			<MkUserName :user="note.user"/>
-		</div>
-		<MkA v-else v-user-preview="note.user.id" :class="$style.name" :to="userPage(note.user)">
-			<MkUserName :user="note.user"/>
-		</MkA>
-		<div v-if="note.user.isBot" :class="$style.isBot">bot</div>
-		<div v-if="note.user.badgeRoles" :class="$style.badgeRoles">
-			<img v-for="(role, i) in note.user.badgeRoles" :key="i" v-tooltip="role.name" :class="$style.badgeRole" :src="role.iconUrl!"/>
+		<div style="display: flex; white-space: nowrap; align-items: baseline;">
+			<div v-if="mock" :class="$style.name">
+				<MkUserName :user="note.user"/>
+			</div>
+			<MkA v-else v-user-preview="note.user.id" :class="$style.name" :to="userPage(note.user)">
+				<MkUserName :user="note.user"/>
+			</MkA>
+			<div v-if="note.user.isBot" :class="$style.isBot">bot</div>
+			<div v-if="note.user.badgeRoles" :class="$style.badgeRoles">
+				<img v-for="(role, i) in note.user.badgeRoles" :key="i" v-tooltip="role.name" :class="$style.badgeRole" :src="role.iconUrl!"/>
+			</div>
 		</div>
 		<div :class="$style.username"><MkAcct :user="note.user"/></div>
 	</div>