docs: add 3d party GPU hosting services

docs/src/content/docs/index.mdx

@@ -118,8 +118,8 @@ Ready to unleash your creativity? Invoke is available for Windows, macOS, and Li
 
 ---
 
-:::note[About the Hosted Version]
-The Invoke hosted platform has been shut down as the founding team joined Adobe. However, Invoke lives on as a thriving open-source project maintained by the community.
+:::note[About the former Invoke.ai-hosted version]
+The Invoke.ai hosted platform has been shut down as the founding team joined Adobe. However, Invoke lives on as a thriving open-source project maintained by the community.
 
 The open-source version offers the same powerful features you may have used in the hosted service, with the added benefit of complete control and privacy through self-hosting.
 

docs/src/lib/components/DownloadOptions.astro

@@ -49,6 +49,24 @@ const manualDownloadOptions = {
     href: withBase('/configuration/docker/', import.meta.env.BASE_URL),
   },
 };
+
+const hostedOptions = {
+  aibadgr: {
+     headline: 'Run on AI Badgr',
+     description: 'Run on the AI Badgr hosted GPU service',
+     href: 'https://aibadgr.com/gpu/launch?template=invokeai',
+   },
+  runpod: {
+     headline: 'Run on RunPod',
+     description: 'Run on the RunPod hosted GPU service',
+     href: 'https://www.runpod.io/blog/invoke-ai-stable-diffusion-runpod-nfz18',
+   },
+  railway: {
+     headline: 'Run on Railway',
+     description: 'Run on the Railway hosted GPU service',
+     href: 'https://railway.com/deploy/invokeai',
+   },
+};
 ---
 
 <div class="download-options">
@@ -92,6 +110,27 @@ const manualDownloadOptions = {
       ))
     }
   </div>
+
+  <!-- Hosted -->
+  <div class="download-options__separator download-options__separator--text">
+    <span align="center">Commercial Hosted Service Options</span>
+  </div>
+
+  <!-- Hosted Options -->
+  <div class="download-options__grid download-options--launcher">
+    {
+      Object.entries(hostedOptions).map(
+        ([key, { headline, description, href }]) => (
+          <div class="download-option" data-platform={key}>
+            <h3>{headline}</h3>
+	    <a href={href}>{description}</a>
+            </div>
+          </div>
+        ),
+      )
+    }
+  </div>
+
 </div>
 
 <style is:global>
@@ -134,6 +173,15 @@ const manualDownloadOptions = {
     }
   }
 
+  .download-options__separator--text > span {
+    border-radius: 0;
+    border: none;
+    width: auto;
+    aspect-ratio: auto;
+    padding: 0 0.75rem;
+    white-space: nowrap;
+  }
+
   .download-options--launcher {
     display: grid;
     gap: 1.5rem;

docs/src/styles/custom.css

@@ -342,6 +342,11 @@ article.card {
 
 /* Splash Page-specific styles */
 
+/* Make the default body font a bit smaller on the splash/home page. */
+[data-has-hero] .sl-markdown-content {
+  font-size: 0.9rem;
+}
+
 @keyframes splash-animate {
   0% { background-position: 0% 0%; }
   50% { background-position: 0% 100%; }