usbharu
/
misskey
mirror of https://github.com/misskey-dev/misskey.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

wip

This commit is contained in:
syuilo 2025-03-23 11:20:01 +09:00
parent 92f7532eb3
commit ff4568e1d6
5 changed files with 17 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
packages/frontend/src/components/MkPagination.vue
View File

@ -95,7 +95,6 @@ const props = withDefaults(defineProps<{
pagination: Paging; pagination: Paging;
disableAutoLoad?: boolean; disableAutoLoad?: boolean;
displayLimit?: number; displayLimit?: number;
scrollReversed?: boolean;
}>(), { }>(), {
displayLimit: 20, displayLimit: 20,
}); });
@ -347,7 +346,7 @@ const appearFetchMoreAhead = async (): Promise<void> => {
fetchMoreAppearTimeout(); fetchMoreAppearTimeout();
}; };
const isHead = (): boolean => isBackTop.value || (props.pagination.reversed && !props.scrollReversed ? isTailVisible : isHeadVisible)(rootEl.value!, TOLERANCE); const isHead = (): boolean => isBackTop.value || (props.pagination.reversed ? isTailVisible : isHeadVisible)(rootEl.value!, TOLERANCE);
watch(visibility, () => { watch(visibility, () => {
if (visibility.value === 'hidden') { if (visibility.value === 'hidden') {

1
packages/frontend/src/pages/chat/room.form.vue
View File

@ -233,7 +233,6 @@ onMounted(() => {
<style lang="scss" module> <style lang="scss" module>
.root { .root {
position: relative; position: relative;
border: solid 1px var(--MI_THEME-divider);
border-bottom: none; border-bottom: none;
border-radius: 14px 14px 0 0; border-radius: 14px 14px 0 0;
overflow: clip; overflow: clip;

37
packages/frontend/src/pages/chat/room.message.vue
View File

@ -1,6 +1,6 @@
<template> <template>
<div :class="[$style.root, { [$style.isMe]: isMe }]"> <div :class="[$style.root, { [$style.isMe]: isMe }]">
<MkAvatar :class="$style.avatar" :user="user" link :preview="false"/> <MkAvatar :class="$style.avatar" :user="user" :link="!isMe" :preview="false"/>
<div :class="$style.body"> <div :class="$style.body">
<MkFukidashi :class="$style.fukidashi" :tail="isMe ? 'right' : 'left'" :accented="isMe"> <MkFukidashi :class="$style.fukidashi" :tail="isMe ? 'right' : 'left'" :accented="isMe">
<div v-if="!message.isDeleted" :class="$style.content"> <div v-if="!message.isDeleted" :class="$style.content">
@ -17,13 +17,11 @@
</div> </div>
</MkFukidashi> </MkFukidashi>
<MkUrlPreview v-for="url in urls" :key="url" :url="url" style="margin: 8px 0;"/> <MkUrlPreview v-for="url in urls" :key="url" :url="url" style="margin: 8px 0;"/>
<div> <div :class="$style.footer">
<button class="_textButton" style="color: currentColor;" @click="showMenu"><i class="ti ti-dots-circle-horizontal"></i></button>
<MkTime :class="$style.time" :time="message.createdAt"/> <MkTime :class="$style.time" :time="message.createdAt"/>
</div> </div>
</div> </div>
<button v-if="isMe" :class="$style.delete" :title="i18n.ts.delete" @click="del">
<img src="/client-assets/remove.png" alt="Delete"/>
</button>
</div> </div>
</template> </template>
@ -71,12 +69,16 @@ function del(): void {
.content { .content {
color: var(--MI_THEME-fgOnAccent); color: var(--MI_THEME-fgOnAccent);
} }
.footer {
flex-direction: row-reverse;
}
} }
} }
.avatar { .avatar {
position: sticky; position: sticky;
top: calc(var(--stickyTop, 0px) + 16px); top: calc(16px + var(--MI-stickyTop, 0px));
display: block; display: block;
width: 54px; width: 54px;
height: 54px; height: 54px;
@ -93,26 +95,15 @@ function del(): void {
word-break: break-word; word-break: break-word;
} }
.delete { .footer {
position: absolute; display: flex;
top: 0; flex-direction: row;
right: 0; gap: 0.5em;
width: 24px; margin-top: 4px;
height: 24px; font-size: 75%;
padding: 0;
margin: 0;
border: none;
background: none;
cursor: pointer;
transition: all 0.1s ease;
&:hover {
transform: scale(1.1);
}
} }
.time { .time {
font-size: 75%;
opacity: 0.5; opacity: 0.5;
} }
</style> </style>

5
packages/frontend/src/pages/chat/room.vue
View File

@ -87,11 +87,6 @@ const room = ref<Misskey.entities.ChatRoom | null>(null);
const connection = ref<Misskey.ChannelConnection<Misskey.Channels['chat']> | null>(null); const connection = ref<Misskey.ChannelConnection<Misskey.Channels['chat']> | null>(null);
const showIndicator = ref(false); const showIndicator = ref(false);
watch([() => props.userId, () => props.roomId], () => {
if (connection.value) connection.value.dispose();
initialize();
});
async function initialize() { async function initialize() {
initializing.value = true; initializing.value = true;

4
packages/frontend/src/style.scss
View File

@ -335,13 +335,13 @@ rt {
._gaps_m { ._gaps_m {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 1.5em; gap: 21px;
} }
._gaps_s { ._gaps_s {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 0.75em; gap: 10px;
} }
._gaps { ._gaps {