diff options
Diffstat (limited to 'packages/frontend/src/components/MkNotification.vue')
| -rw-r--r-- | packages/frontend/src/components/MkNotification.vue | 16 |
1 files changed, 14 insertions, 2 deletions
diff --git a/packages/frontend/src/components/MkNotification.vue b/packages/frontend/src/components/MkNotification.vue index 38bf416ea8..b60967de02 100644 --- a/packages/frontend/src/components/MkNotification.vue +++ b/packages/frontend/src/components/MkNotification.vue @@ -69,8 +69,9 @@ <span v-else-if="notification.type === 'followRequestAccepted'" :class="$style.text" style="opacity: 0.6;">{{ i18n.ts.followRequestAccepted }}</span> <template v-else-if="notification.type === 'receiveFollowRequest'"> <span :class="$style.text" style="opacity: 0.6;">{{ i18n.ts.receiveFollowRequest }}</span> - <div v-if="full && !followRequestDone"> - <button class="_textButton" @click="acceptFollowRequest()">{{ i18n.ts.accept }}</button> | <button class="_textButton" @click="rejectFollowRequest()">{{ i18n.ts.reject }}</button> + <div v-if="full && !followRequestDone" :class="$style.followRequestCommands"> + <MkButton :class="$style.followRequestCommandButton" rounded primary @click="acceptFollowRequest()"><i class="ti ti-check"/> {{ i18n.ts.accept }}</MkButton> + <MkButton :class="$style.followRequestCommandButton" rounded danger @click="rejectFollowRequest()"><i class="ti ti-x"/> {{ i18n.ts.reject }}</MkButton> </div> </template> <span v-else-if="notification.type === 'app'" :class="$style.text"> @@ -87,6 +88,7 @@ import * as misskey from 'misskey-js'; import MkReactionIcon from '@/components/MkReactionIcon.vue'; import MkFollowButton from '@/components/MkFollowButton.vue'; import XReactionTooltip from '@/components/MkReactionTooltip.vue'; +import MkButton from '@/components/MkButton.vue'; import { getNoteSummary } from '@/scripts/get-note-summary'; import { notePage } from '@/filters/note'; import { userPage } from '@/filters/user'; @@ -294,6 +296,16 @@ useTooltip(reactionRef, (showing) => { margin-left: 4px; } +.followRequestCommands { + display: flex; + gap: 8px; + max-width: 300px; + margin-top: 8px; +} +.followRequestCommandButton { + flex: 1; +} + @container (max-width: 600px) { .root { padding: 16px; |