mirror/cherrypick
1
1
Fork 0
mirror of https://github.com/kokonect-link/cherrypick synced 2024-12-13 06:08:58 +09:00
Code

fix(friendly): Fix for location issue in chat field when not in mobile environment

Browse Source
This commit is contained in:
NoriDev 2022-09-07 03:15:08 +09:00
parent 830f6749b8
commit ffd379ff3f
1 changed files with 13 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
packages/client/src/pages/messaging/messaging-room.vue
View File

@ -29,7 +29,7 @@
</template> </template>
</MkPagination> </MkPagination>
</div> </div>
<footer :class="{friendly: isFriendly }"> <footer :class="{ friendly: isFriendly, 'friendly-not-mobile': !isMobile }">
<div v-if="typers.length > 0" class="typers"> <div v-if="typers.length > 0" class="typers">
<I18n :src="i18n.ts.typingUsers" text-tag="span" class="users"> <I18n :src="i18n.ts.typingUsers" text-tag="span" class="users">
<template #users> <template #users>
@ -50,7 +50,7 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { computed, watch, onMounted, nextTick, onBeforeUnmount } from 'vue'; import { computed, watch, onMounted, nextTick, onBeforeUnmount, ref } from 'vue';
import * as Misskey from 'misskey-js'; import * as Misskey from 'misskey-js';
import * as Acct from 'misskey-js/built/acct'; import * as Acct from 'misskey-js/built/acct';
import XMessage from './messaging-room.message.vue'; import XMessage from './messaging-room.message.vue';
@ -65,9 +65,16 @@ import { i18n } from '@/i18n';
import { $i } from '@/account'; import { $i } from '@/account';
import { defaultStore } from '@/store'; import { defaultStore } from '@/store';
import { definePageMetadata } from '@/scripts/page-metadata'; import { definePageMetadata } from '@/scripts/page-metadata';
import { deviceKind } from '@/scripts/device-kind';
const isFriendly = $ref(localStorage.getItem('ui') === 'friendly'); const isFriendly = $ref(localStorage.getItem('ui') === 'friendly');
const MOBILE_THRESHOLD = 500;
const isMobile = ref(deviceKind === 'smartphone' || window.innerWidth <= MOBILE_THRESHOLD);
window.addEventListener('resize', () => {
isMobile.value = deviceKind === 'smartphone' || window.innerWidth <= MOBILE_THRESHOLD;
});
const props = defineProps<{ const props = defineProps<{
userAcct?: string; userAcct?: string;
groupId?: string; groupId?: string;
@ -348,6 +355,10 @@ definePageMetadata(computed(() => !fetching ? user ? {
bottom: calc(env(safe-area-inset-bottom, 0px) + 50px); bottom: calc(env(safe-area-inset-bottom, 0px) + 50px);
} }
&.friendly-not-mobile {
bottom: 0;
}
> .new-message { > .new-message {
width: 100%; width: 100%;
padding-bottom: 8px; padding-bottom: 8px;