docs: link PGlite product page to new PGlite website. (#1514)

docs/.vitepress/theme/custom.css

@@ -16,6 +16,16 @@
   --pglite-color: #F6F95C;
 }
 
+.vp-doc a.VPButton {
+  text-decoration: none;
+}
+.VPButton.pglite,
+.VPButton.pglite:hover {
+  background-color: var(--pglite-color);
+  border-color: var(--pglite-color);
+  color: var(--vp-c-bg);
+}
+
 .img-row {
   display: grid;
   grid-template-columns: repeat(1, 1fr);

docs/product/pglite.md

@@ -2,13 +2,30 @@
 outline: deep
 ---
 
+<script setup>
+import { VPButton } from 'vitepress/theme-without-fonts'
+</script>
+
 <img src="/img/icons/pglite.svg" class="product-icon" />
 
 # PGlite
 
 Embed a lightweight client Postgres with
 real-time, reactive bindings.
 
+<VPButton
+    href="https://pglite.dev"
+    target="_blank"
+    text="PGlite website ↗"
+    theme="pglite"
+/>
+&nbsp;
+<VPButton href="https://github.com/electric-sql/pglite"
+    target="_blank"
+    text="GitHub repo ↗"
+    theme="alt"
+/>
+
 ## Use cases
 
 PGlite is a lightweight WASM Postgres build, packaged into a TypeScript library for the browser, Node.js, Bun and Deno.
@@ -35,4 +52,17 @@ Unlike previous "Postgres in the browser" projects, PGlite does not use a Linux
 
 ## How do I use it?
 
-See the [electric-sql/pglite](https://github.com/electric-sql/pglite) repo for more details.
+See the website and repo for more details:
+
+<VPButton
+    href="https://pglite.dev"
+    target="_blank"
+    text="PGlite website ↗"
+    theme="pglite"
+/>
+&nbsp;
+<VPButton href="https://github.com/electric-sql/pglite"
+    target="_blank"
+    text="GitHub repo ↗"
+    theme="alt"
+/>