From b56f39ce07d8faa433f28a380e65f49cdb1d7ea5 Mon Sep 17 00:00:00 2001
From: "Calum H." <contact@cal.engineer>
Date: Wed, 26 Nov 2025 23:29:29 +0000
Subject: [PATCH] fix: edit server icon issues (#4821)

---
 .../pages/servers/manage/[id]/options/index.vue | 17 ++++++++++-------
 1 file changed, 10 insertions(+), 7 deletions(-)

diff --git a/apps/frontend/src/pages/servers/manage/[id]/options/index.vue b/apps/frontend/src/pages/servers/manage/[id]/options/index.vue
index ec7e8047..9f228d4b 100644
--- a/apps/frontend/src/pages/servers/manage/[id]/options/index.vue
+++ b/apps/frontend/src/pages/servers/manage/[id]/options/index.vue
@@ -84,16 +84,19 @@
 								@change="uploadFile"
 							/>
 							<div
-								class="absolute top-0 hidden size-[6rem] flex-col items-center justify-center rounded-xl bg-button-bg p-2 opacity-80 group-hover:flex"
+								class="absolute top-0 hidden size-24 flex-col items-center justify-center rounded-xl bg-button-bg p-2 opacity-80 group-hover:flex"
 							>
 								<EditIcon class="h-8 w-8 text-contrast" />
 							</div>
-							<ServerIcon :image="icon" />
+							<ServerIcon class="size-24" :image="icon" />
 						</div>
 						<ButtonStyled>
-							<button v-tooltip="'Synchronize icon with installed modpack'" @click="resetIcon">
-								<TransferIcon class="h-6 w-6" />
-								<span>Sync icon</span>
+							<button
+								v-tooltip="'Synchronize icon with installed modpack'"
+								class="my-auto"
+								@click="resetIcon"
+							>
+								<TransferIcon /> Sync icon
 							</button>
 						</ButtonStyled>
 					</div>
@@ -112,8 +115,8 @@
 </template>
 
 <script setup lang="ts">
-import { EditIcon, ServerIcon, TransferIcon } from '@modrinth/assets'
-import { injectNotificationManager } from '@modrinth/ui'
+import { EditIcon, TransferIcon } from '@modrinth/assets'
+import { injectNotificationManager, ServerIcon } from '@modrinth/ui'
 import ButtonStyled from '@modrinth/ui/src/components/base/ButtonStyled.vue'
 
 import SaveBanner from '~/components/ui/servers/SaveBanner.vue'