worldcone/cherrypick
2
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

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>
</MkPagination>
</div>
<footer :class="{friendly: isFriendly }">
<footer :class="{ friendly: isFriendly, 'friendly-not-mobile': !isMobile }">
<div v-if="typers.length > 0" class="typers">
<I18n :src="i18n.ts.typingUsers" text-tag="span" class="users">
<template #users>
@ -50,7 +50,7 @@
</template>
<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 Acct from 'misskey-js/built/acct';
import XMessage from './messaging-room.message.vue';
@ -65,9 +65,16 @@ import { i18n } from '@/i18n';
import { $i } from '@/account';
import { defaultStore } from '@/store';
import { definePageMetadata } from '@/scripts/page-metadata';
import { deviceKind } from '@/scripts/device-kind';
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<{
userAcct?: string;
groupId?: string;
@ -348,6 +355,10 @@ definePageMetadata(computed(() => !fetching ? user ? {
bottom: calc(env(safe-area-inset-bottom, 0px) + 50px);
}
&.friendly-not-mobile {
bottom: 0;
}
> .new-message {
width: 100%;
padding-bottom: 8px;