From 0c682dd02778eedc57ceb3dbcf4d1a528d4b4fc3 Mon Sep 17 00:00:00 2001
From: syuilo <4439005+syuilo@users.noreply.github.com>
Date: Thu, 20 Mar 2025 13:34:57 +0900
Subject: [PATCH] =?UTF-8?q?=F0=9F=8E=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../frontend/src/pages/install-extensions.vue | 69 +++++++++----------
 1 file changed, 31 insertions(+), 38 deletions(-)

diff --git a/packages/frontend/src/pages/install-extensions.vue b/packages/frontend/src/pages/install-extensions.vue
index 40d58027de..5963745d87 100644
--- a/packages/frontend/src/pages/install-extensions.vue
+++ b/packages/frontend/src/pages/install-extensions.vue
@@ -5,41 +5,38 @@ SPDX-License-Identifier: AGPL-3.0-only
 
 <template>
 <MkPageWithAnimBg>
-	<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>
-				<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>
+	<MkSpacer :contentMax="550" :marginMax="50">
+		<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>
-		</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>
 </MkPageWithAnimBg>
 </template>
 
@@ -235,10 +232,6 @@ url.value = urlParams.get('url');
 hash.value = urlParams.get('hash');
 fetch();
 
-const headerActions = computed(() => []);
-
-const headerTabs = computed(() => []);
-
 definePage(() => ({
 	title: i18n.ts._externalResourceInstaller.title,
 	icon: 'ti ti-download',