fix(frontend): Note header design

kokonect-link · Nov 5, 2024 · 4cf5a43 · 4cf5a43
1 parent 9bb72ec
commit 4cf5a43
Showing 1 changed file with 11 additions and 9 deletions.
diff --git 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>