mirror/cherrypick
1
1
Fork 0
mirror of https://github.com/kokonect-link/cherrypick synced 2024-11-28 06:48:36 +09:00
Code

Merge remote-branch 'misskey/develop'

Browse Source
This commit is contained in:
NoriDev 2023-05-30 16:36:37 +09:00
commit b3e3fa850e
7 changed files with 52 additions and 100 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
packages/frontend/src/components/MkMediaImage.vue
View File

@ -32,7 +32,6 @@
<div v-if="image.comment" :class="$style.indicator">ALT</div>
<div v-if="image.isSensitive" :class="$style.indicator" style="color: var(--warn);">NSFW</div>
</div>
<button v-tooltip="i18n.ts.hide" :class="$style.hide" class="_button" @click.stop.prevent="hide = true"><i class="ti ti-eye-off"></i></button>
<button :class="$style.menu" class="_button" @click.stop="showMenu"><i class="ti ti-dots"></i></button>
</template>
</div>
@ -79,9 +78,15 @@ watch(() => props.image, () => {
});
function showMenu(ev: MouseEvent) {
os.popupMenu([...(iAmModerator ? [{
text: i18n.ts.markAsSensitive,
os.popupMenu([{
text: i18n.ts.hide,
icon: 'ti ti-eye-off',
action: () => {
hide = true;
},
}, ...(iAmModerator ? [{
text: i18n.ts.markAsSensitive,
icon: 'ti ti-eye-exclamation',
action: () => {
os.apiWithDialog('drive/files/update', { fileId: props.image.id, isSensitive: true });
},
@ -122,21 +127,6 @@ function showMenu(ev: MouseEvent) {
background-size: 16px 16px;
}
.hide {
display: block;
position: absolute;
border-radius: 6px;
background-color: var(--accentedBg);
-webkit-backdrop-filter: var(--blur, blur(15px));
backdrop-filter: var(--blur, blur(15px));
color: var(--accent);
font-size: 0.8em;
padding: 6px 8px;
text-align: center;
top: 12px;
right: 12px;
}
.menu {
display: block;
position: absolute;
@ -148,8 +138,8 @@ function showMenu(ev: MouseEvent) {
font-size: 0.8em;
padding: 6px 8px;
text-align: center;
bottom: 12px;
right: 12px;
bottom: 10px;
right: 10px;
}
.imageContainer {
@ -166,12 +156,10 @@ function showMenu(ev: MouseEvent) {
.indicators {
display: inline-flex;
position: absolute;
top: 12px;
left: 12px;
text-align: center;
top: 10px;
left: 10px;
pointer-events: none;
opacity: .5;
font-size: 14px;
gap: 6px;
}
@ -182,7 +170,7 @@ function showMenu(ev: MouseEvent) {
color: var(--accentLighten);
display: inline-block;
font-weight: bold;
font-size: 12px;
padding: 2px 6px;
font-size: 0.8em;
padding: 2px 5px;
}
</style>

2
packages/frontend/src/components/MkPostFormAttaches.vue
View File

@ -93,7 +93,7 @@ function showFileMenu(file, ev: MouseEvent) {
action: () => { rename(file); },
}, {
text: file.isSensitive ? i18n.ts.unmarkAsSensitive : i18n.ts.markAsSensitive,
icon: file.isSensitive ? 'ti ti-eye-off' : 'ti ti-eye',
icon: file.isSensitive ? 'ti ti-eye-exclamation' : 'ti ti-eye',
action: () => { toggleSensitive(file); },
}, {
text: i18n.ts.describeFile,

1
packages/frontend/src/pages/settings/drive.vue
View File

@ -141,6 +141,7 @@ definePageMetadata({
<style lang="scss" module>
.meter {
height: 10px;
background: rgba(0, 0, 0, 0.1);
border-radius: 999px;
overflow: clip;

2
packages/frontend/src/scripts/get-drive-file-menu.ts
View File

@ -73,7 +73,7 @@ export function getDriveFileMenu(file: Misskey.entities.DriveFile) {
action: () => rename(file),
}, {
text: file.isSensitive ? i18n.ts.unmarkAsSensitive : i18n.ts.markAsSensitive,
icon: file.isSensitive ? 'ti ti-eye' : 'ti ti-eye-off',
icon: file.isSensitive ? 'ti ti-eye' : 'ti ti-eye-exclamation',
action: () => toggleSensitive(file),
}, {
text: i18n.ts.describeFile,

44
packages/frontend/src/ui/friendly.vue
View File

@ -1,5 +1,5 @@
<template>
<div :class="[$style.root, { [$style.withWallpaper]: wallpaper }]">
<div :class="$style.root">
<XSidebar v-if="!isMobile" :class="$style.sidebar"/>
<MkStickyContainer :class="$style.contents">
@ -12,8 +12,8 @@
</main>
</MkStickyContainer>
<div v-if="isDesktop" ref="widgetsEl" :class="$style.widgets">
<XWidgets :marginTop="'var(--margin)'" @mounted="attachSticky"/>
<div v-if="isDesktop" :class="$style.widgets">
<XWidgets/>
</div>
<button v-if="isMobile && !(mainRouter.currentRoute.value.name === 'messaging-room' || mainRouter.currentRoute.value.name === 'messaging-room-group')" :class="[$style.floatNavButton, {[$style.reduceAnimation]: !defaultStore.state.animation, [$style.showEl]: showEl }]" class="nav _button" @click="drawerMenuShowing = true" @touchstart="longTouchfloatNavStart" @touchend="longTouchfloatNavEnd"><CPAvatar :class="$style.floatNavButtonAvatar" :user="$i"/></button>
@ -93,11 +93,10 @@
import { defineAsyncComponent, provide, onMounted, onBeforeUnmount, computed, ref, watch, ComputedRef, inject, Ref } from 'vue';
import XCommon from './_common_/common.vue';
import { instanceName } from '@/config';
import { StickySidebar } from '@/scripts/sticky-sidebar';
import XDrawerMenu from '@/ui/friendly/navbar-for-mobile.vue';
import * as os from '@/os';
import { defaultStore } from '@/store';
import { navbarItemDef } from '@/navbar';
// import { navbarItemDef } from '@/navbar';
import { i18n } from '@/i18n';
import { $i, openAccountMenu as openAccountMenu_ } from '@/account';
import { mainRouter } from '@/router';
@ -132,7 +131,6 @@ let longTouchNavHome = $ref(false);
let longTouchfloatNav = $ref(false);
let pageMetadata = $ref<null | ComputedRef<PageMetadata>>();
const widgetsEl = $shallowRef<HTMLElement>();
const widgetsShowing = $ref(false);
const navFooter = $shallowRef<HTMLElement>();
@ -144,6 +142,7 @@ provideMetadataReceiver((info) => {
}
});
/*
const menuIndicated = computed(() => {
for (const def in navbarItemDef) {
if (def === 'notifications') continue; // 通知は下にボタンとして表示されてるから
@ -151,6 +150,7 @@ const menuIndicated = computed(() => {
}
return false;
});
*/
const drawerMenuShowing = ref(false);
@ -158,8 +158,6 @@ mainRouter.on('change', () => {
drawerMenuShowing.value = false;
});
document.documentElement.style.overflowY = 'scroll';
if (window.innerWidth > 1024) {
const tempUI = miLocalStorage.getItem('ui_temp');
if (tempUI) {
@ -239,15 +237,8 @@ const onContextmenu = (ev) => {
}], ev);
};
const attachSticky = (el) => {
const sticky = new StickySidebar(widgetsEl);
window.addEventListener('scroll', () => {
sticky.calc(window.scrollY);
}, { passive: true });
};
function top() {
window.scroll({ top: 0, behavior: 'smooth' });
// TODO
}
function queueUpdated(q: number): void {
@ -282,8 +273,6 @@ function longTouchfloatNavEnd() {
longTouchfloatNav = false;
}
const wallpaper = miLocalStorage.getItem('wallpaper') != null;
let navFooterHeight = $ref(0);
provide<Ref<number>>(CURRENT_STICKY_BOTTOM, $$(navFooterHeight));
@ -350,28 +339,31 @@ $float-button-size: 65px;
}
.root {
min-height: 100dvh;
height: 100dvh;
overflow: clip;
box-sizing: border-box;
display: flex;
}
.withWallpaper {
background: var(--wallpaperOverlay);
//backdrop-filter: var(--blur, blur(4px));
}
.sidebar {
border-right: solid 0.5px var(--divider);
}
.contents {
width: 100%;
flex: 1;
height: 100%;
min-width: 0;
overflow: auto;
overflow-y: scroll;
background: var(--bg);
}
.widgets {
padding: 0 var(--margin) calc(var(--margin) + env(safe-area-inset-bottom, 0px));
width: 350px;
height: 100%;
box-sizing: border-box;
overflow: auto;
padding: var(--margin) var(--margin) calc(var(--margin) + env(safe-area-inset-bottom, 0px));
border-left: solid 0.5px var(--divider);
background: var(--bg);

40
packages/frontend/src/ui/universal.vue
View File

@ -1,5 +1,5 @@
<template>
<div :class="[$style.root, { [$style.withWallpaper]: wallpaper }]">
<div :class="$style.root">
<XSidebar v-if="!isMobile" :class="$style.sidebar"/>
<MkStickyContainer :class="$style.contents">
@ -12,8 +12,8 @@
</main>
</MkStickyContainer>
<div v-if="isDesktop" ref="widgetsEl" :class="$style.widgets">
<XWidgets :marginTop="'var(--margin)'" @mounted="attachSticky"/>
<div v-if="isDesktop" :class="$style.widgets">
<XWidgets/>
</div>
<button v-if="!isDesktop && !isMobile" :class="$style.widgetButton" class="_button" @click="widgetsShowing = true"><i class="ti ti-apps"></i></button>
@ -87,7 +87,6 @@
import { defineAsyncComponent, provide, onMounted, computed, ref, ComputedRef, watch, inject, Ref } from 'vue';
import XCommon from './_common_/common.vue';
import { instanceName } from '@/config';
import { StickySidebar } from '@/scripts/sticky-sidebar';
import XDrawerMenu from '@/ui/_common_/navbar-for-mobile.vue';
import * as os from '@/os';
import { defaultStore } from '@/store';
@ -114,7 +113,6 @@ window.addEventListener('resize', () => {
});
let pageMetadata = $ref<null | ComputedRef<PageMetadata>>();
const widgetsEl = $shallowRef<HTMLElement>();
const widgetsShowing = $ref(false);
const navFooter = $shallowRef<HTMLElement>();
@ -140,8 +138,6 @@ mainRouter.on('change', () => {
drawerMenuShowing.value = false;
});
document.documentElement.style.overflowY = 'scroll';
if (window.innerWidth > 1024) {
const tempUI = miLocalStorage.getItem('ui_temp');
if (tempUI) {
@ -197,19 +193,10 @@ const onContextmenu = (ev) => {
}], ev);
};
const attachSticky = (el) => {
const sticky = new StickySidebar(widgetsEl);
window.addEventListener('scroll', () => {
sticky.calc(window.scrollY);
}, { passive: true });
};
function top() {
window.scroll({ top: 0, behavior: 'smooth' });
// TODO
}
const wallpaper = miLocalStorage.getItem('wallpaper') != null;
let navFooterHeight = $ref(0);
provide<Ref<number>>(CURRENT_STICKY_BOTTOM, $$(navFooterHeight));
@ -275,28 +262,31 @@ $widgets-hide-threshold: 1090px;
}
.root {
min-height: 100dvh;
height: 100dvh;
overflow: clip;
box-sizing: border-box;
display: flex;
}
.withWallpaper {
background: var(--wallpaperOverlay);
//backdrop-filter: var(--blur, blur(4px));
}
.sidebar {
border-right: solid 0.5px var(--divider);
}
.contents {
width: 100%;
flex: 1;
height: 100%;
min-width: 0;
overflow: auto;
overflow-y: scroll;
background: var(--bg);
}
.widgets {
padding: 0 var(--margin) calc(var(--margin) + env(safe-area-inset-bottom, 0px));
width: 350px;
height: 100%;
box-sizing: border-box;
overflow: auto;
padding: var(--margin) var(--margin) calc(var(--margin) + env(safe-area-inset-bottom, 0px));
border-left: solid 0.5px var(--divider);
background: var(--bg);

23
packages/frontend/src/ui/universal.widgets.vue
View File

@ -1,5 +1,5 @@
<template>
<div :class="$style.root" :style="{ paddingTop: marginTop }">
<div :class="$style.root">
<XWidgets :class="$style.widgets" :edit="editMode" :widgets="widgets" @addWidget="addWidget" @removeWidget="removeWidget" @updateWidget="updateWidget" @updateWidgets="updateWidgets" @exit="editMode = false"/>
<!-- <button v-if="editMode" class="_textButton" style="font-size: 0.9em;" @click="editMode = false"><i class="ti ti-check"></i> {{ i18n.ts.editWidgetsExit }}</button>
@ -12,7 +12,7 @@
let editMode = $ref(false);
</script>
<script lang="ts" setup>
import { onMounted } from 'vue';
import { } from 'vue';
import XWidgets from '@/components/MkWidgets.vue';
import { i18n } from '@/i18n';
import { defaultStore } from '@/store';
@ -22,28 +22,16 @@ const props = withDefaults(defineProps<{
// left = place: leftだけを表示
// right = rightとnullを表示
place?: 'left' | null | 'right';
marginTop?: string;
}>(), {
place: null,
marginTop: '0',
});
const emit = defineEmits<{
(ev: 'mounted', el?: Element): void;
}>();
let rootEl = $shallowRef<HTMLDivElement>();
const widgets = $computed(() => {
if (props.place === null) return defaultStore.reactiveState.widgets.value;
if (props.place === 'left') return defaultStore.reactiveState.widgets.value.filter(w => w.place === 'left');
return defaultStore.reactiveState.widgets.value.filter(w => w.place !== 'left');
});
onMounted(() => {
emit('mounted', rootEl);
});
function addWidget(widget) {
defaultStore.set('widgets', [{
...widget,
@ -84,13 +72,6 @@ function updateWidgets(thisWidgets) {
<style lang="scss" module>
.root {
position: sticky;
height: min-content;
box-sizing: border-box;
}
.widgets {
width: 300px;
}
.edit {