ui fix
This commit is contained in:
mattyatea
parent
7dd7c6ad4a
commit
6286e94f66
|
|
@ -10,7 +10,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<XNavFolder
|
||||
:class="[$style.navPathItem, { [$style.navCurrent]: folder == null }]"
|
||||
:parentFolder="folder"
|
||||
:selectedFiles="selectedFiles"
|
||||
:selectedFiles="selectedFiles"
|
||||
@move="move"
|
||||
@upload="upload"
|
||||
@removeFile="removeFile"
|
||||
|
|
@ -35,9 +35,9 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<span v-if="folder != null" :class="[$style.navPathItem, $style.navCurrent]">{{ folder.name }}</span>
|
||||
</div>
|
||||
<button v-if="!multiple" class="_button" :class="$style.navMenu" @click="filesSelect">複数選択モード</button>
|
||||
<span v-if="multiple && selectedFiles.length > 0" style="padding-right: 12px; margin-top: auto; margin-bottom: auto;opacity: 0.5;">
|
||||
({{ number(selectedFiles.length) }})
|
||||
</span>
|
||||
<span v-if="multiple && selectedFiles.length > 0" style="padding-right: 12px; margin-top: auto; margin-bottom: auto;opacity: 0.5;">
|
||||
({{ number(selectedFiles.length) }})
|
||||
</span>
|
||||
<button v-if="multiple" class="_button" :class="$style.navMenu" @click="filesSelect">複数選択モード解除</button>
|
||||
<button v-if="multiple && selectedFiles.length === 0" style="padding-right: 12px;" class="_button" @click="filesAllSelect">
|
||||
全選択
|
||||
|
|
@ -66,7 +66,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
:folder="f"
|
||||
:selectMode="select === 'folder'"
|
||||
:isSelected="selectedFolders.some(x => x.id === f.id)"
|
||||
:selectedFiles="selectedFiles"
|
||||
:selectedFiles="selectedFiles"
|
||||
@chosen="chooseFolder"
|
||||
@move="move"
|
||||
@upload="upload"
|
||||
|
|
@ -90,7 +90,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
:selectMode="select === 'file'"
|
||||
:SelectFiles="selectedFiles"
|
||||
:isSelected="selectedFiles.some(x => x.id === file.id)"
|
||||
@click.shift.left.exact="filesSelect"
|
||||
@click.shift.left.exact="filesSelect"
|
||||
@chosen="chooseFile"
|
||||
@dragstart="isDragSource = true"
|
||||
@dragend="isDragSource = false"
|
||||
|
|
@ -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;
|
||||
|
|
@ -525,7 +525,7 @@ function removeFolder(folderToRemove: Misskey.entities.DriveFolder | string) {
|
|||
function removeFile(file: Misskey.entities.DriveFile | string) {
|
||||
const fileId = typeof file === 'object' ? file.id : file;
|
||||
files.value = files.value.filter(f => f.id !== fileId);
|
||||
selectedFiles.value = selectedFiles.value.filter(f => f.id !== fileId);
|
||||
selectedFiles.value = selectedFiles.value.filter(f => f.id !== fileId);
|
||||
}
|
||||
|
||||
function appendFile(file: Misskey.entities.DriveFile) {
|
||||
|
|
@ -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 {
|
||||
|
|
|
|||
|
|
@ -53,7 +53,7 @@ export type Tab = {
|
|||
</script>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import {onMounted, onUnmounted, watch, nextTick, shallowRef, ref, computed} from 'vue';
|
||||
import { onMounted, onUnmounted, watch, nextTick, shallowRef, ref, computed } from 'vue';
|
||||
import { defaultStore } from '@/store.js';
|
||||
|
||||
const gamingType = computed(defaultStore.makeGetterSetter('gamingType'));
|
||||
|
|
@ -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,
|
||||
|
|
|
|||
|
|
@ -253,10 +253,10 @@ const headerActions = computed(() => {
|
|||
disabled: onlyFiles } : undefined, {
|
||||
type: 'switch',
|
||||
text: i18n.ts.withSensitive,
|
||||
ref: withSensitive,
|
||||
}, {
|
||||
type: 'switch',
|
||||
text: i18n.ts.fileAttachedOnly,
|
||||
ref: withSensitive,
|
||||
}, {
|
||||
type: 'switch',
|
||||
text: i18n.ts.fileAttachedOnly,
|
||||
|
||||
ref: onlyFiles,
|
||||
disabled: src.value === 'local' || src.value === 'social' ? withReplies : false,
|
||||
|
|
@ -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 a new issue