From 95a3900aec0c7737e4ba603a58d0bdf2d635fc04 Mon Sep 17 00:00:00 2001
From: CPTProgrammer <46586216+CPTProgrammer@users.noreply.github.com>
Date: Thu, 16 Jul 2026 15:22:06 +0800
Subject: [PATCH] Add platform icons to publish progress bars

---
 public/platform/curseforge.svg  |  2 +-
 public/platform/modrinth.svg    |  2 +-
 src/components/PublishModal.tsx | 77 +++++++++++++++++++--------------
 3 files changed, 47 insertions(+), 34 deletions(-)

diff --git a/public/platform/curseforge.svg b/public/platform/curseforge.svg
index 55df485..e0bdc87 100644
--- a/public/platform/curseforge.svg
+++ b/public/platform/curseforge.svg
@@ -1,3 +1,3 @@
-<svg width="290" height="30" viewBox="0 0 290 30" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg width="40" height="30" viewBox="0 0 40 30" fill="none" xmlns="http://www.w3.org/2000/svg">
     <path d="M30.2145 10.2701C30.2145 10.2701 37.4593 9.12261 38.6035 5.77578H27.5051V3.12012H3.12L6.12396 6.62143V10.2088C6.12396 10.2088 13.7037 9.8129 16.6356 12.0462C20.649 15.7827 12.1217 20.8337 12.1217 20.8337L10.6595 25.6939C12.9461 23.507 17.304 20.6779 25.2941 20.8142C22.2535 21.7795 19.1961 23.2872 16.8159 25.6939H32.9679L31.447 20.8337C31.447 20.8337 19.7403 13.8999 30.2145 10.2706V10.2701Z" fill="#F16436"></path>
 </svg>
