From 534a10edea8be7cd11b7dcfc636e721ad506a632 Mon Sep 17 00:00:00 2001
From: steph <steph@huynhicode.dev>
Date: Wed, 26 Jun 2024 21:24:27 -0700
Subject: [PATCH 1/3] add product hunt badge to homepage

---
 .../.vitepress/components/ProductHuntBadge.vue     | 14 ++++++++++++++
 .../mermaid/src/docs/.vitepress/theme/index.ts     |  3 +++
 2 files changed, 17 insertions(+)
 create mode 100644 packages/mermaid/src/docs/.vitepress/components/ProductHuntBadge.vue

diff --git a/packages/mermaid/src/docs/.vitepress/components/ProductHuntBadge.vue b/packages/mermaid/src/docs/.vitepress/components/ProductHuntBadge.vue
new file mode 100644
index 0000000000..b283c644cb
--- /dev/null
+++ b/packages/mermaid/src/docs/.vitepress/components/ProductHuntBadge.vue
@@ -0,0 +1,14 @@
+<template>
+  <div class="-mt-6 mb-8">
+    <a
+      href="https://www.producthunt.com/products/mermaid-chart?utm_source=badge-follow&utm_medium=badge&utm_souce=badge-mermaid&#0045;chart"
+      target="_blank"
+      ><img
+        src="https://api.producthunt.com/widgets/embed-image/v1/follow.svg?product_id=552855&theme=light"
+        alt="Mermaid&#0032;Chart - A&#0032;smarter&#0032;way&#0032;to&#0032;create&#0032;diagrams | Product Hunt"
+        style="width: 250px; height: 54px"
+        width="250"
+        height="54"
+    /></a>
+  </div>
+</template>
diff --git a/packages/mermaid/src/docs/.vitepress/theme/index.ts b/packages/mermaid/src/docs/.vitepress/theme/index.ts
index 3ebb7614a1..4fd4d7b66f 100644
--- a/packages/mermaid/src/docs/.vitepress/theme/index.ts
+++ b/packages/mermaid/src/docs/.vitepress/theme/index.ts
@@ -8,6 +8,8 @@ import Contributors from '../components/Contributors.vue';
 import HomePage from '../components/HomePage.vue';
 // @ts-ignore
 import TopBar from '../components/TopBar.vue';
+// @ts-ignore
+import ProductHuntBadge from '../components/ProductHuntBadge.vue';
 import { getRedirect } from './redirect.js';
 import { h } from 'vue';
 import Theme from 'vitepress/theme';
@@ -21,6 +23,7 @@ export default {
     return h(Theme.Layout, null, {
       // Keeping this as comment as it took a lot of time to figure out how to add a component to the top bar.
       'home-hero-before': () => h(TopBar),
+      'home-hero-info-before': () => h(ProductHuntBadge),
       'home-features-after': () => h(HomePage),
     });
   },

From 0691c722c37e79e89139dcd1f390149748c4a012 Mon Sep 17 00:00:00 2001
From: steph <steph@huynhicode.dev>
Date: Wed, 26 Jun 2024 22:21:49 -0700
Subject: [PATCH 2/3] update product hunt badge on mermaid chart page

---
 docs/ecosystem/mermaid-chart.md                      | 2 +-
 packages/mermaid/src/docs/ecosystem/mermaid-chart.md | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/docs/ecosystem/mermaid-chart.md b/docs/ecosystem/mermaid-chart.md
index f1ca85af0c..9b3440a0a5 100644
--- a/docs/ecosystem/mermaid-chart.md
+++ b/docs/ecosystem/mermaid-chart.md
@@ -12,7 +12,7 @@ Try the Ultimate AI, Mermaid, and Visual Diagramming Suite by creating an accoun
 
 <br />
 
