diff --git a/packages/frontend/src/components/MkContainer.vue b/packages/frontend/src/components/MkContainer.vue index 5ac95fba07aff0567183837ef8e6f84f7d36368c..b4b67198306df950952ca268229e7e8254413f68 100644 --- a/packages/frontend/src/components/MkContainer.vue +++ b/packages/frontend/src/components/MkContainer.vue @@ -10,7 +10,7 @@ </button> </div> </header> - <transition + <Transition :name="$store.state.animation ? 'container-toggle' : ''" @enter="enter" @after-enter="afterEnter" @@ -23,7 +23,7 @@ <span>{{ $ts.showMore }}</span> </button> </div> - </transition> + </Transition> </div> </template> diff --git a/packages/frontend/src/components/MkContextMenu.vue b/packages/frontend/src/components/MkContextMenu.vue index cfc9502b413d5d2762289c23179a01f22dc0c461..6470f8b9728861b0f4fa5bdcc1593b0eca95ff99 100644 --- a/packages/frontend/src/components/MkContextMenu.vue +++ b/packages/frontend/src/components/MkContextMenu.vue @@ -1,9 +1,9 @@ <template> -<transition :name="$store.state.animation ? 'fade' : ''" appear> +<Transition :name="$store.state.animation ? 'fade' : ''" appear> <div ref="rootEl" class="nvlagfpb" :style="{ zIndex }" @contextmenu.prevent.stop="() => {}"> <MkMenu :items="items" :align="'left'" @close="$emit('closed')"/> </div> -</transition> +</Transition> </template> <script lang="ts" setup> diff --git a/packages/frontend/src/components/MkFolder.vue b/packages/frontend/src/components/MkFolder.vue index c762033f6951cf3a77d688dedb5b17c5dd084209..d76ea43888fc8ee4bf650959cf3127bfe6418d4e 100644 --- a/packages/frontend/src/components/MkFolder.vue +++ b/packages/frontend/src/components/MkFolder.vue @@ -8,7 +8,7 @@ <template v-else><i class="ti ti-chevron-down"></i></template> </button> </header> - <transition + <Transition :name="$store.state.animation ? 'folder-toggle' : ''" @enter="enter" @after-enter="afterEnter" @@ -18,7 +18,7 @@ <div v-show="showBody"> <slot></slot> </div> - </transition> + </Transition> </div> </template> diff --git a/packages/frontend/src/components/MkModal.vue b/packages/frontend/src/components/MkModal.vue index 2305a02794833c4374da562028a7a84d61f40e3e..868beb77652e38ce9a15eb06a59e7c0cae04f00d 100644 --- a/packages/frontend/src/components/MkModal.vue +++ b/packages/frontend/src/components/MkModal.vue @@ -1,12 +1,12 @@ <template> -<transition :name="$store.state.animation ? (type === 'drawer') ? 'modal-drawer' : (type === 'popup') ? 'modal-popup' : 'modal' : ''" :duration="$store.state.animation ? 200 : 0" appear @after-leave="emit('closed')" @enter="emit('opening')" @after-enter="onOpened"> +<Transition :name="$store.state.animation ? (type === 'drawer') ? 'modal-drawer' : (type === 'popup') ? 'modal-popup' : 'modal' : ''" :duration="$store.state.animation ? 200 : 0" appear @after-leave="emit('closed')" @enter="emit('opening')" @after-enter="onOpened"> <div v-show="manualShowing != null ? manualShowing : showing" v-hotkey.global="keymap" class="qzhlnise" :class="{ drawer: type === 'drawer', dialog: type === 'dialog' || type === 'dialog:top', popup: type === 'popup' }" :style="{ zIndex, pointerEvents: (manualShowing != null ? manualShowing : showing) ? 'auto' : 'none', '--transformOrigin': transformOrigin }"> <div class="bg _modalBg" :class="{ transparent: transparentBg && (type === 'popup') }" :style="{ zIndex }" @click="onBgClick" @contextmenu.prevent.stop="() => {}"></div> <div ref="content" class="content" :class="{ fixed, top: type === 'dialog:top' }" :style="{ zIndex }" @click.self="onBgClick"> <slot :max-height="maxHeight" :type="type"></slot> </div> </div> -</transition> +</Transition> </template> <script lang="ts" setup> diff --git a/packages/frontend/src/components/MkNotificationToast.vue b/packages/frontend/src/components/MkNotificationToast.vue index 07640792c0fcea51603edec3579f9534d5b3008a..39e8373e375a8008538726bcef946a90100cb9f6 100644 --- a/packages/frontend/src/components/MkNotificationToast.vue +++ b/packages/frontend/src/components/MkNotificationToast.vue @@ -1,8 +1,8 @@ <template> <div class="mk-notification-toast" :style="{ zIndex }"> - <transition :name="$store.state.animation ? 'notification-toast' : ''" appear @after-leave="$emit('closed')"> + <Transition :name="$store.state.animation ? 'notification-toast' : ''" appear @after-leave="$emit('closed')"> <XNotification v-if="showing" :notification="notification" class="notification _acrylic"/> - </transition> + </Transition> </div> </template> diff --git a/packages/frontend/src/components/MkPagination.vue b/packages/frontend/src/components/MkPagination.vue index 291409171abf289b7ab8d6a6cfcfe3153e479c5f..dc2a9832fea92851251c1db50367cd4ac43386a3 100644 --- a/packages/frontend/src/components/MkPagination.vue +++ b/packages/frontend/src/components/MkPagination.vue @@ -1,5 +1,5 @@ <template> -<transition :name="$store.state.animation ? 'fade' : ''" mode="out-in"> +<Transition :name="$store.state.animation ? 'fade' : ''" mode="out-in"> <MkLoading v-if="fetching"/> <MkError v-else-if="error" @retry="init()"/> @@ -28,7 +28,7 @@ <MkLoading v-else class="loading"/> </div> </div> -</transition> +</Transition> </template> <script lang="ts" setup> diff --git a/packages/frontend/src/components/MkToast.vue b/packages/frontend/src/components/MkToast.vue index c9fad64eb6df23bf625e65aeb08e1f052a46fe22..118f7126fc60f239fa79f269714c115df72ee38f 100644 --- a/packages/frontend/src/components/MkToast.vue +++ b/packages/frontend/src/components/MkToast.vue @@ -1,12 +1,12 @@ <template> <div class="mk-toast"> - <transition :name="$store.state.animation ? 'toast' : ''" appear @after-leave="emit('closed')"> + <Transition :name="$store.state.animation ? 'toast' : ''" appear @after-leave="emit('closed')"> <div v-if="showing" class="body _acrylic" :style="{ zIndex }"> <div class="message"> {{ message }} </div> </div> - </transition> + </Transition> </div> </template> diff --git a/packages/frontend/src/components/MkTooltip.vue b/packages/frontend/src/components/MkTooltip.vue index 4c6258d2459d10c1a7d073ea8365cebb80a81cbd..9dba0c735097d3e08ad6edbc4fe609266e2dc649 100644 --- a/packages/frontend/src/components/MkTooltip.vue +++ b/packages/frontend/src/components/MkTooltip.vue @@ -1,12 +1,12 @@ <template> -<transition :name="$store.state.animation ? 'tooltip' : ''" appear @after-leave="emit('closed')"> +<Transition :name="$store.state.animation ? 'tooltip' : ''" appear @after-leave="emit('closed')"> <div v-show="showing" ref="el" class="buebdbiu _acrylic _shadow" :style="{ zIndex, maxWidth: maxWidth + 'px' }"> <slot> <Mfm v-if="asMfm" :text="text"/> <span v-else>{{ text }}</span> </slot> </div> -</transition> +</Transition> </template> <script lang="ts" setup> diff --git a/packages/frontend/src/components/MkUrlPreview.vue b/packages/frontend/src/components/MkUrlPreview.vue index eb96b729b8f17b33448b5ecaef38e93eea032cfe..6a029d43c7f112b3a4cd3245f012ff310b340312 100644 --- a/packages/frontend/src/components/MkUrlPreview.vue +++ b/packages/frontend/src/components/MkUrlPreview.vue @@ -7,7 +7,7 @@ <iframe ref="tweet" scrolling="no" frameborder="no" :style="{ position: 'relative', width: '100%', height: `${tweetHeight}px` }" :src="`https://platform.twitter.com/embed/index.html?embedId=${embedId}&hideCard=false&hideThread=false&lang=en&theme=${$store.state.darkMode ? 'dark' : 'light'}&id=${tweetId}`"></iframe> </div> <div v-else class="mk-url-preview"> - <transition :name="$store.state.animation ? 'zoom' : ''" mode="out-in"> + <Transition :name="$store.state.animation ? 'zoom' : ''" mode="out-in"> <component :is="self ? 'MkA' : 'a'" v-if="!fetching" class="link" :class="{ compact }" :[attr]="self ? url.substr(local.length) : url" rel="nofollow noopener" :target="target" :title="url"> <div v-if="thumbnail" class="thumbnail" :style="`background-image: url('${thumbnail}')`"> </div> @@ -22,7 +22,7 @@ </footer> </article> </component> - </transition> + </Transition> <div v-if="tweetId" class="action"> <MkButton :small="true" inline @click="tweetExpanded = true"> <i class="ti ti-brand-twitter"></i> {{ i18n.ts.expandTweet }} diff --git a/packages/frontend/src/components/MkUrlPreviewPopup.vue b/packages/frontend/src/components/MkUrlPreviewPopup.vue index f343c6d8a614174553917037f90d4c31cf8b34f0..a24aebe66fea77f0cd0137f3d1dd48ebf061950b 100644 --- a/packages/frontend/src/components/MkUrlPreviewPopup.vue +++ b/packages/frontend/src/components/MkUrlPreviewPopup.vue @@ -1,8 +1,8 @@ <template> <div class="fgmtyycl" :style="{ zIndex, top: top + 'px', left: left + 'px' }"> - <transition :name="$store.state.animation ? 'zoom' : ''" @after-leave="emit('closed')"> + <Transition :name="$store.state.animation ? 'zoom' : ''" @after-leave="emit('closed')"> <MkUrlPreview v-if="showing" class="_popup _shadow" :url="url"/> - </transition> + </Transition> </div> </template> diff --git a/packages/frontend/src/components/MkUserPreview.vue b/packages/frontend/src/components/MkUserPreview.vue index d367d7b5c270ba8daac46ffc2ac8bd090838c6ac..c0d290f9bcfa3a0c3613229f01e26533e897c897 100644 --- a/packages/frontend/src/components/MkUserPreview.vue +++ b/packages/frontend/src/components/MkUserPreview.vue @@ -1,5 +1,5 @@ <template> -<transition :name="$store.state.animation ? 'popup' : ''" appear @after-leave="emit('closed')"> +<Transition :name="$store.state.animation ? 'popup' : ''" appear @after-leave="emit('closed')"> <div v-if="showing" class="fxxzrfni _popup _shadow" :style="{ zIndex, top: top + 'px', left: left + 'px' }" @mouseover="() => { emit('mouseover'); }" @mouseleave="() => { emit('mouseleave'); }"> <div v-if="user != null" class="info"> <div class="banner" :style="user.bannerUrl ? `background-image: url(${user.bannerUrl})` : ''"> @@ -30,7 +30,7 @@ <MkLoading/> </div> </div> -</transition> +</Transition> </template> <script lang="ts" setup> diff --git a/packages/frontend/src/components/MkWindow.vue b/packages/frontend/src/components/MkWindow.vue index 629c1058109d3cd20272a0642da0a53dc80a9dc4..dca258421b9ff685a462d06d83c386813559e9d5 100644 --- a/packages/frontend/src/components/MkWindow.vue +++ b/packages/frontend/src/components/MkWindow.vue @@ -1,5 +1,5 @@ <template> -<transition :name="$store.state.animation ? 'window' : ''" appear @after-leave="$emit('closed')"> +<Transition :name="$store.state.animation ? 'window' : ''" appear @after-leave="$emit('closed')"> <div v-if="showing" ref="rootEl" class="ebkgocck" :class="{ maximized }"> <div class="body _shadow _narrow_" @mousedown="onBodyMousedown" @keydown="onKeydown"> <div class="header" :class="{ mini }" @contextmenu.prevent.stop="onContextmenu"> @@ -31,7 +31,7 @@ <div class="handle bottom-left" @mousedown.prevent="onBottomLeftHandleMousedown"></div> </template> </div> -</transition> +</Transition> </template> <script lang="ts" setup> diff --git a/packages/frontend/src/components/MkYoutubePlayer.vue b/packages/frontend/src/components/MkYoutubePlayer.vue index 8cd481a39ca664df11631802760e58f16e3475b0..5c675fe987638e4bc85e2a40f034091d12df1714 100644 --- a/packages/frontend/src/components/MkYoutubePlayer.vue +++ b/packages/frontend/src/components/MkYoutubePlayer.vue @@ -6,11 +6,11 @@ </template> <div class="poamfof"> - <transition :name="$store.state.animation ? 'fade' : ''" mode="out-in"> + <Transition :name="$store.state.animation ? 'fade' : ''" mode="out-in"> <div v-if="player.url" class="player"> <iframe v-if="!fetching" :src="player.url + (player.url.match(/\?/) ? '&autoplay=1&auto_play=1' : '?autoplay=1&auto_play=1')" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen/> </div> - </transition> + </Transition> <MkLoading v-if="fetching"/> <MkError v-else-if="!player.url" @retry="ytFetch()"/> </div> diff --git a/packages/frontend/src/components/form/suspense.vue b/packages/frontend/src/components/form/suspense.vue index 7efa501f270b0657216fafd860171832fa48a432..936e12aa7bd9b8754142ca9daef77705a026c4f5 100644 --- a/packages/frontend/src/components/form/suspense.vue +++ b/packages/frontend/src/components/form/suspense.vue @@ -1,5 +1,5 @@ <template> -<transition :name="$store.state.animation ? 'fade' : ''" mode="out-in"> +<Transition :name="$store.state.animation ? 'fade' : ''" mode="out-in"> <div v-if="pending"> <MkLoading/> </div> @@ -12,7 +12,7 @@ <MkButton inline class="retry" @click="retry"><i class="ti ti-reload"></i> {{ $ts.retry }}</MkButton> </div> </div> -</transition> +</Transition> </template> <script lang="ts"> diff --git a/packages/frontend/src/components/global/MkError.vue b/packages/frontend/src/components/global/MkError.vue index e135d4184bb58c19d856254b9b8e579db03b9021..a19103041c3702a82e92da9691277ffc056ad74c 100644 --- a/packages/frontend/src/components/global/MkError.vue +++ b/packages/frontend/src/components/global/MkError.vue @@ -1,11 +1,11 @@ <template> -<transition :name="$store.state.animation ? 'zoom' : ''" appear> +<Transition :name="$store.state.animation ? 'zoom' : ''" appear> <div class="mjndxjcg"> <img src="https://xn--931a.moe/assets/error.jpg" class="_ghost"/> <p><i class="ti ti-alert-triangle"></i> {{ i18n.ts.somethingHappened }}</p> <MkButton class="button" @click="() => $emit('retry')">{{ i18n.ts.retry }}</MkButton> </div> -</transition> +</Transition> </template> <script lang="ts" setup> diff --git a/packages/frontend/src/pages/_error_.vue b/packages/frontend/src/pages/_error_.vue index 232d52534734f198959b199ec855af512901fb6c..ebadccb812b7f595e0b1136246f78c1b807bf3ad 100644 --- a/packages/frontend/src/pages/_error_.vue +++ b/packages/frontend/src/pages/_error_.vue @@ -1,6 +1,6 @@ <template> <MkLoading v-if="!loaded"/> -<transition :name="$store.state.animation ? 'zoom' : ''" appear> +<Transition :name="$store.state.animation ? 'zoom' : ''" appear> <div v-show="loaded" class="mjndxjch"> <img src="https://xn--931a.moe/assets/error.jpg" class="_ghost"/> <p><b><i class="ti ti-alert-triangle"></i> {{ i18n.ts.pageLoadError }}</b></p> @@ -14,7 +14,7 @@ <p><MkA to="/docs/general/troubleshooting" class="_link">{{ i18n.ts.troubleshooting }}</MkA></p> <p v-if="error" class="error">ERROR: {{ error }}</p> </div> -</transition> +</Transition> </template> <script lang="ts" setup> diff --git a/packages/frontend/src/pages/admin/overview.instances.vue b/packages/frontend/src/pages/admin/overview.instances.vue index 29848bf03b560a45947efdf5c4fe3eea15aeb9ba..6d2ac67418fab4704ce01eee5cfb2e6e247a1b33 100644 --- a/packages/frontend/src/pages/admin/overview.instances.vue +++ b/packages/frontend/src/pages/admin/overview.instances.vue @@ -1,13 +1,13 @@ <template> <div class="wbrkwale"> - <transition :name="$store.state.animation ? 'zoom' : ''" mode="out-in"> + <Transition :name="$store.state.animation ? 'zoom' : ''" mode="out-in"> <MkLoading v-if="fetching"/> <div v-else class="instances"> <MkA v-for="(instance, i) in instances" :key="instance.id" v-tooltip.mfm.noDelay="`${instance.name}\n${instance.host}\n${instance.softwareName} ${instance.softwareVersion}`" :to="`/instance-info/${instance.host}`" class="instance"> <MkInstanceCardMini :instance="instance"/> </MkA> </div> - </transition> + </Transition> </div> </template> diff --git a/packages/frontend/src/pages/admin/overview.moderators.vue b/packages/frontend/src/pages/admin/overview.moderators.vue index a1f63c8711005b63d89878faeffe6a751d785511..ea8eed5bf2cfece9ff1e1fc39f5702b3eaef7b5d 100644 --- a/packages/frontend/src/pages/admin/overview.moderators.vue +++ b/packages/frontend/src/pages/admin/overview.moderators.vue @@ -1,13 +1,13 @@ <template> <div> - <transition :name="$store.state.animation ? 'zoom' : ''" mode="out-in"> + <Transition :name="$store.state.animation ? 'zoom' : ''" mode="out-in"> <MkLoading v-if="fetching"/> <div v-else :class="$style.root" class="_panel"> <MkA v-for="user in moderators" :key="user.id" class="user" :to="`/user-info/${user.id}`"> <MkAvatar :user="user" class="avatar" :show-indicator="true" :disable-link="true"/> </MkA> </div> - </transition> + </Transition> </div> </template> diff --git a/packages/frontend/src/pages/admin/overview.stats.vue b/packages/frontend/src/pages/admin/overview.stats.vue index 4dcf7e751a406f5145961e4d5d320df35fc07faa..28d80e3118ad008528e32fae175bc4ea97492f1c 100644 --- a/packages/frontend/src/pages/admin/overview.stats.vue +++ b/packages/frontend/src/pages/admin/overview.stats.vue @@ -1,6 +1,6 @@ <template> <div> - <transition :name="$store.state.animation ? 'zoom' : ''" mode="out-in"> + <Transition :name="$store.state.animation ? 'zoom' : ''" mode="out-in"> <MkLoading v-if="fetching"/> <div v-else :class="$style.root"> <div class="item _panel users"> @@ -42,7 +42,7 @@ </div> </div> </div> - </transition> + </Transition> </div> </template> diff --git a/packages/frontend/src/pages/admin/overview.users.vue b/packages/frontend/src/pages/admin/overview.users.vue index 5d4be1174289f27a8fb532edf13589dd00adc4c7..0022108e4142a073025ca16eb8002c1cb4b804f2 100644 --- a/packages/frontend/src/pages/admin/overview.users.vue +++ b/packages/frontend/src/pages/admin/overview.users.vue @@ -1,13 +1,13 @@ <template> <div :class="$style.root"> - <transition :name="$store.state.animation ? 'zoom' : ''" mode="out-in"> + <Transition :name="$store.state.animation ? 'zoom' : ''" mode="out-in"> <MkLoading v-if="fetching"/> <div v-else class="users"> <MkA v-for="(user, i) in newUsers" :key="user.id" :to="`/user-info/${user.id}`" class="user"> <MkUserCardMini :user="user"/> </MkA> </div> - </transition> + </Transition> </div> </template> diff --git a/packages/frontend/src/pages/gallery/post.vue b/packages/frontend/src/pages/gallery/post.vue index 85ab1048bec39b2667e1d22adc708f7b9d73d3dc..b1dc872ff9951e4812a64d04a1c6e90e8d0818da 100644 --- a/packages/frontend/src/pages/gallery/post.vue +++ b/packages/frontend/src/pages/gallery/post.vue @@ -3,7 +3,7 @@ <template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template> <MkSpacer :content-max="1000" :margin-min="16" :margin-max="32"> <div class="_root"> - <transition :name="$store.state.animation ? 'fade' : ''" mode="out-in"> + <Transition :name="$store.state.animation ? 'fade' : ''" mode="out-in"> <div v-if="post" class="rkxwuolj"> <div class="files"> <div v-for="file in post.files" :key="file.id" class="file"> @@ -48,7 +48,7 @@ </div> <MkError v-else-if="error" @retry="fetch()"/> <MkLoading v-else/> - </transition> + </Transition> </div> </MkSpacer> </MkStickyContainer> diff --git a/packages/frontend/src/pages/messaging/messaging-room.vue b/packages/frontend/src/pages/messaging/messaging-room.vue index b6eeb9260e403758689f34e3dc3a076a2090a2d5..280e6a903b0a7e6b059b11e8b583f871bb2850f4 100644 --- a/packages/frontend/src/pages/messaging/messaging-room.vue +++ b/packages/frontend/src/pages/messaging/messaging-room.vue @@ -38,11 +38,11 @@ </I18n> <MkEllipsis/> </div> - <transition :name="animation ? 'fade' : ''"> + <Transition :name="animation ? 'fade' : ''"> <div v-show="showIndicator" class="new-message"> <button class="_buttonPrimary" @click="onIndicatorClick"><i class="fas ti-fw fa-arrow-circle-down"></i>{{ i18n.ts.newMessageExists }}</button> </div> - </transition> + </Transition> <XForm v-if="!fetching" ref="formEl" :user="user" :group="group" class="form"/> </footer> </div> diff --git a/packages/frontend/src/pages/my-lists/list.vue b/packages/frontend/src/pages/my-lists/list.vue index f6234ffe449327437a2749cfa457402e1fd254f9..2d514d76709930de0ae4526f2f6a01dfed23eee1 100644 --- a/packages/frontend/src/pages/my-lists/list.vue +++ b/packages/frontend/src/pages/my-lists/list.vue @@ -3,7 +3,7 @@ <template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template> <MkSpacer :content-max="700"> <div class="mk-list-page"> - <transition :name="$store.state.animation ? 'zoom' : ''" mode="out-in"> + <Transition :name="$store.state.animation ? 'zoom' : ''" mode="out-in"> <div v-if="list" class="_section"> <div class="_content"> <MkButton inline @click="addUser()">{{ i18n.ts.addUser }}</MkButton> @@ -11,9 +11,9 @@ <MkButton inline @click="deleteList()">{{ i18n.ts.delete }}</MkButton> </div> </div> - </transition> + </Transition> - <transition :name="$store.state.animation ? 'zoom' : ''" mode="out-in"> + <Transition :name="$store.state.animation ? 'zoom' : ''" mode="out-in"> <div v-if="list" class="_section members _gap"> <div class="_title">{{ i18n.ts.members }}</div> <div class="_content"> @@ -31,7 +31,7 @@ </div> </div> </div> - </transition> + </Transition> </div> </MkSpacer> </MkStickyContainer> diff --git a/packages/frontend/src/pages/note.vue b/packages/frontend/src/pages/note.vue index ba2bb9123913a86092352cd8577898271137400e..90fe417a780bf2003dbb26a14cc57b746da70f83 100644 --- a/packages/frontend/src/pages/note.vue +++ b/packages/frontend/src/pages/note.vue @@ -3,7 +3,7 @@ <template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template> <MkSpacer :content-max="800"> <div class="fcuexfpr"> - <transition :name="$store.state.animation ? 'fade' : ''" mode="out-in"> + <Transition :name="$store.state.animation ? 'fade' : ''" mode="out-in"> <div v-if="note" class="note"> <div v-if="showNext" class="_gap"> <XNotes class="_content" :pagination="nextPagination" :no-gap="true"/> @@ -34,7 +34,7 @@ </div> <MkError v-else-if="error" @retry="fetch()"/> <MkLoading v-else/> - </transition> + </Transition> </div> </MkSpacer> </MkStickyContainer> diff --git a/packages/frontend/src/pages/page.vue b/packages/frontend/src/pages/page.vue index a95bfe485cadbff912fc1c22e35f153643802cff..e01dae2cd9cb35bd0ef1fbf4d135c1418c06466b 100644 --- a/packages/frontend/src/pages/page.vue +++ b/packages/frontend/src/pages/page.vue @@ -2,7 +2,7 @@ <MkStickyContainer> <template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template> <MkSpacer :content-max="700"> - <transition :name="$store.state.animation ? 'fade' : ''" mode="out-in"> + <Transition :name="$store.state.animation ? 'fade' : ''" mode="out-in"> <div v-if="page" :key="page.id" class="xcukqgmh"> <div class="_block main"> <!-- @@ -57,7 +57,7 @@ </div> <MkError v-else-if="error" @retry="fetchPage()"/> <MkLoading v-else/> - </transition> + </Transition> </MkSpacer> </MkStickyContainer> </template> diff --git a/packages/frontend/src/pages/user/followers.vue b/packages/frontend/src/pages/user/followers.vue index 17c28433818d2397bd942e02ecfa4b7bb64cbd3d..88599287846735ee74c770e6fcb951cdb2355875 100644 --- a/packages/frontend/src/pages/user/followers.vue +++ b/packages/frontend/src/pages/user/followers.vue @@ -2,13 +2,13 @@ <MkStickyContainer> <template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template> <MkSpacer :content-max="1000"> - <transition name="fade" mode="out-in"> + <Transition name="fade" mode="out-in"> <div v-if="user"> <XFollowList :user="user" type="followers"/> </div> <MkError v-else-if="error" @retry="fetchUser()"/> <MkLoading v-else/> - </transition> + </Transition> </MkSpacer> </MkStickyContainer> </template> diff --git a/packages/frontend/src/pages/user/following.vue b/packages/frontend/src/pages/user/following.vue index 03892ec03d266c74cfe9beda4dcda0efc80d2863..51015905c651dc3a70b18f9a96c8dfce564c545c 100644 --- a/packages/frontend/src/pages/user/following.vue +++ b/packages/frontend/src/pages/user/following.vue @@ -2,13 +2,13 @@ <MkStickyContainer> <template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template> <MkSpacer :content-max="1000"> - <transition name="fade" mode="out-in"> + <Transition name="fade" mode="out-in"> <div v-if="user"> <XFollowList :user="user" type="following"/> </div> <MkError v-else-if="error" @retry="fetchUser()"/> <MkLoading v-else/> - </transition> + </Transition> </MkSpacer> </MkStickyContainer> </template> diff --git a/packages/frontend/src/pages/user/index.vue b/packages/frontend/src/pages/user/index.vue index 6e895cd8d7f7f323f915dc64deeff242ca7f6d4f..f40cd0b8d62e15983470a71739340e531e9b2a19 100644 --- a/packages/frontend/src/pages/user/index.vue +++ b/packages/frontend/src/pages/user/index.vue @@ -2,7 +2,7 @@ <MkStickyContainer> <template #header><MkPageHeader v-model:tab="tab" :actions="headerActions" :tabs="headerTabs"/></template> <div> - <transition name="fade" mode="out-in"> + <Transition name="fade" mode="out-in"> <div v-if="user"> <XHome v-if="tab === 'home'" :user="user"/> <XReactions v-else-if="tab === 'reactions'" :user="user"/> @@ -12,7 +12,7 @@ </div> <MkError v-else-if="error" @retry="fetchUser()"/> <MkLoading v-else/> - </transition> + </Transition> </div> </MkStickyContainer> </template> diff --git a/packages/frontend/src/ui/_common_/statusbar-federation.vue b/packages/frontend/src/ui/_common_/statusbar-federation.vue index 24fc4f6f6d8ade17e1363fadc4b9a538ac5ba61e..7c3de32ac9d5be47fedc4bf58b7bb30bcb174527 100644 --- a/packages/frontend/src/ui/_common_/statusbar-federation.vue +++ b/packages/frontend/src/ui/_common_/statusbar-federation.vue @@ -1,7 +1,7 @@ <template> <span v-if="!fetching" class="nmidsaqw"> <template v-if="display === 'marquee'"> - <transition name="change" mode="default"> + <Transition name="change" mode="default"> <MarqueeText :key="key" :duration="marqueeDuration" :reverse="marqueeReverse"> <span v-for="instance in instances" :key="instance.id" class="item" :class="{ colored }" :style="{ background: colored ? instance.themeColor : null }"> <img class="icon" :src="getInstanceIcon(instance)" alt=""/> @@ -11,7 +11,7 @@ <span class="divider"></span> </span> </MarqueeText> - </transition> + </Transition> </template> <template v-else-if="display === 'oneByOne'"> <!-- TODO --> diff --git a/packages/frontend/src/ui/_common_/statusbar-rss.vue b/packages/frontend/src/ui/_common_/statusbar-rss.vue index e7f88e4984358850902e6044fae6fcbc7b66cc6b..e59ace8876e10b26461695610f1a073a55eddd42 100644 --- a/packages/frontend/src/ui/_common_/statusbar-rss.vue +++ b/packages/frontend/src/ui/_common_/statusbar-rss.vue @@ -1,13 +1,13 @@ <template> <span v-if="!fetching" class="xbhtxfms"> <template v-if="display === 'marquee'"> - <transition name="change" mode="default"> + <Transition name="change" mode="default"> <MarqueeText :key="key" :duration="marqueeDuration" :reverse="marqueeReverse"> <span v-for="item in items" class="item"> <a class="link" :href="item.link" rel="nofollow noopener" target="_blank" :title="item.title">{{ item.title }}</a><span class="divider"></span> </span> </MarqueeText> - </transition> + </Transition> </template> <template v-else-if="display === 'oneByOne'"> <!-- TODO --> diff --git a/packages/frontend/src/ui/_common_/statusbar-user-list.vue b/packages/frontend/src/ui/_common_/statusbar-user-list.vue index cbed11ec61acb61f08a0b2a000111c7c8c4178f0..6fec81de36c3bb79c1c4d7ee4706ce7cda8a943c 100644 --- a/packages/frontend/src/ui/_common_/statusbar-user-list.vue +++ b/packages/frontend/src/ui/_common_/statusbar-user-list.vue @@ -1,7 +1,7 @@ <template> <span v-if="!fetching" class="osdsvwzy"> <template v-if="display === 'marquee'"> - <transition name="change" mode="default"> + <Transition name="change" mode="default"> <MarqueeText :key="key" :duration="marqueeDuration" :reverse="marqueeReverse"> <span v-for="note in notes" :key="note.id" class="item"> <img class="avatar" :src="note.user.avatarUrl" decoding="async"/> @@ -11,7 +11,7 @@ <span class="divider"></span> </span> </MarqueeText> - </transition> + </Transition> </template> <template v-else-if="display === 'oneByOne'"> <!-- TODO --> diff --git a/packages/frontend/src/ui/classic.vue b/packages/frontend/src/ui/classic.vue index 79f72ad8eaa819b243e878b5657a0656bdfbdeca..532829ee2e108e0fc455d3cdfb4556ca87978770 100644 --- a/packages/frontend/src/ui/classic.vue +++ b/packages/frontend/src/ui/classic.vue @@ -21,18 +21,18 @@ </div> </div> - <transition :name="$store.state.animation ? 'tray-back' : ''"> + <Transition :name="$store.state.animation ? 'tray-back' : ''"> <div v-if="widgetsShowing" class="tray-back _modalBg" @click="widgetsShowing = false" @touchstart.passive="widgetsShowing = false" ></div> - </transition> + </Transition> - <transition :name="$store.state.animation ? 'tray' : ''"> + <Transition :name="$store.state.animation ? 'tray' : ''"> <XWidgets v-if="widgetsShowing" class="tray"/> - </transition> + </Transition> <iframe v-if="$store.state.aiChanMode" ref="live2d" class="ivnzpscs" src="https://misskey-dev.github.io/mascot-web/?scale=2&y=1.4"></iframe> diff --git a/packages/frontend/src/ui/deck.vue b/packages/frontend/src/ui/deck.vue index f3415cfd09a22ca9b529f28db2e4cf0fffa5850a..6efb2ce2907198a1568eea16528dbdd18b85a3ee 100644 --- a/packages/frontend/src/ui/deck.vue +++ b/packages/frontend/src/ui/deck.vue @@ -54,18 +54,18 @@ <button class="button post _button" @click="os.post()"><i class="ti ti-pencil"></i></button> </div> - <transition :name="$store.state.animation ? 'menu-back' : ''"> + <Transition :name="$store.state.animation ? 'menu-back' : ''"> <div v-if="drawerMenuShowing" class="menu-back _modalBg" @click="drawerMenuShowing = false" @touchstart.passive="drawerMenuShowing = false" ></div> - </transition> + </Transition> - <transition :name="$store.state.animation ? 'menu' : ''"> + <Transition :name="$store.state.animation ? 'menu' : ''"> <XDrawerMenu v-if="drawerMenuShowing" class="menu"/> - </transition> + </Transition> <XCommon/> </div> diff --git a/packages/frontend/src/ui/universal.vue b/packages/frontend/src/ui/universal.vue index 93556cf3e1e5f251bcb542a4e99ec9ff0f58f15a..7922ab0086f765eda6c803d896ad25de4e856f81 100644 --- a/packages/frontend/src/ui/universal.vue +++ b/packages/frontend/src/ui/universal.vue @@ -26,31 +26,31 @@ <button class="button post _button" @click="os.post()"><i class="ti ti-pencil"></i></button> </div> - <transition :name="$store.state.animation ? 'menuDrawer-back' : ''"> + <Transition :name="$store.state.animation ? 'menuDrawer-back' : ''"> <div v-if="drawerMenuShowing" class="menuDrawer-back _modalBg" @click="drawerMenuShowing = false" @touchstart.passive="drawerMenuShowing = false" ></div> - </transition> + </Transition> - <transition :name="$store.state.animation ? 'menuDrawer' : ''"> + <Transition :name="$store.state.animation ? 'menuDrawer' : ''"> <XDrawerMenu v-if="drawerMenuShowing" class="menuDrawer"/> - </transition> + </Transition> - <transition :name="$store.state.animation ? 'widgetsDrawer-back' : ''"> + <Transition :name="$store.state.animation ? 'widgetsDrawer-back' : ''"> <div v-if="widgetsShowing" class="widgetsDrawer-back _modalBg" @click="widgetsShowing = false" @touchstart.passive="widgetsShowing = false" ></div> - </transition> + </Transition> - <transition :name="$store.state.animation ? 'widgetsDrawer' : ''"> + <Transition :name="$store.state.animation ? 'widgetsDrawer' : ''"> <XWidgets v-if="widgetsShowing" class="widgetsDrawer"/> - </transition> + </Transition> <XCommon/> </div> diff --git a/packages/frontend/src/ui/visitor/b.vue b/packages/frontend/src/ui/visitor/b.vue index dd290a327d43db73554b3ca19cec09eeeddef351..c8b32bb98fca0f18a53775361745ca26e37a1cb9 100644 --- a/packages/frontend/src/ui/visitor/b.vue +++ b/packages/frontend/src/ui/visitor/b.vue @@ -21,16 +21,16 @@ </div> </div> - <transition :name="$store.state.animation ? 'tray-back' : ''"> + <Transition :name="$store.state.animation ? 'tray-back' : ''"> <div v-if="showMenu" class="menu-back _modalBg" @click="showMenu = false" @touchstart.passive="showMenu = false" ></div> - </transition> + </Transition> - <transition :name="$store.state.animation ? 'tray' : ''"> + <Transition :name="$store.state.animation ? 'tray' : ''"> <div v-if="showMenu" class="menu"> <MkA to="/" class="link" active-class="active"><i class="ti ti-home icon"></i>{{ $ts.home }}</MkA> <MkA to="/explore" class="link" active-class="active"><i class="ti ti-hash icon"></i>{{ $ts.explore }}</MkA> @@ -41,7 +41,7 @@ <button class="_button" @click="signin()">{{ $ts.login }}</button> </div> </div> - </transition> + </Transition> </div> </template> diff --git a/packages/frontend/src/widgets/federation.vue b/packages/frontend/src/widgets/federation.vue index 3374783b0c685b7a2477c489e6d66f7ada147f97..221972bc6fc5dd94b5841c00447e1dfd0030e472 100644 --- a/packages/frontend/src/widgets/federation.vue +++ b/packages/frontend/src/widgets/federation.vue @@ -4,7 +4,7 @@ <div class="wbrkwalb"> <MkLoading v-if="fetching"/> - <transition-group v-else tag="div" :name="$store.state.animation ? 'chart' : ''" class="instances"> + <TransitionGroup v-else tag="div" :name="$store.state.animation ? 'chart' : ''" class="instances"> <div v-for="(instance, i) in instances" :key="instance.id" class="instance"> <img :src="getInstanceIcon(instance)" alt=""/> <div class="body"> @@ -13,7 +13,7 @@ </div> <MkMiniChart class="chart" :src="charts[i].requests.received"/> </div> - </transition-group> + </TransitionGroup> </div> </MkContainer> </template> diff --git a/packages/frontend/src/widgets/rss-ticker.vue b/packages/frontend/src/widgets/rss-ticker.vue index 44c21d1836c881fa8c9fc7615f3e890a80d68163..c2d6dd2873b2a2d3cc0faefdc4038e4669e7c965 100644 --- a/packages/frontend/src/widgets/rss-ticker.vue +++ b/packages/frontend/src/widgets/rss-ticker.vue @@ -6,13 +6,13 @@ <div class="ekmkgxbk"> <MkLoading v-if="fetching"/> <div v-else class="feed"> - <transition name="change" mode="default"> + <Transition name="change" mode="default"> <MarqueeText :key="key" :duration="widgetProps.duration" :reverse="widgetProps.reverse"> <span v-for="item in items" class="item"> <a class="link" :href="item.link" rel="nofollow noopener" target="_blank" :title="item.title">{{ item.title }}</a><span class="divider"></span> </span> </MarqueeText> - </transition> + </Transition> </div> </div> </MkContainer> diff --git a/packages/frontend/src/widgets/trends.vue b/packages/frontend/src/widgets/trends.vue index 02eec0431e8d26935783c6246257e25da2e6a8aa..e5004481674ca8582263c77006e556eeb1954ec6 100644 --- a/packages/frontend/src/widgets/trends.vue +++ b/packages/frontend/src/widgets/trends.vue @@ -4,7 +4,7 @@ <div class="wbrkwala"> <MkLoading v-if="fetching"/> - <transition-group v-else tag="div" :name="$store.state.animation ? 'chart' : ''" class="tags"> + <TransitionGroup v-else tag="div" :name="$store.state.animation ? 'chart' : ''" class="tags"> <div v-for="stat in stats" :key="stat.tag"> <div class="tag"> <MkA class="a" :to="`/tags/${ encodeURIComponent(stat.tag) }`" :title="stat.tag">#{{ stat.tag }}</MkA> @@ -12,7 +12,7 @@ </div> <MkMiniChart class="chart" :src="stat.chart"/> </div> - </transition-group> + </TransitionGroup> </div> </MkContainer> </template>