summaryrefslogtreecommitdiff
path: root/packages/client
diff options
context:
space:
mode:
authorJohann150 <johann.galle@protonmail.com>2021-11-13 03:38:26 +0100
committerGitHub <noreply@github.com>2021-11-13 11:38:26 +0900
commit0f9a6417b0b614a8206f78a7a0115ea2df999ed3 (patch)
treefdd20012192784342dd7ac3f6152f491eb41e0ee /packages/client
parentNew Crowdin updates (#7977) (diff)
downloadmisskey-0f9a6417b0b614a8206f78a7a0115ea2df999ed3.tar.gz
misskey-0f9a6417b0b614a8206f78a7a0115ea2df999ed3.tar.bz2
misskey-0f9a6417b0b614a8206f78a7a0115ea2df999ed3.zip
fix(client): reaction viewer layout (#7942)
The profile picture and name should be grouped together as they belong, and it should be clear which picture belongs to which name.
Diffstat (limited to 'packages/client')
-rw-r--r--packages/client/src/components/reactions-viewer.details.vue6
1 files changed, 4 insertions, 2 deletions
diff --git a/packages/client/src/components/reactions-viewer.details.vue b/packages/client/src/components/reactions-viewer.details.vue
index 7c49bd1d9c..d80f9b9e8d 100644
--- a/packages/client/src/components/reactions-viewer.details.vue
+++ b/packages/client/src/components/reactions-viewer.details.vue
@@ -9,12 +9,14 @@
<template v-if="users.length <= 10">
<b v-for="u in users" :key="u.id" style="margin-right: 12px;">
<MkAvatar :user="u" style="width: 24px; height: 24px; margin-right: 2px;"/>
+ <br/>
<MkUserName :user="u" :nowrap="false" style="line-height: 24px;"/>
</b>
</template>
<template v-if="10 < users.length">
<b v-for="u in users" :key="u.id" style="margin-right: 12px;">
<MkAvatar :user="u" style="width: 24px; height: 24px; margin-right: 2px;"/>
+ <br/>
<MkUserName :user="u" :nowrap="false" style="line-height: 24px;"/>
</b>
<span slot="omitted">+{{ count - 10 }}</span>
@@ -64,7 +66,6 @@ export default defineComponent({
display: flex;
> .reaction {
- flex: 1;
max-width: 100px;
text-align: center;
@@ -80,12 +81,13 @@ export default defineComponent({
}
> .users {
+ display: flex;
flex: 1;
min-width: 0;
font-size: 0.9em;
border-left: solid 0.5px var(--divider);
padding-left: 10px;
- margin-left: 10px;
+ margin-left: 10px;
}
}
</style>