-<a href="https://www.producthunt.com/posts/mermaid-chart?utm_source=badge-featured&utm_medium=badge&utm_souce=badge-mermaid&#0045;chart" target="_blank"><img src="https://api.producthunt.com/widgets/embed-image/v1/featured.svg?post_id=416671&theme=light" alt="Mermaid&#0032;Chart - A&#0032;smarter&#0032;way&#0032;to&#0032;create&#0032;diagrams | Product Hunt" style="width: 250px; height: 54px;" width="250" height="54" /></a>
+<a href="https://www.producthunt.com/products/mermaid-chart?utm_source=badge-follow&utm_medium=badge&utm_souce=badge-mermaid&#0045;chart" target="_blank"><img src="https://api.producthunt.com/widgets/embed-image/v1/follow.svg?product_id=552855&theme=light" alt="Mermaid&#0032;Chart - A&#0032;smarter&#0032;way&#0032;to&#0032;create&#0032;diagrams | Product Hunt" style="width: 250px; height: 54px;" width="250" height="54" /></a>
 
 ## About
 
diff --git a/packages/mermaid/src/docs/ecosystem/mermaid-chart.md b/packages/mermaid/src/docs/ecosystem/mermaid-chart.md
index 732b9b68cd..049df836ef 100644
--- a/packages/mermaid/src/docs/ecosystem/mermaid-chart.md
+++ b/packages/mermaid/src/docs/ecosystem/mermaid-chart.md
@@ -6,7 +6,7 @@ Try the Ultimate AI, Mermaid, and Visual Diagramming Suite by creating an accoun
 
 <br />
 
-<a href="https://www.producthunt.com/posts/mermaid-chart?utm_source=badge-featured&utm_medium=badge&utm_souce=badge-mermaid&#0045;chart" target="_blank"><img src="https://api.producthunt.com/widgets/embed-image/v1/featured.svg?post_id=416671&theme=light" alt="Mermaid&#0032;Chart - A&#0032;smarter&#0032;way&#0032;to&#0032;create&#0032;diagrams | Product Hunt" style="width: 250px; height: 54px;" width="250" height="54" /></a>
+<a href="https://www.producthunt.com/products/mermaid-chart?utm_source=badge-follow&utm_medium=badge&utm_souce=badge-mermaid&#0045;chart" target="_blank"><img src="https://api.producthunt.com/widgets/embed-image/v1/follow.svg?product_id=552855&theme=light" alt="Mermaid&#0032;Chart - A&#0032;smarter&#0032;way&#0032;to&#0032;create&#0032;diagrams | Product Hunt" style="width: 250px; height: 54px;" width="250" height="54" /></a>
 
 ## About
 

From 7391b05c43989b9c26200ecb3500b1bc2338e830 Mon Sep 17 00:00:00 2001
From: steph <steph@huynhicode.dev>
Date: Wed, 26 Jun 2024 22:23:42 -0700
Subject: [PATCH 3/3] add announcement bar to docs and minor styling update

---
 packages/mermaid/src/docs/.vitepress/components/TopBar.vue | 2 +-
 packages/mermaid/src/docs/.vitepress/theme/index.ts        | 1 +
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/mermaid/src/docs/.vitepress/components/TopBar.vue b/packages/mermaid/src/docs/.vitepress/components/TopBar.vue
index 130d6babc2..d8e36ded48 100644
--- a/packages/mermaid/src/docs/.vitepress/components/TopBar.vue
+++ b/packages/mermaid/src/docs/.vitepress/components/TopBar.vue
@@ -1,6 +1,6 @@
 <template>
   <div
-    class="w-full top-bar bg-gradient-to-r from-[#bd34fe] to-[#ff3670] flex items-center text-center justify-center p-1 text-white"
+    class="mb-4 w-full top-bar bg-gradient-to-r from-[#bd34fe] to-[#ff3670] flex items-center text-center justify-center p-1 text-white"
   >
     <p class="flex-grow text-center tracking-wide text-text">
       <a
diff --git a/packages/mermaid/src/docs/.vitepress/theme/index.ts b/packages/mermaid/src/docs/.vitepress/theme/index.ts
index 4fd4d7b66f..0409b4c771 100644
--- a/packages/mermaid/src/docs/.vitepress/theme/index.ts
+++ b/packages/mermaid/src/docs/.vitepress/theme/index.ts
@@ -25,6 +25,7 @@ export default {
       'home-hero-before': () => h(TopBar),
       'home-hero-info-before': () => h(ProductHuntBadge),
       'home-features-after': () => h(HomePage),
+      'doc-before': () => h(TopBar),
     });
   },
   enhanceApp({ app, router }: EnhanceAppContext) {