Merge branch 'develop' into swn

This commit is contained in:
tamaina
2021-10-19 15:48:10 +09:00
93 changed files with 1347 additions and 746 deletions

View File

@@ -22,7 +22,6 @@ export default defineComponent({
}
},
render() {
const label = this.$slots.desc();
let options = this.$slots.default();
// なぜかFragmentになることがあるため
@@ -31,7 +30,6 @@ export default defineComponent({
return h('div', {
class: 'novjtcto'
}, [
h('div', { class: 'label' }, label),
...options.map(option => h(MkRadio, {
key: option.key,
value: option.props.value,
@@ -45,16 +43,6 @@ export default defineComponent({
<style lang="scss">
.novjtcto {
> .label {
font-size: 0.85em;
padding: 0 0 8px 12px;
user-select: none;
&:empty {
display: none;
}
}
&:first-child {
margin-top: 0;
}

View File

@@ -33,10 +33,16 @@ export default defineComponent({
onMounted(() => {
ro = new ResizeObserver((entries) => {
/* iOSが対応していない
adjust({
width: entries[0].borderBoxSize[0].inlineSize,
height: entries[0].borderBoxSize[0].blockSize,
});
*/
adjust({
width: root.value.offsetWidth,
height: root.value.offsetHeight,
});
});
ro.observe(root.value);

View File

@@ -10,7 +10,7 @@
</span>
<button class="_button" @click="$refs.modal.close()"><i class="fas fa-times"></i></button>
</div>
<div class="body _flat_">
<div class="body _fitSide_">
<keep-alive>
<component :is="component" v-bind="props" :ref="changePage"/>
</keep-alive>

View File

@@ -16,7 +16,7 @@
<template #headerLeft>
<button v-if="history.length > 0" class="_button" @click="back()" v-tooltip="$ts.goBack"><i class="fas fa-arrow-left"></i></button>
</template>
<div class="yrolvcoq _flat_">
<div class="yrolvcoq _fitSide_">
<component :is="component" v-bind="props" :ref="changePage"/>
</div>
</XWindow>

View File

@@ -35,8 +35,8 @@ export default defineComponent({
> button {
flex: 1;
padding: 15px 12px 12px 12px;
border-bottom: solid 3px transparent;
padding: 10px 8px;
border-radius: var(--radius);
&:disabled {
opacity: 1 !important;
@@ -45,11 +45,16 @@ export default defineComponent({
&.active {
color: var(--accent);
border-bottom-color: var(--accent);
background: var(--accentedBg);
}
&:not(.active):hover {
color: var(--fgHighlighted);
background: var(--panelHighlight);
}
&:not(:first-child) {
margin-left: 8px;
}
> .icon {
@@ -61,7 +66,7 @@ export default defineComponent({
font-size: 80%;
> button {
padding: 11px 8px 8px 8px;
padding: 11px 8px;
}
}
}

View File

@@ -154,7 +154,7 @@ export default defineComponent({
}
}
._flat_ .ssazuxis {
._fitSide_ .ssazuxis {
> header {
padding: 0 16px;
}

View File

@@ -43,7 +43,7 @@ export default defineComponent({
}
}
._flat_ .fpezltsf {
._fitSide_ .fpezltsf {
border-radius: 0;
}
</style>

View File

@@ -382,7 +382,7 @@ export default defineComponent({
<style lang="scss" scoped>
.window-enter-active, .window-leave-active {
transition: opacity 0.3s, transform 0.3s !important;
transition: opacity 0.2s, transform 0.2s !important;
}
.window-enter-from, .window-leave-to {
pointer-events: none;

View File

@@ -65,13 +65,18 @@
</div>
<div v-else-if="tab === 'search'">
<div class="_isolated">
<MkInput v-model="query" :debounce="true" type="search">
<MkInput v-model="searchQuery" :debounce="true" type="search">
<template #prefix><i class="fas fa-search"></i></template>
<template #label>{{ $ts.searchUser }}</template>
</MkInput>
<MkRadios v-model="searchOrigin">
<option value="local">{{ $ts.local }}</option>
<option value="remote">{{ $ts.remote }}</option>
<option value="both">{{ $ts.both }}</option>
</MkRadios>
</div>
<XUserList v-if="query" class="_gap" :pagination="searchPagination" ref="search"/>
<XUserList v-if="searchQuery" class="_gap" :pagination="searchPagination" ref="search"/>
</div>
</div>
</MkSpacer>
@@ -83,6 +88,7 @@ import { computed, defineComponent } from 'vue';
import XUserList from '@client/components/user-list.vue';
import MkFolder from '@client/components/ui/folder.vue';
import MkInput from '@client/components/form/input.vue';
import MkRadios from '@client/components/form/radios.vue';
import number from '@client/filters/number';
import * as os from '@client/os';
import * as symbols from '@client/symbols';
@@ -92,6 +98,7 @@ export default defineComponent({
XUserList,
MkFolder,
MkInput,
MkRadios,
},
props: {
@@ -158,14 +165,16 @@ export default defineComponent({
searchPagination: {
endpoint: 'users/search',
limit: 10,
params: computed(() => (this.query && this.query !== '') ? {
query: this.query
params: computed(() => (this.searchQuery && this.searchQuery !== '') ? {
query: this.searchQuery,
origin: this.searchOrigin,
} : null)
},
tagsLocal: [],
tagsRemote: [],
stats: null,
query: null,
searchQuery: null,
searchOrigin: 'combined',
num: number,
};
},

View File

@@ -302,7 +302,7 @@ export default defineComponent({
> .text {
&, ::v-deep(*) {
color: #fff !important;
color: var(--fgOnAccent) !important;
}
}
}

View File

@@ -2,33 +2,35 @@
<div>
<MkHeader :info="header"/>
<!-- TODO: MkHeaderに統合 -->
<MkTab v-model="tab" v-if="$i">
<option value="featured"><i class="fas fa-fire-alt"></i> {{ $ts._pages.featured }}</option>
<option value="my"><i class="fas fa-edit"></i> {{ $ts._pages.my }}</option>
<option value="liked"><i class="fas fa-heart"></i> {{ $ts._pages.liked }}</option>
</MkTab>
<MkSpacer>
<!-- TODO: MkHeaderに統合 -->
<MkTab v-model="tab" v-if="$i">
<option value="featured"><i class="fas fa-fire-alt"></i> {{ $ts._pages.featured }}</option>
<option value="my"><i class="fas fa-edit"></i> {{ $ts._pages.my }}</option>
<option value="liked"><i class="fas fa-heart"></i> {{ $ts._pages.liked }}</option>
</MkTab>
<div class="_section">
<div class="rknalgpo _content" v-if="tab === 'featured'">
<MkPagination :pagination="featuredPagesPagination" #default="{items}">
<MkPagePreview v-for="page in items" class="ckltabjg" :page="page" :key="page.id"/>
</MkPagination>
</div>
<div class="_section">
<div class="rknalgpo _content" v-if="tab === 'featured'">
<MkPagination :pagination="featuredPagesPagination" #default="{items}">
<MkPagePreview v-for="page in items" class="ckltabjg" :page="page" :key="page.id"/>
</MkPagination>
</div>
<div class="rknalgpo _content my" v-if="tab === 'my'">
<MkButton class="new" @click="create()"><i class="fas fa-plus"></i></MkButton>
<MkPagination :pagination="myPagesPagination" #default="{items}">
<MkPagePreview v-for="page in items" class="ckltabjg" :page="page" :key="page.id"/>
</MkPagination>
</div>
<div class="rknalgpo _content my" v-if="tab === 'my'">
<MkButton class="new" @click="create()"><i class="fas fa-plus"></i></MkButton>
<MkPagination :pagination="myPagesPagination" #default="{items}">
<MkPagePreview v-for="page in items" class="ckltabjg" :page="page" :key="page.id"/>
</MkPagination>
</div>
<div class="rknalgpo _content" v-if="tab === 'liked'">
<MkPagination :pagination="likedPagesPagination" #default="{items}">
<MkPagePreview v-for="like in items" class="ckltabjg" :page="like.page" :key="like.page.id"/>
</MkPagination>
<div class="rknalgpo _content" v-if="tab === 'liked'">
<MkPagination :pagination="likedPagesPagination" #default="{items}">
<MkPagePreview v-for="like in items" class="ckltabjg" :page="like.page" :key="like.page.id"/>
</MkPagination>
</div>
</div>
</div>
</MkSpacer>
</div>
</template>

View File

@@ -5,6 +5,10 @@
<FormSwitch v-model="autoAcceptFollowed" :disabled="!isLocked" @update:modelValue="save()">{{ $ts.autoAcceptFollowed }}</FormSwitch>
<template #caption>{{ $ts.lockedAccountInfo }}</template>
</FormGroup>
<FormSwitch v-model="publicReactions" @update:modelValue="save()">
{{ $ts.makeReactionsPublic }}
<template #desc>{{ $ts.makeReactionsPublicDescription }}</template>
</FormSwitch>
<FormSwitch v-model="hideOnlineStatus" @update:modelValue="save()">
{{ $ts.hideOnlineStatus }}
<template #desc>{{ $ts.hideOnlineStatusDescription }}</template>
@@ -64,6 +68,7 @@ export default defineComponent({
noCrawle: false,
isExplorable: false,
hideOnlineStatus: false,
publicReactions: false,
}
},
@@ -80,6 +85,7 @@ export default defineComponent({
this.noCrawle = this.$i.noCrawle;
this.isExplorable = this.$i.isExplorable;
this.hideOnlineStatus = this.$i.hideOnlineStatus;
this.publicReactions = this.$i.publicReactions;
},
mounted() {
@@ -94,6 +100,7 @@ export default defineComponent({
noCrawle: !!this.noCrawle,
isExplorable: !!this.isExplorable,
hideOnlineStatus: !!this.hideOnlineStatus,
publicReactions: !!this.publicReactions,
});
}
}

View File

@@ -10,13 +10,13 @@
</optgroup>
</FormSelect>
<template v-if="selectedTheme">
<FormInput readonly :value="selectedTheme.author">
<FormInput readonly :modelValue="selectedTheme.author">
<span>{{ $ts.author }}</span>
</FormInput>
<FormTextarea readonly :value="selectedTheme.desc" v-if="selectedTheme.desc">
<FormTextarea readonly :modelValue="selectedTheme.desc" v-if="selectedTheme.desc">
<span>{{ $ts._theme.description }}</span>
</FormTextarea>
<FormTextarea readonly tall :value="selectedThemeCode">
<FormTextarea readonly tall :modelValue="selectedThemeCode">
<span>{{ $ts._theme.code }}</span>
<template #desc><button @click="copyThemeCode()" class="_textButton">{{ $ts.copy }}</button></template>
</FormTextarea>
@@ -28,12 +28,12 @@
<script lang="ts">
import { defineComponent } from 'vue';
import * as JSON5 from 'json5';
import FormTextarea from '@client/components/form/textarea.vue';
import FormSelect from '@client/components/form/select.vue';
import FormRadios from '@client/components/form/radios.vue';
import FormTextarea from '@client/components/debobigego/textarea.vue';
import FormSelect from '@client/components/debobigego/select.vue';
import FormRadios from '@client/components/debobigego/radios.vue';
import FormBase from '@client/components/debobigego/base.vue';
import FormGroup from '@client/components/debobigego/group.vue';
import FormInput from '@client/components/form/input.vue';
import FormInput from '@client/components/debobigego/input.vue';
import FormButton from '@client/components/debobigego/button.vue';
import { Theme, builtinThemes } from '@client/scripts/theme';
import copyToClipboard from '@client/scripts/copy-to-clipboard';

View File

@@ -12,7 +12,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import MkPagination from '@client/components/ui/pagination.vue';
import { userPage, acct } from '@client/filters/user';
export default defineComponent({
components: {
@@ -43,12 +42,6 @@ export default defineComponent({
this.$refs.list.reload();
}
},
methods: {
userPage,
acct
}
});
</script>

View File

@@ -12,7 +12,6 @@
import { defineComponent } from 'vue';
import MkUserInfo from '@client/components/user-info.vue';
import MkPagination from '@client/components/ui/pagination.vue';
import { userPage, acct } from '@client/filters/user';
export default defineComponent({
components: {
@@ -51,12 +50,6 @@ export default defineComponent({
user() {
this.$refs.list.reload();
}
},
methods: {
userPage,
acct
}
});
</script>

View File

@@ -12,7 +12,6 @@
import { defineComponent } from 'vue';
import MkGalleryPostPreview from '@client/components/gallery-post-preview.vue';
import MkPagination from '@client/components/ui/pagination.vue';
import { userPage, acct } from '@client/filters/user';
export default defineComponent({
components: {
@@ -43,12 +42,6 @@ export default defineComponent({
user() {
this.$refs.list.reload();
}
},
methods: {
userPage,
acct
}
});
</script>

View File

@@ -1,6 +1,6 @@
<template>
<div class="yrzkoczt" v-sticky-container>
<MkTab v-model="with_" class="_gap tab">
<MkTab v-model="with_" class="tab">
<option :value="null">{{ $ts.notes }}</option>
<option value="replies">{{ $ts.notesAndReplies }}</option>
<option value="files">{{ $ts.withFiles }}</option>
@@ -60,7 +60,16 @@ export default defineComponent({
<style lang="scss" scoped>
.yrzkoczt {
> .tab {
margin: calc(var(--margin) / 2) 0;
padding: calc(var(--margin) / 2) 0;
background: var(--bg);
}
}
._fitSide_ .yrzkoczt {
> .tab {
padding-left: var(--margin);
padding-right: var(--margin);
}
}
</style>

View File

@@ -181,6 +181,7 @@
</template>
<XFollowList v-else-if="page === 'following'" type="following" :user="user" class="_content _gap"/>
<XFollowList v-else-if="page === 'followers'" type="followers" :user="user" class="_content _gap"/>
<XReactions v-else-if="page === 'reactions'" :user="user" class="_gap"/>
<XClips v-else-if="page === 'clips'" :user="user" class="_gap"/>
<XPages v-else-if="page === 'pages'" :user="user" class="_gap"/>
<XGallery v-else-if="page === 'gallery'" :user="user" class="_gap"/>
@@ -223,6 +224,7 @@ export default defineComponent({
MkTab,
MkInfo,
XFollowList: defineAsyncComponent(() => import('./follow-list.vue')),
XReactions: defineAsyncComponent(() => import('./reactions.vue')),
XClips: defineAsyncComponent(() => import('./clips.vue')),
XPages: defineAsyncComponent(() => import('./pages.vue')),
XGallery: defineAsyncComponent(() => import('./gallery.vue')),
@@ -268,7 +270,12 @@ export default defineComponent({
title: this.$ts.overview,
icon: 'fas fa-home',
onClick: () => { this.$router.push('/@' + getAcct(this.user)); },
}, {
}, ...(this.$i && (this.$i.id === this.user.id)) || this.user.publicReactions ? [{
active: this.page === 'reactions',
title: this.$ts.reaction,
icon: 'fas fa-laugh',
onClick: () => { this.$router.push('/@' + getAcct(this.user) + '/reactions'); },
}] : [], {
active: this.page === 'clips',
title: this.$ts.clips,
icon: 'fas fa-paperclip',
@@ -827,7 +834,7 @@ export default defineComponent({
}
}
._flat_ .ftskorzw.narrow {
._fitSide_ .ftskorzw.narrow {
> .profile {
> .warn {
margin: 0;

View File

@@ -10,7 +10,6 @@
import { defineComponent } from 'vue';
import MkPagePreview from '@client/components/page-preview.vue';
import MkPagination from '@client/components/ui/pagination.vue';
import { userPage, acct } from '@client/filters/user';
export default defineComponent({
components: {
@@ -41,12 +40,6 @@ export default defineComponent({
user() {
this.$refs.list.reload();
}
},
methods: {
userPage,
acct
}
});
</script>

View File

@@ -0,0 +1,81 @@
<template>
<div>
<MkPagination :pagination="pagination" #default="{items}" ref="list">
<div v-for="item in items" :key="item.id" :to="`/clips/${item.id}`" class="item _panel _gap afdcfbfb">
<div class="header">
<MkAvatar class="avatar" :user="user"/>
<MkReactionIcon class="reaction" :reaction="item.type" :custom-emojis="item.note.emojis" :no-style="true"/>
<MkTime :time="item.createdAt" class="createdAt"/>
</div>
<MkNote :note="item.note" @update:note="updated(note, $event)" :key="item.id"/>
</div>
</MkPagination>
</div>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import MkPagination from '@client/components/ui/pagination.vue';
import MkNote from '@client/components/note.vue';
import MkReactionIcon from '@client/components/reaction-icon.vue';
export default defineComponent({
components: {
MkPagination,
MkNote,
MkReactionIcon,
},
props: {
user: {
type: Object,
required: true
},
},
data() {
return {
pagination: {
endpoint: 'users/reactions',
limit: 20,
params: {
userId: this.user.id,
}
},
};
},
watch: {
user() {
this.$refs.list.reload();
}
},
});
</script>
<style lang="scss" scoped>
.afdcfbfb {
> .header {
display: flex;
align-items: center;
padding: 8px 16px;
margin-bottom: 8px;
border-bottom: solid 2px var(--divider);
> .avatar {
width: 24px;
height: 24px;
margin-right: 8px;
}
> .reaction {
width: 32px;
height: 32px;
}
> .createdAt {
margin-left: auto;
}
}
}
</style>

View File

@@ -20,6 +20,7 @@ export const builtinThemes = [
require('@client/themes/l-apricot.json5'),
require('@client/themes/l-rainy.json5'),
require('@client/themes/l-vivid.json5'),
require('@client/themes/l-sushi.json5'),
require('@client/themes/d-dark.json5'),
require('@client/themes/d-persimmon.json5'),

View File

@@ -380,7 +380,7 @@ hr {
}
}
._flat_ {
._fitSide_ {
--root-margin: 0px;
--baseContentWidth: 100%;
--panelBorder: none;

View File

@@ -0,0 +1,18 @@
{
id: '213273e5-7d20-d5f0-6e36-1b6a4f67115c',
name: 'Mi Sushi Light',
author: 'syuilo',
base: 'light',
props: {
accent: '#e36749',
bg: '#f0eee9',
fg: '#5f5f5f',
renote: '@accent',
link: '@accent',
mention: '@accent',
hashtag: '#229e82',
},
}

View File

@@ -3,7 +3,7 @@
<header class="header" @contextmenu.prevent.stop="onContextmenu">
<MkHeader class="title" :info="pageInfo" :center="false"/>
</header>
<component :is="component" v-bind="props" :ref="changePage" class="body _flat_"/>
<component :is="component" v-bind="props" :ref="changePage" class="body _fitSide_"/>
</div>
</template>

View File

@@ -7,7 +7,7 @@
</template>
</template>
<router-view v-slot="{ Component }" class="_flat_">
<router-view v-slot="{ Component }" class="_fitSide_">
<transition>
<keep-alive :include="['timeline']">
<component :is="Component" :ref="changePage" @contextmenu.stop="onContextmenu"/>

View File

@@ -29,7 +29,7 @@
<MkAvatar :user="$i" class="avatar"/><MkAcct class="acct" :user="$i"/>
</button>
<div class="post" @click="post">
<MkButton class="button" primary full rounded>
<MkButton class="button" gradate full rounded>
<i class="fas fa-pencil-alt fa-fw"></i>
</MkButton>
</div>

View File

@@ -13,7 +13,7 @@
</template>
<main class="main" @contextmenu.stop="onContextmenu" :style="{ background: pageInfo?.bg }">
<div class="content" :class="{ _flat_: !fullView }">
<div class="content" :class="{ _fitSide_: !fullView }">
<router-view v-slot="{ Component }">
<transition :name="$store.state.animation ? 'page' : ''" mode="out-in" @enter="onTransition">
<keep-alive :include="['timeline']">

View File

@@ -3,7 +3,7 @@
<template #header><i class="fas fa-bell"></i>{{ $ts.notifications }}</template>
<template #func><button @click="configure()" class="_button"><i class="fas fa-cog"></i></button></template>
<div class="_flat_">
<div class="_fitSide_">
<XNotifications :include-types="props.includingTypes"/>
</div>
</MkContainer>