diff --git a/packages/frontend/src/components/global/MkAcct.stories.impl.ts b/packages/frontend/src/components/global/MkAcct.stories.impl.ts
index 68202bb705..9d5fd3947d 100644
--- a/packages/frontend/src/components/global/MkAcct.stories.impl.ts
+++ b/packages/frontend/src/components/global/MkAcct.stories.impl.ts
@@ -47,8 +47,24 @@ export const Long = {
...Default.args,
user: {
...userDetailed(),
- username: '2c7cc62a697ea3a7826521f3fd34f0cb273693cbe5e9310f35449f43622a5cdc',
- host: 'nostr.example',
+ username: 'the_quick_brown_fox_jumped_over_the_lazy_dog',
+ host: 'misskey.example',
+ },
+ },
+ decorators: [
+ () => ({
+ template: '
',
+ }),
+ ],
+} satisfies StoryObj;
+export const VeryLong = {
+ ...Default,
+ args: {
+ ...Default.args,
+ user: {
+ ...userDetailed(),
+ username: '2c7cc62a697ea3a7826521f3fd34f0cb273693cbe5e9310f35449f43622a5cdc',
+ host: 'the.quick.brown.fox.jumped.over.the.lazy.dog.very.long.hostname.nostr.example',
},
},
decorators: [
diff --git a/packages/frontend/src/components/global/MkAcct.vue b/packages/frontend/src/components/global/MkAcct.vue
index 3b0715a23c..59358aef70 100644
--- a/packages/frontend/src/components/global/MkAcct.vue
+++ b/packages/frontend/src/components/global/MkAcct.vue
@@ -1,5 +1,5 @@
-
+
@{{ user.username }}
@{{ user.host || host }}
diff --git a/packages/frontend/src/components/global/MkCondensedLine.vue b/packages/frontend/src/components/global/MkCondensedLine.vue
index e3c0a866b7..40c7766a2a 100644
--- a/packages/frontend/src/components/global/MkCondensedLine.vue
+++ b/packages/frontend/src/components/global/MkCondensedLine.vue
@@ -7,14 +7,19 @@
@@ -22,6 +27,10 @@ const observer = new ResizeObserver((entries) => {