From d42f2fb60acfb0ca4602a428e841f6e6582430c2 Mon Sep 17 00:00:00 2001
From: tdgao <mr.trumgao@gmail.com>
Date: Thu, 2 Apr 2026 13:48:45 -0600
Subject: [PATCH 1/3] fix small width responsiveness

---
 .../servers/server-list-empty/ServerListEmpty.vue         | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/packages/ui/src/components/servers/server-list-empty/ServerListEmpty.vue b/packages/ui/src/components/servers/server-list-empty/ServerListEmpty.vue
index 51dd4825c6..bf4114d432 100644
--- a/packages/ui/src/components/servers/server-list-empty/ServerListEmpty.vue
+++ b/packages/ui/src/components/servers/server-list-empty/ServerListEmpty.vue
@@ -1,7 +1,7 @@
 <template>
-	<div class="flex gap-8 items-center justify-center py-10">
+	<div class="grid grid-cols-2 gap-8 items-center justify-center py-10 max-w-[760px]">
 		<!-- Left column -->
-		<div class="flex flex-col gap-8 items-start pr-8 shrink-0 w-[380px]">
+		<div class="flex flex-col gap-8 items-start pr-8 shrink-0">
 			<!-- Heading -->
 			<div class="flex flex-col gap-2 items-start w-[300px]">
 				<p class="text-sm text-secondary">{{ formatMessage(messages.modrinthHostingLabel) }}</p>
@@ -65,7 +65,7 @@
 			</div>
 
 			<!-- CTA section -->
-			<div class="flex flex-col gap-6 items-start w-[300px]">
+			<div class="flex flex-col gap-6 items-start">
 				<div class="flex flex-col gap-3 items-start">
 					<ButtonStyled color="brand">
 						<button @click="onClickNewServer?.()">
@@ -104,7 +104,7 @@
 
 		<!-- Right column - mod icon grid -->
 		<div
-			class="relative flex h-[617px] w-[380px] shrink-0 items-center justify-center overflow-hidden rounded-[40px] pointer-events-none select-none [mask-image:linear-gradient(to_bottom,black_0%,black_35%,transparent_100%)] [-webkit-mask-image:linear-gradient(to_bottom,black_0%,black_35%,transparent_100%)]"
+			class="relative flex h-[617px] shrink-0 items-center justify-center overflow-hidden rounded-[40px] pointer-events-none select-none [mask-image:linear-gradient(to_bottom,black_0%,black_35%,transparent_100%)] [-webkit-mask-image:linear-gradient(to_bottom,black_0%,black_35%,transparent_100%)]"
 		>
 			<div class="rotate-[15deg]">
 				<div class="flex flex-col gap-4">

From 486f7d6957445e87e6dd17f04c213d6821d3329a Mon Sep 17 00:00:00 2001
From: tdgao <mr.trumgao@gmail.com>
Date: Thu, 2 Apr 2026 14:00:45 -0600
Subject: [PATCH 2/3] fix build error

---
 apps/frontend/src/pages/hosting/index.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/frontend/src/pages/hosting/index.vue b/apps/frontend/src/pages/hosting/index.vue
index b2743a985c..84734ba18a 100644
--- a/apps/frontend/src/pages/hosting/index.vue
+++ b/apps/frontend/src/pages/hosting/index.vue
@@ -643,6 +643,7 @@ import {
 	injectModrinthClient,
 	injectNotificationManager,
 	IntlFormatted,
+	LoaderIcon,
 	ModrinthServersPurchaseModal,
 	useFormatPrice,
 	useVIntl,
@@ -652,7 +653,6 @@ import { useQuery } from '@tanstack/vue-query'
 import { computed } from 'vue'
 
 import OptionGroup from '~/components/ui/OptionGroup.vue'
-import { LoaderIcon } from '@modrinth/ui/src/components/servers/icons'
 import MedalPlanPromotion from '~/components/ui/servers/marketing/MedalPlanPromotion.vue'
 import ServerPlanSelector from '~/components/ui/servers/marketing/ServerPlanSelector.vue'
 import { products } from '~/generated/state.json'

From 7484df897f1e94ec1d2a1312b7c427d0d65c2125 Mon Sep 17 00:00:00 2001
From: tdgao <mr.trumgao@gmail.com>
Date: Thu, 2 Apr 2026 14:06:16 -0600
Subject: [PATCH 3/3] fix provisioning state

---
 packages/ui/src/stories/servers/ServerListing.stories.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/ui/src/stories/servers/ServerListing.stories.ts b/packages/ui/src/stories/servers/ServerListing.stories.ts
index 45a1c5ba5e..d1fff61904 100644
--- a/packages/ui/src/stories/servers/ServerListing.stories.ts
+++ b/packages/ui/src/stories/servers/ServerListing.stories.ts
@@ -89,7 +89,7 @@ export const Provisioning: Story = {
 	args: {
 		...baseServer,
 		name: 'My New Server',
-		status: 'installing',
+		isProvisioning: true,
 	},
 }