diff --git a/public/platform/modrinth.svg b/public/platform/modrinth.svg
index 83a0b89..e501cae 100644
--- a/public/platform/modrinth.svg
+++ b/public/platform/modrinth.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" fill-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2" clip-rule="evenodd" viewBox="0 0 3307 593" class="h-7 w-auto text-contrast transition-transform group-active:scale-[0.98]" aria-hidden="true"><g fill="var(--color-brand)"><path d="m29 424.4 188.2-112.95-17.15-45.48 53.75-55.21 67.93-14.64 19.67 24.21-31.32 31.72-27.3 8.6-19.52 20.05 9.56 26.6 19.4 20.6 27.36-7.28 19.47-21.38 42.51-13.47 12.67 28.5-43.87 53.78-73.5 23.27-32.97-36.7L55.06 467.94C46.1 456.41 35.67 440.08 29 424.4Zm543.03-230.25-149.5 40.32c8.24 21.92 10.95 34.8 13.23 49l149.23-40.26c-2.38-15.94-6.65-32.17-12.96-49.06Z"></path><path d="M51.28 316.13c10.59 125 115.54 223.3 243.27 223.3 96.51 0 180.02-56.12 219.63-137.46l48.61 16.83c-46.78 101.34-149.35 171.75-268.24 171.75C138.6 590.55 10.71 469.38 0 316.13h51.28ZM.78 265.24C15.86 116.36 141.73 0 294.56 0c162.97 0 295.28 132.31 295.28 295.28 0 26.14-3.4 51.49-9.8 75.63l-48.48-16.78a244.28 244.28 0 0 0 7.15-58.85c0-134.75-109.4-244.15-244.15-244.15-124.58 0-227.49 93.5-242.32 214.11H.8Z" class="ring--large ring"></path><path d="M293.77 153.17c-78.49.07-142.2 63.83-142.2 142.34 0 78.56 63.79 142.34 142.35 142.34 3.98 0 7.93-.16 11.83-.49l14.22 49.76a194.65 194.65 0 0 1-26.05 1.74c-106.72 0-193.36-86.64-193.36-193.35 0-106.72 86.64-193.35 193.36-193.35 2.64 0 5.28.05 7.9.16l-8.05 50.85Zm58.2-42.13c78.39 24.67 135.3 97.98 135.3 184.47 0 80.07-48.77 148.83-118.2 178.18l-14.17-49.55c48.08-22.85 81.36-71.89 81.36-128.63 0-60.99-38.44-113.07-92.39-133.32l8.1-51.15Z" class="ring--small ring"></path></g></svg>
+<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" fill-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2" clip-rule="evenodd" viewBox="0 0 593 593" class="h-7 w-auto text-contrast transition-transform group-active:scale-[0.98]" aria-hidden="true"><g fill="#00af5c"><path d="m29 424.4 188.2-112.95-17.15-45.48 53.75-55.21 67.93-14.64 19.67 24.21-31.32 31.72-27.3 8.6-19.52 20.05 9.56 26.6 19.4 20.6 27.36-7.28 19.47-21.38 42.51-13.47 12.67 28.5-43.87 53.78-73.5 23.27-32.97-36.7L55.06 467.94C46.1 456.41 35.67 440.08 29 424.4Zm543.03-230.25-149.5 40.32c8.24 21.92 10.95 34.8 13.23 49l149.23-40.26c-2.38-15.94-6.65-32.17-12.96-49.06Z"></path><path d="M51.28 316.13c10.59 125 115.54 223.3 243.27 223.3 96.51 0 180.02-56.12 219.63-137.46l48.61 16.83c-46.78 101.34-149.35 171.75-268.24 171.75C138.6 590.55 10.71 469.38 0 316.13h51.28ZM.78 265.24C15.86 116.36 141.73 0 294.56 0c162.97 0 295.28 132.31 295.28 295.28 0 26.14-3.4 51.49-9.8 75.63l-48.48-16.78a244.28 244.28 0 0 0 7.15-58.85c0-134.75-109.4-244.15-244.15-244.15-124.58 0-227.49 93.5-242.32 214.11H.8Z" class="ring--large ring"></path><path d="M293.77 153.17c-78.49.07-142.2 63.83-142.2 142.34 0 78.56 63.79 142.34 142.35 142.34 3.98 0 7.93-.16 11.83-.49l14.22 49.76a194.65 194.65 0 0 1-26.05 1.74c-106.72 0-193.36-86.64-193.36-193.35 0-106.72 86.64-193.35 193.36-193.35 2.64 0 5.28.05 7.9.16l-8.05 50.85Zm58.2-42.13c78.39 24.67 135.3 97.98 135.3 184.47 0 80.07-48.77 148.83-118.2 178.18l-14.17-49.55c48.08-22.85 81.36-71.89 81.36-128.63 0-60.99-38.44-113.07-92.39-133.32l8.1-51.15Z" class="ring--small ring"></path></g></svg>
diff --git a/src/components/PublishModal.tsx b/src/components/PublishModal.tsx
index d60e529..12198e6 100644
--- a/src/components/PublishModal.tsx
+++ b/src/components/PublishModal.tsx
@@ -11,6 +11,7 @@ import {
   Select,
   Row,
   Col,
+  Flex,
   Progress,
   Typography,
   Empty,
@@ -364,38 +365,50 @@ export function PublishModal({
       <div>
         {/* Progress bars */}
         <div style={{ marginBottom: token.marginLG }}>
-          {hasModrinth && (
-            <div style={{ marginBottom: token.marginSM }}>
-              <Text>Modrinth: </Text>
-              <Progress
-                percent={Math.round(
-                  (progress.modrinth.done /
-                    Math.max(progress.modrinth.total, 1)) *
-                    100,
-                )}
-                format={() =>
-                  `${progress.modrinth.done} / ${progress.modrinth.total}`
-                }
-                style={{ width: "80%" }}
-              />
-            </div>
-          )}
-          {hasCurseforge && (
-            <div>
-              <Text>CurseForge: </Text>
-              <Progress
-                percent={Math.round(
-                  (progress.curseforge.done /
-                    Math.max(progress.curseforge.total, 1)) *
-                    100,
-                )}
-                format={() =>
-                  `${progress.curseforge.done} / ${progress.curseforge.total}`
-                }
-                style={{ width: "80%" }}
-              />
-            </div>
-          )}
+          <Flex vertical gap={token.marginSM}>
+            {hasModrinth && (
+              <Flex align="center" gap={token.marginXS}>
+                <img
+                  src="/platform/modrinth.svg"
+                  alt="Modrinth"
+                  style={{ width: 30, height: 30, flexShrink: 0 }}
+                />
+                <Text style={{ width: 80, flexShrink: 0, fontFamily: "Inter", fontWeight: "bold" }}>Modrinth</Text>
+                <Progress
+                  percent={Math.round(
+                    (progress.modrinth.done /
+                      Math.max(progress.modrinth.total, 1)) *
+                      100,
+                  )}
+                  format={() =>
+                    `${progress.modrinth.done} / ${progress.modrinth.total}`
+                  }
+                  style={{ flex: 1 }}
+                />
+              </Flex>
+            )}
+            {hasCurseforge && (
+              <Flex align="center" gap={token.marginXS}>
+                <img
+                  src="/platform/curseforge.svg"
+                  alt="CurseForge"
+                  style={{ width: 30, height: 30, flexShrink: 0 }}
+                />
+                <Text style={{ width: 80, flexShrink: 0, fontFamily: "Inter", fontWeight: "bold" }}>CurseForge</Text>
+                <Progress
+                  percent={Math.round(
+                    (progress.curseforge.done /
+                      Math.max(progress.curseforge.total, 1)) *
+                      100,
+                  )}
+                  format={() =>
+                    `${progress.curseforge.done} / ${progress.curseforge.total}`
+                  }
+                  style={{ flex: 1 }}
+                />
+              </Flex>
+            )}
+          </Flex>
         </div>
 
         {/* Result */}