summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorsyuilo <4439005+syuilo@users.noreply.github.com>2025-03-20 13:16:08 +0900
committersyuilo <4439005+syuilo@users.noreply.github.com>2025-03-20 13:16:08 +0900
commit8b6d90b7a45422f0c5dd05678c7a4ca8d83b7fe5 (patch)
tree12e23bd7fbf562b80bdeaa3a5533cf2d76807694
parentNew Crowdin updates (#15680) (diff)
downloadmisskey-8b6d90b7a45422f0c5dd05678c7a4ca8d83b7fe5.tar.gz
misskey-8b6d90b7a45422f0c5dd05678c7a4ca8d83b7fe5.tar.bz2
misskey-8b6d90b7a45422f0c5dd05678c7a4ca8d83b7fe5.zip
🎹
-rw-r--r--packages/frontend/src/components/MkAnimBg.vue2
-rw-r--r--packages/frontend/src/pages/install-extensions.vue74
2 files changed, 41 insertions, 35 deletions
diff --git a/packages/frontend/src/components/MkAnimBg.vue b/packages/frontend/src/components/MkAnimBg.vue
index 2938645557..e57fbcdee3 100644
--- a/packages/frontend/src/components/MkAnimBg.vue
+++ b/packages/frontend/src/components/MkAnimBg.vue
@@ -4,7 +4,7 @@ SPDX-License-Identifier: AGPL-3.0-only
-->
<template>
-<canvas ref="canvasEl" style="width: 100%; height: 100%; pointer-events: none;"></canvas>
+<canvas ref="canvasEl" style="display: block; width: 100%; height: 100%; pointer-events: none;"></canvas>
</template>
<script lang="ts" setup>
diff --git a/packages/frontend/src/pages/install-extensions.vue b/packages/frontend/src/pages/install-extensions.vue
index 3da6af1a04..47c49e547a 100644
--- a/packages/frontend/src/pages/install-extensions.vue
+++ b/packages/frontend/src/pages/install-extensions.vue
@@ -4,41 +4,46 @@ SPDX-License-Identifier: AGPL-3.0-only
-->
<template>
-<MkStickyContainer>
- <template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template>
- <MkSpacer :contentMax="550">
- <MkLoading v-if="uiPhase === 'fetching'"/>
- <MkExtensionInstaller v-else-if="uiPhase === 'confirm' && data" :extension="data" @confirm="install()" @cancel="close_()">
- <template #additionalInfo>
- <FormSection>
- <div class="_gaps_s">
- <MkKeyValue>
- <template #key>{{ i18n.ts._externalResourceInstaller._vendorInfo.endpoint }}</template>
- <template #value><MkUrl :url="url" :showUrlPreview="false"></MkUrl></template>
- </MkKeyValue>
- <MkKeyValue>
- <template #key>{{ i18n.ts._externalResourceInstaller._vendorInfo.hashVerify }}</template>
- <template #value>
- <!-- ă“ăźç”»éąăŒć‡șăŠă„ă‚‹æ™‚ç‚čă§ăƒăƒƒă‚·ăƒ„ăźæ€œèšŒă«ăŻæˆćŠŸă—ăŠă„ă‚‹ -->
- <i class="ti ti-check" style="color: var(--MI_THEME-accent)"></i>
- </template>
- </MkKeyValue>
+<div>
+ <MkAnimBg style="position: absolute;"/>
+ <div class="_pageScrollable" style="position: absolute; top: 0; width: 100%; height: 100%;">
+ <MkStickyContainer>
+ <template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template>
+ <MkSpacer :contentMax="550">
+ <MkLoading v-if="uiPhase === 'fetching'"/>
+ <MkExtensionInstaller v-else-if="uiPhase === 'confirm' && data" :extension="data" @confirm="install()" @cancel="close_()">
+ <template #additionalInfo>
+ <FormSection>
+ <div class="_gaps_s">
+ <MkKeyValue>
+ <template #key>{{ i18n.ts._externalResourceInstaller._vendorInfo.endpoint }}</template>
+ <template #value><MkUrl :url="url" :showUrlPreview="false"></MkUrl></template>
+ </MkKeyValue>
+ <MkKeyValue>
+ <template #key>{{ i18n.ts._externalResourceInstaller._vendorInfo.hashVerify }}</template>
+ <template #value>
+ <!-- ă“ăźç”»éąăŒć‡șăŠă„ă‚‹æ™‚ç‚čă§ăƒăƒƒă‚·ăƒ„ăźæ€œèšŒă«ăŻæˆćŠŸă—ăŠă„ă‚‹ -->
+ <i class="ti ti-check" style="color: var(--MI_THEME-accent)"></i>
+ </template>
+ </MkKeyValue>
+ </div>
+ </FormSection>
+ </template>
+ </MkExtensionInstaller>
+ <div v-else-if="uiPhase === 'error'" class="_gaps_m" :class="[$style.extInstallerRoot, $style.error]">
+ <div :class="$style.extInstallerIconWrapper">
+ <i class="ti ti-circle-x"></i>
</div>
- </FormSection>
- </template>
- </MkExtensionInstaller>
- <div v-else-if="uiPhase === 'error'" class="_gaps_m" :class="[$style.extInstallerRoot, $style.error]">
- <div :class="$style.extInstallerIconWrapper">
- <i class="ti ti-circle-x"></i>
- </div>
- <h2 :class="$style.extInstallerTitle">{{ errorKV?.title }}</h2>
- <div :class="$style.extInstallerNormDesc">{{ errorKV?.description }}</div>
- <div class="_buttonsCenter">
- <MkButton @click="close_()">{{ i18n.ts.close }}</MkButton>
- </div>
- </div>
- </MkSpacer>
-</MkStickyContainer>
+ <h2 :class="$style.extInstallerTitle">{{ errorKV?.title }}</h2>
+ <div :class="$style.extInstallerNormDesc">{{ errorKV?.description }}</div>
+ <div class="_buttonsCenter">
+ <MkButton @click="close_()">{{ i18n.ts.close }}</MkButton>
+ </div>
+ </div>
+ </MkSpacer>
+ </MkStickyContainer>
+ </div>
+</div>
</template>
<script lang="ts" setup>
@@ -58,6 +63,7 @@ import { parseThemeCode, installTheme } from '@/theme.js';
import { unisonReload } from '@/utility/unison-reload.js';
import { i18n } from '@/i18n.js';
import { definePage } from '@/page.js';
+import MkAnimBg from '@/components/MkAnimBg.vue';
const uiPhase = ref<'fetching' | 'confirm' | 'error'>('fetching');
const errorKV = ref<{