diff --git a/src/client/components/error.vue b/src/client/components/error.vue
index f4698247b2..7446a7cb5d 100644
--- a/src/client/components/error.vue
+++ b/src/client/components/error.vue
@@ -27,8 +27,6 @@ export default Vue.extend({
<style lang="scss" scoped>
.mjndxjcg {
- max-width: 350px;
- margin: 0 auto;
padding: 32px;
text-align: center;
diff --git a/src/client/components/index.ts b/src/client/components/index.ts
index 9e95fba873..87547599a9 100644
--- a/src/client/components/index.ts
+++ b/src/client/components/index.ts
@@ -9,7 +9,6 @@ import ellipsis from './ellipsis.vue';
import time from './time.vue';
import url from './url.vue';
import loading from './loading.vue';
-import SequentialEntrance from './sequential-entrance.vue';
import error from './error.vue';
import streamIndicator from './stream-indicator.vue';
@@ -23,5 +22,4 @@ Vue.component('mk-time', time);
Vue.component('mk-url', url);
Vue.component('mk-loading', loading);
Vue.component('mk-error', error);
-Vue.component('sequential-entrance', SequentialEntrance);
Vue.component('stream-indicator', streamIndicator);
diff --git a/src/client/components/menu.vue b/src/client/components/menu.vue
index 6fee809c40..74e9a29ccf 100644
--- a/src/client/components/menu.vue
+++ b/src/client/components/menu.vue
@@ -1,6 +1,6 @@
<template>
<x-popup :source="source" :no-center="noCenter" :fixed="fixed" :width="width" ref="popup" @closed="() => { $emit('closed'); destroyDom(); }" v-hotkey.global="keymap">
- <sequential-entrance class="rrevdjwt" :class="{ left: align === 'left' }" :delay="15" :direction="direction" ref="items">
+ <div class="rrevdjwt" :class="{ left: align === 'left' }" ref="items">
<template v-for="(item, i) in items.filter(item => item !== undefined)">
<div v-if="item === null" class="divider" :key="i"></div>
<span v-else-if="item.type === 'label'" class="label item" :key="i">
@@ -28,7 +28,7 @@
<i v-if="item.indicate"><fa :icon="faCircle"/></i>
</button>
</template>
- </sequential-entrance>
+ </div>
</x-popup>
</template>
@@ -91,7 +91,7 @@ export default Vue.extend({
mounted() {
if (this.viaKeyboard) {
this.$nextTick(() => {
- focusNext(this.$refs.items.$slots.default[0].elm, true);
+ focusNext(this.$refs.items.children[0], true);
});
}
},
diff --git a/src/client/components/sequential-entrance.vue b/src/client/components/sequential-entrance.vue
deleted file mode 100644
index 50113cff1c..0000000000
--- a/src/client/components/sequential-entrance.vue
+++ /dev/null
@@ -1,40 +0,0 @@
-<template>
-<transition-group v-if="$store.state.device.animation"
- class="uupnnhew"
- name="staggered"
- tag="div"
- appear
->
- <slot></slot>
-</transition-group>
-<div v-else>
- <slot></slot>
-</div>
-</template>
-
-<script lang="ts">
-import Vue from 'vue';
-
-export default Vue.extend({
- methods: {
- focus() {
- this.$slots.default[0].elm.focus();
- }
- },
-});
-</script>
-
-<style lang="scss">
-.uupnnhew {
- > .staggered-enter {
- opacity: 0;
- transform: translateY(-64px);
- }
-
- @for $i from 1 through 30 {
- > .staggered-enter-active:nth-child(#{$i}) {
- transition: transform 0.7s cubic-bezier(0.23, 1, 0.32, 1) (15ms * ($i - 1)), opacity 0.7s cubic-bezier(0.23, 1, 0.32, 1) (15ms * ($i - 1));
- }
- }
-}
-</style>
diff --git a/src/client/components/ui/pagination.vue b/src/client/components/ui/pagination.vue
index 7f04b35de1..e888b7420c 100644
--- a/src/client/components/ui/pagination.vue
+++ b/src/client/components/ui/pagination.vue
@@ -1,5 +1,5 @@
<template>
-<sequential-entrance class="cxiknjgy" :class="{ autoMargin }">
+<div class="cxiknjgy" :class="{ autoMargin }">
<slot :items="items"></slot>
<div class="empty" v-if="empty" key="_empty_">
<slot name="empty"></slot>
@@ -10,7 +10,7 @@
<template v-if="moreFetching"><mk-loading inline/></template>
</mk-button>
</div>
-</sequential-entrance>
+</div>
</template>
<script lang="ts">
diff --git a/src/client/components/users-dialog.vue b/src/client/components/users-dialog.vue
index a70b3c2d13..9d0c5e4251 100644
--- a/src/client/components/users-dialog.vue
+++ b/src/client/components/users-dialog.vue
@@ -6,15 +6,15 @@
<button class="_button" @click="close()"><fa :icon="faTimes"/></button>
</div>
- <sequential-entrance class="users">
- <router-link v-for="(item, i) in items" class="user" :key="item.id" :to="extract ? extract(item) : item | userPage">
+ <div class="users">
+ <router-link v-for="item in items" class="user" :key="item.id" :to="extract ? extract(item) : item | userPage">
<mk-avatar :user="extract ? extract(item) : item" class="avatar" :disable-link="true"/>
<div class="body">
<mk-user-name :user="extract ? extract(item) : item" class="name"/>
<mk-acct :user="extract ? extract(item) : item" class="acct"/>
</div>
</router-link>
- </sequential-entrance>
+ </div>
<button class="more _button" v-if="more" @click="fetchMore" :disabled="moreFetching">
<template v-if="!moreFetching">{{ $t('loadMore') }}</template>
diff --git a/src/client/components/visibility-chooser.vue b/src/client/components/visibility-chooser.vue
index 28413fd837..dc7b41e286 100644
--- a/src/client/components/visibility-chooser.vue
+++ b/src/client/components/visibility-chooser.vue
@@ -1,6 +1,6 @@
<template>
<x-popup :source="source" ref="popup" @closed="() => { $emit('closed'); destroyDom(); }">
- <sequential-entrance class="gqyayizv" :delay="30">
+ <div class="gqyayizv">
<button class="_button" @click="choose('public')" :class="{ active: v == 'public' }" data-index="1" key="public">
<div><fa :icon="faGlobe"/></div>
<div>
@@ -29,7 +29,7 @@
<span>{{ $t('_visibility.specifiedDescription') }}</span>
</div>
</button>
- </sequential-entrance>
+ </div>
</x-popup>
</template>
diff --git a/src/client/pages/instance/queue.queue.vue b/src/client/pages/instance/queue.queue.vue
index 710f4ec099..7f0fc7d2bc 100644
--- a/src/client/pages/instance/queue.queue.vue
+++ b/src/client/pages/instance/queue.queue.vue
@@ -11,12 +11,12 @@
<canvas ref="chart"></canvas>
</div>
<div class="_content" style="max-height: 180px; overflow: auto;">
- <sequential-entrance :delay="15" v-if="jobs.length > 0">
- <div v-for="(job, i) in jobs" :key="job[0]">
+ <div v-if="jobs.length > 0">
+ <div v-for="job in jobs" :key="job[0]">
<span>{{ job[0] }}</span>
<span style="margin-left: 8px; opacity: 0.7;">({{ job[1] | number }} jobs)</span>
</div>
- </sequential-entrance>
+ </div>
<span v-else style="opacity: 0.5;">{{ $t('noJobs') }}</span>
</div>
</section>
diff --git a/src/client/pages/messaging.vue b/src/client/pages/messaging.vue
index bc85e7a56b..2179115dea 100644
--- a/src/client/pages/messaging.vue
+++ b/src/client/pages/messaging.vue
@@ -5,7 +5,7 @@
<mk-button @click="start" primary class="start"><fa :icon="faPlus"/> {{ $t('startMessaging') }}</mk-button>
- <sequential-entrance class="history" v-if="messages.length > 0" :delay="30">
+ <div class="history" v-if="messages.length > 0">
<router-link v-for="(message, i) in messages"
class="message _panel"
:to="message.groupId ? `/my/messaging/group/${message.groupId}` : `/my/messaging/${getAcct(isMe(message) ? message.recipient : message.user)}`"
@@ -30,7 +30,7 @@
</div>
</div>
</router-link>
- </sequential-entrance>
+ </div>
<div class="no-history" v-if="!fetching && messages.length == 0">
<img src="https://xn--931a.moe/assets/info.png" class="_ghost"/>
<div>{{ $t('noHistory') }}</div>
diff --git a/src/client/pages/user/index.vue b/src/client/pages/user/index.vue
index f7fabd1786..f7a51c1fbc 100644
--- a/src/client/pages/user/index.vue
+++ b/src/client/pages/user/index.vue
@@ -80,9 +80,9 @@
</div>
<router-view :user="user"></router-view>
<template v-if="$route.name == 'user'">
- <sequential-entrance class="pins">
- <x-note v-for="(note, i) in user.pinnedNotes" class="note" :note="note" :key="note.id" :detail="true" :pinned="true"/>
- </sequential-entrance>
+ <div class="pins">
+ <x-note v-for="note in user.pinnedNotes" class="note" :note="note" :key="note.id" :detail="true" :pinned="true"/>
+ </div>
<mk-container :body-togglable="true" class="content">
<template #header><fa :icon="faImage"/>{{ $t('images') }}</template>
<div>
diff --git a/src/client/style.scss b/src/client/style.scss
index b698f2c04f..da0c20d990 100644
--- a/src/client/style.scss
+++ b/src/client/style.scss
@@ -3,7 +3,7 @@
:root {
--radius: 8px;
--marginFull: 16px;
- --marginHalf: 8px;
+ --marginHalf: 10px;
--margin: var(--marginFull);