diff options
| author | Hazelnoot <acomputerdog@gmail.com> | 2025-03-25 16:14:53 -0400 |
|---|---|---|
| committer | Hazelnoot <acomputerdog@gmail.com> | 2025-03-25 16:14:53 -0400 |
| commit | d8908ef2d8fa84d8e0fc1d30ab90a600a3d88054 (patch) | |
| tree | 0c8d3e0385ce7021c7187ef8b608f1abd87496e5 /packages/frontend/src/ui/zen.vue | |
| parent | merge: enhance: Update de-DE.yml (!949) (diff) | |
| parent | enhance(frontend): 設定の移行を手動でトリガーできるように (diff) | |
| download | sharkey-d8908ef2d8fa84d8e0fc1d30ab90a600a3d88054.tar.gz sharkey-d8908ef2d8fa84d8e0fc1d30ab90a600a3d88054.tar.bz2 sharkey-d8908ef2d8fa84d8e0fc1d30ab90a600a3d88054.zip | |
merge upstream
Diffstat (limited to 'packages/frontend/src/ui/zen.vue')
| -rw-r--r-- | packages/frontend/src/ui/zen.vue | 52 |
1 files changed, 26 insertions, 26 deletions
diff --git a/packages/frontend/src/ui/zen.vue b/packages/frontend/src/ui/zen.vue index 757aa6669d..66b4496827 100644 --- a/packages/frontend/src/ui/zen.vue +++ b/packages/frontend/src/ui/zen.vue @@ -4,46 +4,50 @@ SPDX-License-Identifier: AGPL-3.0-only --> <template> -<div :class="showBottom ? $style.rootWithBottom : $style.root"> - <div style="container-type: inline-size;"> - <RouterView/> +<div :class="$style.root"> + <div :class="$style.contents"> + <div style="flex: 1; min-height: 0;"> + <RouterView/> + </div> + + <!-- + デッキUIが設定されている場合はデッキUIに戻れるようにする (ただし?zenが明示された場合は表示しない) + See https://github.com/misskey-dev/misskey/issues/10905 + --> + <div v-if="showBottom" :class="$style.bottom"> + <button v-tooltip="i18n.ts.goToMisskey" :class="['_button', '_shadow', $style.button]" @click="goToMisskey"><i class="ti ti-home"></i></button> + </div> </div> <XCommon/> </div> - -<!-- - デッキUIが設定されている場合はデッキUIに戻れるようにする (ただし?zenが明示された場合は表示しない) - See https://github.com/misskey-dev/misskey/issues/10905 ---> -<div v-if="showBottom" :class="$style.bottom"> - <button v-tooltip="i18n.ts.goToMisskey" :class="['_button', '_shadow', $style.button]" @click="goToMisskey"><i class="ti ti-home"></i></button> -</div> </template> <script lang="ts" setup> import { computed, provide, ref } from 'vue'; -import XCommon from './_common_/common.vue'; -import { PageMetadata, provideMetadataReceiver, provideReactiveMetadata } from '@/scripts/page-metadata.js'; import { instanceName, ui } from '@@/js/config.js'; +import XCommon from './_common_/common.vue'; +import type { PageMetadata } from '@/page.js'; +import { provideMetadataReceiver, provideReactiveMetadata } from '@/page.js'; import { i18n } from '@/i18n.js'; -import { mainRouter } from '@/router/main.js'; +import { mainRouter } from '@/router.js'; +import { DI } from '@/di.js'; const isRoot = computed(() => mainRouter.currentRoute.value.name === 'index'); const pageMetadata = ref<null | PageMetadata>(null); -const showBottom = !(new URLSearchParams(location.search)).has('zen') && ui === 'deck'; +const showBottom = !(new URLSearchParams(window.location.search)).has('zen') && ui === 'deck'; -provide('router', mainRouter); +provide(DI.router, mainRouter); provideMetadataReceiver((metadataGetter) => { const info = metadataGetter(); pageMetadata.value = info; if (pageMetadata.value) { if (isRoot.value && pageMetadata.value.title === instanceName) { - document.title = pageMetadata.value.title; + window.document.title = pageMetadata.value.title; } else { - document.title = `${pageMetadata.value.title} | ${instanceName}`; + window.document.title = `${pageMetadata.value.title} | ${instanceName}`; } } }); @@ -52,19 +56,16 @@ provideReactiveMetadata(pageMetadata); function goToMisskey() { window.location.href = '/'; } - -document.documentElement.style.overflowY = 'scroll'; </script> <style lang="scss" module> .root { - min-height: 100dvh; - box-sizing: border-box; } -.rootWithBottom { - min-height: calc(100dvh - (60px + (var(--MI-margin) * 2) + env(safe-area-inset-bottom, 0px))); - box-sizing: border-box; +.contents { + display: flex; + flex-direction: column; + height: 100dvh; } .bottom { @@ -74,7 +75,6 @@ document.documentElement.style.overflowY = 'scroll'; } .button { - position: fixed !important; padding: 0; aspect-ratio: 1; width: 100%; |