feat: Small improvements to the docs frontpage. (#102)

## Proposed changes

* Make the "Getting Started" link go to `/overview`
* Add links to github and npm
* Move around the logo and add a tagline.
* Turn on sitemap
* Enable "Edit on github" link

<img width="1487" alt="image"
src="https://github.com/user-attachments/assets/226adc58-121c-4044-af31-5d2d6bd6734f"
/>

docs/astro.config.mjs

@@ -5,6 +5,7 @@ import { defineConfig } from "astro/config";
 
 // https://astro.build/config
 export default defineConfig({
+  site: "https://gensx.dev",
   integrations: [
     tailwind(),
     starlight({
@@ -24,10 +25,9 @@ export default defineConfig({
         themes: ["light-plus", "dark-plus"],
         useStarlightDarkModeSwitch: false,
       },
-      // TODO: Enable the edit link when we have some content.
-      //   editLink: {
-      //     baseUrl: "https://github.com/cortexclick/gensx/edit/main/docs/",
-      //   },
+      editLink: {
+        baseUrl: "https://github.com/cortexclick/gensx/edit/main/docs/",
+      },
       customCss: ["./src/tailwind.css"],
       sidebar: [
         {
@@ -65,9 +65,9 @@ export default defineConfig({
       applyBaseStyles: false,
     }),
   ],
-  //   adapter: cloudflare({
-  //     imageService: "compile",
-  //   }),
+  // adapter: cloudflare({
+  //   imageService: "compile",
+  // }),
   vite: {
     ssr: {
       external: ["node:buffer", "node:path", "node:url"],

docs/package.json

@@ -27,6 +27,7 @@
     "@astrojs/tailwind": "^5.1.4",
     "@cloudflare/workers-types": "^4.20241230.0",
     "@types/node": "^20.17.11",
+    "sharp": "^0.33.5",
     "tailwindcss": "^3.4.17",
     "typescript": "^5.7.2",
     "wrangler": "^3.99.0"

docs/src/content/docs/index.mdx

@@ -2,23 +2,28 @@
 title: "Declarative LLM workflows"
 template: splash
 hero:
-  title: |
-    <div class="flex justify-center md:justify-start">
-      <img src="/logo.svg" alt="&lt;GenSX /&gt;" class="w-auto h-auto max-w-[200px] md:max-w-[400px]" />
-    </div>
-  tagline: |
-    <div class="md:mt-8 md:inline-block md:border md:border-slate-200 md:dark:border-slate-800 md:rounded-lg md:p-8 md:bg-slate-50/50 md:dark:bg-slate-900/80 md:shadow-sm">
-      <div class="text-center md:text-left">Declarative LLM workflows</div>
-      <div class="mt-6 flex justify-center md:justify-start gap-4">
-        <a href="https://npmjs.com/package/gensx" class="inline-flex items-center justify-center no-underline bg-[#ffde59] hover:bg-[#e5c850] dark:bg-[#ffde59] dark:hover:bg-[#e5c850] text-black font-medium px-6 py-2.5 rounded-full text-sm transition-colors">Get started</a>
-      </div>
-    </div>
+  title: "Declarative LLM workflows"
+  tagline: "Create LLM workflows from components"
   image:
-    html: |
-      <div class="fixed inset-0 z-[-1] overflow-hidden">
-        <div class="absolute inset-0" style="mask-image: radial-gradient(circle at center, black 40%, transparent 70%); -webkit-mask-image: radial-gradient(circle at center, black 40%, transparent 70%);">
-          <div class="absolute inset-0" style="background-image: radial-gradient(circle at center, rgba(100,100,100,0.3) 1px, transparent 1px); background-size: 20px 20px;"></div>
-        </div>
-      </div>
-  actions: []
+    alt: "<GenSX /> - Declarative LLM workflows"
+    file: "../../assets/logo.svg"
+  actions:
+    - text: "Get started"
+      icon: "right-arrow"
+      link: "/overview"
+    - text: "GitHub"
+      link: "https://github.com/cortexclick/gensx"
+      variant: "secondary"
+      icon: "github"
+      attrs:
+        target: "_blank"
+        rel: me
+    - text: "NPM"
+      link: "https://npmjs.com/package/gensx"
+      variant: "secondary"
+      icon: "seti:npm"
+      attrs:
+        target: "_blank"
+        rel: me
+editUrl: false
 ---