diff options
| author | かっこかり <67428053+kakkokari-gtyih@users.noreply.github.com> | 2024-09-30 20:05:34 +0900 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2024-09-30 20:05:34 +0900 |
| commit | ca8cc015b0be1cc25d00d753be2fb3b26f4bfbd9 (patch) | |
| tree | 370e591683778fa05a9ba0acc08a45900f85d754 /packages/frontend/src/pages | |
| parent | [skip ci] Update CHANGELOG.md (prepend template) (diff) | |
| download | misskey-ca8cc015b0be1cc25d00d753be2fb3b26f4bfbd9.tar.gz misskey-ca8cc015b0be1cc25d00d753be2fb3b26f4bfbd9.tar.bz2 misskey-ca8cc015b0be1cc25d00d753be2fb3b26f4bfbd9.zip | |
enhance(frontend): フォロワーへのメッセージ欄を改良 (#14656)
* enhance(frontend): フォロワーへのメッセージ欄を改良
* Update Changelog
Diffstat (limited to 'packages/frontend/src/pages')
| -rw-r--r-- | packages/frontend/src/pages/user/home.vue | 21 |
1 files changed, 17 insertions, 4 deletions
diff --git a/packages/frontend/src/pages/user/home.vue b/packages/frontend/src/pages/user/home.vue index ae8ac88361..93af534a9b 100644 --- a/packages/frontend/src/pages/user/home.vue +++ b/packages/frontend/src/pages/user/home.vue @@ -48,9 +48,10 @@ SPDX-License-Identifier: AGPL-3.0-only </div> </div> <div v-if="user.followedMessage != null" class="followedMessage"> - <div style="border: solid 1px var(--love); border-radius: 6px; background: color-mix(in srgb, var(--love), transparent 90%); padding: 6px 8px;"> - <Mfm :text="user.followedMessage" :author="user"/> - </div> + <MkFukidashi class="fukidashi" :tail="narrow ? 'none' : 'left'" negativeMargin shadow> + <div class="messageHeader">{{ i18n.ts.messageToFollower }}</div> + <div><Mfm :text="user.followedMessage" :author="user"/></div> + </MkFukidashi> </div> <div v-if="user.roles.length > 0" class="roles"> <span v-for="role in user.roles" :key="role.id" v-tooltip="role.description" class="role" :style="{ '--color': role.color }"> @@ -161,6 +162,7 @@ import * as Misskey from 'misskey-js'; import MkNote from '@/components/MkNote.vue'; import MkFollowButton from '@/components/MkFollowButton.vue'; import MkAccountMoved from '@/components/MkAccountMoved.vue'; +import MkFukidashi from '@/components/MkFukidashi.vue'; import MkRemoteCaution from '@/components/MkRemoteCaution.vue'; import MkTextarea from '@/components/MkTextarea.vue'; import MkOmit from '@/components/MkOmit.vue'; @@ -467,7 +469,18 @@ onUnmounted(() => { > .followedMessage { padding: 24px 24px 0 154px; - font-size: 0.9em; + + > .fukidashi { + display: block; + --fukidashi-bg: color-mix(in srgb, var(--love), var(--panel) 85%); + --fukidashi-radius: 16px; + font-size: 0.9em; + + .messageHeader { + opacity: 0.7; + font-size: 0.85em; + } + } } > .roles { |