ui fix
This commit is contained in:
parent
7dd7c6ad4a
commit
6286e94f66
|
@ -133,7 +133,7 @@ import { defaultStore } from '@/store.js';
|
|||
import { i18n } from '@/i18n.js';
|
||||
import { uploadFile, uploads } from '@/scripts/upload.js';
|
||||
import { claimAchievement } from '@/scripts/achievements.js';
|
||||
import number from "@/filters/number.js";
|
||||
import number from '@/filters/number.js';
|
||||
|
||||
const props = withDefaults(defineProps<{
|
||||
initialFolder?: Misskey.entities.DriveFolder;
|
||||
|
@ -834,6 +834,7 @@ onBeforeUnmount(() => {
|
|||
font-size: 0.9em;
|
||||
box-shadow: 0 1px 0 var(--divider);
|
||||
user-select: none;
|
||||
height: 55px;
|
||||
}
|
||||
|
||||
.navPath {
|
||||
|
@ -841,6 +842,7 @@ onBeforeUnmount(() => {
|
|||
vertical-align: bottom;
|
||||
line-height: 42px;
|
||||
white-space: nowrap;
|
||||
margin: auto 0;
|
||||
}
|
||||
|
||||
.navPathItem {
|
||||
|
|
|
@ -232,6 +232,7 @@ onUnmounted(() => {
|
|||
|
||||
.tabIcon + .tabTitle {
|
||||
padding-left: 4px;
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.tabTitle {
|
||||
|
|
|
@ -12,7 +12,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<div v-else-if="!thin_ && narrow && !hideTitle" :class="$style.buttonsLeft"/>
|
||||
|
||||
<template v-if="metadata">
|
||||
<div v-if="!hideTitle" :class="$style.titleContainer" @click="top">
|
||||
<div v-if="!hideTitle && !hide" :class="$style.titleContainer" @click="top">
|
||||
<div v-if="metadata.avatar" :class="$style.titleAvatarContainer">
|
||||
<MkAvatar :class="$style.titleAvatar" :user="metadata.avatar" indicator/>
|
||||
</div>
|
||||
|
@ -56,6 +56,7 @@ const props = withDefaults(defineProps<{
|
|||
actions?: PageHeaderItem[] | null;
|
||||
thin?: boolean;
|
||||
displayMyAvatar?: boolean;
|
||||
hide?:boolean;
|
||||
}>(), {
|
||||
tabs: () => ([] as Tab[]),
|
||||
});
|
||||
|
@ -143,7 +144,7 @@ onUnmounted(() => {
|
|||
}
|
||||
|
||||
.upper {
|
||||
--height: 50px;
|
||||
--height: 55px;
|
||||
display: flex;
|
||||
gap: var(--margin);
|
||||
height: var(--height);
|
||||
|
|
|
@ -5,7 +5,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
|
||||
<template>
|
||||
<MkStickyContainer>
|
||||
<template #header><MkPageHeader v-model:tab="tab" :actions="headerActions" :tabs="headerTabs"/></template>
|
||||
<template #header><MkPageHeader v-model:tab="tab" :tabs="headerTabs" hide="true" :actions="headerActions"/></template>
|
||||
<MkSpacer :contentMax="800">
|
||||
<MkHorizontalSwipe v-model:tab="tab" :tabs="headerTabs">
|
||||
<div v-if="tab === 'all'" key="all">
|
||||
|
@ -31,6 +31,7 @@ import * as os from '@/os.js';
|
|||
import { i18n } from '@/i18n.js';
|
||||
import { definePageMetadata } from '@/scripts/page-metadata.js';
|
||||
import { notificationTypes } from '@/const.js';
|
||||
import { misskeyApi } from '@/scripts/misskey-api.js';
|
||||
|
||||
const tab = ref('all');
|
||||
const includeTypes = ref<string[] | null>(null);
|
||||
|
@ -67,19 +68,13 @@ function setFilter(ev) {
|
|||
os.popupMenu(items, ev.currentTarget ?? ev.target);
|
||||
}
|
||||
|
||||
const headerActions = computed(() => [tab.value === 'all' ? {
|
||||
const headerActions = computed(() => [{
|
||||
text: i18n.ts.filter,
|
||||
icon: 'ti ti-filter',
|
||||
highlighted: includeTypes.value != null,
|
||||
handler: setFilter,
|
||||
} : undefined, tab.value === 'all' ? {
|
||||
text: i18n.ts.markAllAsRead,
|
||||
icon: 'ti ti-check',
|
||||
handler: () => {
|
||||
os.apiWithDialog('notifications/mark-all-as-read');
|
||||
},
|
||||
} : undefined].filter(x => x !== undefined));
|
||||
|
||||
} ].filter(x => x !== undefined));
|
||||
misskeyApi('notifications/mark-all-as-read');
|
||||
const headerTabs = computed(() => [{
|
||||
key: 'all',
|
||||
title: i18n.ts.all,
|
||||
|
|
|
@ -280,27 +280,27 @@ const headerTabs = computed(() => [...(defaultStore.reactiveState.pinnedUserList
|
|||
key: 'list:' + l.id,
|
||||
title: l.name,
|
||||
icon: 'ti ti-star',
|
||||
iconOnly: true,
|
||||
iconOnly: false,
|
||||
}))), {
|
||||
key: 'home',
|
||||
title: i18n.ts._timelines.home,
|
||||
icon: 'ti ti-home',
|
||||
iconOnly: true,
|
||||
iconOnly: false,
|
||||
}, ...(isLocalTimelineAvailable ? [{
|
||||
key: 'local',
|
||||
title: i18n.ts._timelines.local,
|
||||
icon: 'ti ti-planet',
|
||||
iconOnly: true,
|
||||
iconOnly: false,
|
||||
}, ...(isShowMediaTimeline.value ? [{
|
||||
key: 'media',
|
||||
title: i18n.ts._timelines.media,
|
||||
icon: 'ti ti-photo',
|
||||
iconOnly: true,
|
||||
iconOnly: false,
|
||||
}] : []), {
|
||||
key: 'social',
|
||||
title: i18n.ts._timelines.social,
|
||||
icon: 'ti ti-universe',
|
||||
iconOnly: true,
|
||||
iconOnly: false,
|
||||
}] : []), ...(remoteLocalTimelineEnable1.value ? [{
|
||||
key: 'custom-timeline-1',
|
||||
title: defaultStore.state.remoteLocalTimelineName1,
|
||||
|
@ -330,7 +330,7 @@ const headerTabs = computed(() => [...(defaultStore.reactiveState.pinnedUserList
|
|||
key: 'global',
|
||||
title: i18n.ts._timelines.global,
|
||||
icon: 'ti ti-whirl',
|
||||
iconOnly: true,
|
||||
iconOnly: false,
|
||||
}] : []), {
|
||||
icon: 'ti ti-list',
|
||||
title: i18n.ts.lists,
|
||||
|
|
Loading…
Reference in New Issue