merge upstream again

packages/frontend/src/ui/_common_/mobile-footer-menu.vue

@@ -77,14 +77,17 @@ watch(rootEl, () => {
 
 <style lang="scss" module>
 .root {
+	position: relative;
+	z-index: 1;
 	padding: 12px 12px max(12px, env(safe-area-inset-bottom, 0px)) 12px;
 	display: grid;
 	grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
 	grid-gap: 8px;
 	width: 100%;
 	box-sizing: border-box;
-	background: var(--MI_THEME-bg);
-	border-top: solid 0.5px var(--MI_THEME-divider);
+	background: var(--MI_THEME-navBg);
+	color: var(--MI_THEME-navFg);
+	box-shadow: 0px 0px 6px 6px #0000000f;
 }
 
 .item {
@@ -109,19 +112,17 @@ watch(rootEl, () => {
 	padding: 0;
 	aspect-ratio: 1;
 	width: 100%;
-	max-width: 50px;
+	max-width: 45px;
 	margin: auto;
 	align-content: center;
 	border-radius: 100%;
-	background: var(--MI_THEME-panel);
-	color: var(--MI_THEME-fg);
 
 	&:hover {
 		background: var(--MI_THEME-panelHighlight);
 	}
 
 	&:active {
-		background: hsl(from var(--MI_THEME-panel) h s calc(l - 2));
+		background: var(--MI_THEME-panelHighlight);
 	}
 }
 
@@ -131,14 +132,16 @@ watch(rootEl, () => {
 
 .itemIndicator {
 	position: absolute;
-	top: 0;
+	bottom: -4px;
 	left: 0;
+	right: 0;
 	color: var(--MI_THEME-indicator);
-	font-size: 16px;
+	font-size: 10px;
+	pointer-events: none;
 
 	&:has(.itemIndicateValueIcon) {
 		animation: none;
-		font-size: 12px;
+		font-size: 8px;
 	}
 }
 </style>

packages/frontend/src/ui/deck.vue

@@ -102,6 +102,7 @@ import XWidgetsColumn from '@/ui/deck/widgets-column.vue';
 import XMentionsColumn from '@/ui/deck/mentions-column.vue';
 import XDirectColumn from '@/ui/deck/direct-column.vue';
 import XRoleTimelineColumn from '@/ui/deck/role-timeline-column.vue';
+import XChatColumn from '@/ui/deck/chat-column.vue';
 import XFollowingColumn from '@/ui/deck/following-column.vue';
 import { mainRouter } from '@/router.js';
 import { columns, layout, columnTypes, switchProfileMenu, addColumn as addColumnToStore, deleteProfile as deleteProfile_ } from '@/deck.js';
@@ -120,6 +121,7 @@ const columnComponents = {
 	mentions: XMentionsColumn,
 	direct: XDirectColumn,
 	roleTimeline: XRoleTimelineColumn,
+	chat: XChatColumn,
 	following: XFollowingColumn,
 };
 

packages/frontend/src/ui/deck/chat-column.vue

@@ -0,0 +1,27 @@
+<!--
+SPDX-FileCopyrightText: syuilo and misskey-project
+SPDX-License-Identifier: AGPL-3.0-only
+-->
+
+<template>
+<XColumn :column="column" :isStacked="isStacked">
+	<template #header><i class="ti ti-messages" style="margin-right: 8px;"></i>{{ column.name || i18n.ts._deck._columns.chat }}</template>
+
+	<div style="padding: 8px;">
+		<MkChatHistories/>
+	</div>
+</XColumn>
+</template>
+
+<script lang="ts" setup>
+import { ref } from 'vue';
+import { i18n } from '../../i18n.js';
+import XColumn from './column.vue';
+import type { Column } from '@/deck.js';
+import MkChatHistories from '@/components/MkChatHistories.vue';
+
+defineProps<{
+	column: Column;
+	isStacked: boolean;
+}>();
+</script>