From abf80da2c19fde1064307ccb35f158c3a0e2459c Mon Sep 17 00:00:00 2001
From: Steph <35910788+huynhicode@users.noreply.github.com>
Date: Thu, 13 Feb 2025 03:46:28 -0800
Subject: [PATCH 1/6] wip

---
 src/lib/components/Navbar.svelte       |   3 +-
 src/lib/util/promos/January2025.svelte | 142 +++++++++++++++++++++----
 2 files changed, 120 insertions(+), 25 deletions(-)

diff --git a/src/lib/components/Navbar.svelte b/src/lib/components/Navbar.svelte
index 15ee452a..b3ec50f6 100644
--- a/src/lib/components/Navbar.svelte
+++ b/src/lib/components/Navbar.svelte
@@ -60,8 +60,7 @@
 </script>
 
 {#if activePromotion}
-  <div
-    class="top-bar z-10 flex h-fit w-full items-center justify-center bg-gradient-to-r from-[#bd34fe] to-[#ff3670] p-1 text-center text-white">
+  <div class="top-bar z-10 flex h-fit w-full">
     <div
       class="flex flex-grow"
       role="button"
diff --git a/src/lib/util/promos/January2025.svelte b/src/lib/util/promos/January2025.svelte
index 8e7fe956..31503bde 100644
--- a/src/lib/util/promos/January2025.svelte
+++ b/src/lib/util/promos/January2025.svelte
@@ -3,53 +3,149 @@
   import { fade } from 'svelte/transition';
 
   interface Taglines {
+    name: string;
+    design: string;
     label: string;
     url: string;
   }
 
-  const taglines: Taglines[] = [
+  const allTaglines: Taglines[] = [
     {
-      label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
-      url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=whiteboard'
+      name: 'A AI Bundle',
+      design: '1',
+      label: '1 Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Chart',
+      url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=AIbundle_A'
     },
     {
-      label: 'Use the Visual Editor in Mermaid Chart to design and build diagrams',
-      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=visual_editor'
+      name: 'B AI Bundle',
+      design: '2',
+      label: 'Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Chart',
+      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=AIbundle_B'
     },
     {
+      name: 'C AI Bundle',
+      design: '1',
+      label: '1 Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Pro',
+      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=AIbundle_C'
+    },
+    {
+      name: 'D AI Bundle',
+      design: '2',
+      label: 'Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Pro',
+      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=AIbundle_D'
+    },
+    {
+      name: 'A Teams',
+      design: '1',
+      label: '1 Diagram live with teammates in Mermaid Chart',
+      url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=teams_A'
+    },
+    {
+      name: 'B Teams',
+      design: '2',
       label: 'Diagram live with teammates in Mermaid Chart',
-      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=teams'
+      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=teams_B'
     },
     {
-      label: 'Replace ChatGPT Pro, Mermaid.live, and LucidChart with Mermaid Pro',
-      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=AIbundle'
+      name: 'C Teams',
+      design: '1',
+      label: '1 Diagram live with teammates in Mermaid Pro',
+      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=teams_C'
+    },
+    {
+      name: 'D Teams',
+      design: '2',
+      label: 'Diagram live with teammates in Mermaid Pro',
+      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=teams_D'
+    },
+    {
+      name: 'A Visual Editor',
+      design: '1',
+      label: '1 Use the Visual Editor in Mermaid Chart to design and build diagrams',
+      url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=visual_editor_A'
+    },
+    {
+      name: 'B Visual Editor',
+      design: '2',
+      label: 'Use the Visual Editor in Mermaid Chart to design and build diagrams',
+      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=visual_editor_B'
+    },
+    {
+      name: 'C Visual Editor',
+      design: '1',
+      label: '1 Use the Visual Editor in Mermaid Pro to design and build diagrams',
+      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=visual_editor_C'
+    },
+    {
+      name: 'D Visual Editor',
+      design: '2',
+      label: 'Use the Visual Editor in Mermaid Pro to design and build diagrams',
+      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=visual_editor_D'
+    },
+    {
+      name: 'A Whiteboard',
+      design: '1',
+      label: '1 Explore the Mermaid Whiteboard from the creators of Mermaid',
+      url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=whiteboard_A'
+    },
+    {
+      name: 'B Whiteboard',
+      design: '2',
+      label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
+      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=whiteboard_A'
+    },
+    {
+      name: 'C Whiteboard',
+      design: '1',
+      label: '1 Explore the Mermaid Whiteboard from the creators of Mermaid',
+      url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=whiteboard_B'
+    },
+    {
+      name: 'D Whiteboard',
+      design: '2',
+      label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
+      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=whiteboard_B'
     }
   ];
 
+  const sets = ['A', 'B', 'C', 'D'];
+  let selectedSet = sets[Math.floor(Math.random() * sets.length)];
+
+  const taglines = allTaglines.filter((tagline) => tagline.name.startsWith(selectedSet));
+
   let index = Math.floor(Math.random() * taglines.length);
   let currentTagline = $state(taglines[index]);
 
   const interval = setInterval(() => {
     index = (index + 1) % taglines.length;
     currentTagline = taglines[index];
-  }, 5000);
+  }, 2000);
 
   onDestroy(() => {
     clearInterval(interval);
   });
 </script>
 
-<div class="grid w-full">
-  {#key currentTagline}
-    <a
-      href={currentTagline.url}
-      target="_blank"
-      class="col-start-1 row-start-1 flex items-center justify-center gap-4 no-underline"
-      in:fade={{ delay: 750 }}
-      out:fade={{ duration: 1000 }}>
-      <span class="text-sm tracking-wider">{currentTagline.label}</span>
-      <button class="rounded bg-[#111113] p-1 px-2 text-sm font-semibold tracking-wide"
-        >Try now</button>
-    </a>
-  {/key}
-</div>
+{#key currentTagline}
+  <div class="w-full">
+    <div
+      class={currentTagline.design === '1'
+        ? 'bg-gradient-to-r from-[#bd34fe] to-[#ff3670] '
+        : 'bg-[#2E2183]'}>
+      <a
+        href={currentTagline.url}
+        target="_blank"
+        class="col-start-1 row-start-1 flex items-center justify-center gap-4 no-underline"
+        in:fade={{ delay: 750 }}
+        out:fade={{ duration: 1000 }}>
+        <span class="text-sm tracking-wider">{currentTagline.label}</span>
+        <button
+          class="rounded p-1 px-2 text-sm font-semibold tracking-wide {currentTagline.design === '1'
+            ? 'bg-[#2E2183]'
+            : currentTagline.design === '2'
+              ? 'bg-[#E0095F]'
+              : ''}">Try now</button>
+      </a>
+    </div>
+  </div>
+{/key}

From 23bb5d63dc7435fdb26d758751019c1c5bb75d71 Mon Sep 17 00:00:00 2001
From: Steph <35910788+huynhicode@users.noreply.github.com>
Date: Thu, 13 Feb 2025 03:57:41 -0800
Subject: [PATCH 2/6] update urls

---
 src/lib/util/promos/January2025.svelte | 48 +++++++++++++-------------
 1 file changed, 24 insertions(+), 24 deletions(-)

diff --git a/src/lib/util/promos/January2025.svelte b/src/lib/util/promos/January2025.svelte
index 31503bde..abcc448d 100644
--- a/src/lib/util/promos/January2025.svelte
+++ b/src/lib/util/promos/January2025.svelte
@@ -13,98 +13,98 @@
     {
       name: 'A AI Bundle',
       design: '1',
-      label: '1 Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Chart',
-      url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=AIbundle_A'
+      label: 'Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Chart',
+      url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=AIbundle_A'
     },
     {
       name: 'B AI Bundle',
       design: '2',
       label: 'Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Chart',
-      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=AIbundle_B'
+      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=AIbundle_B'
     },
     {
       name: 'C AI Bundle',
       design: '1',
-      label: '1 Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Pro',
-      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=AIbundle_C'
+      label: 'Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Pro',
+      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=AIbundle_C'
     },
     {
       name: 'D AI Bundle',
       design: '2',
       label: 'Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Pro',
-      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=AIbundle_D'
+      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=AIbundle_D'
     },
     {
       name: 'A Teams',
       design: '1',
-      label: '1 Diagram live with teammates in Mermaid Chart',
-      url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=teams_A'
+      label: 'Diagram live with teammates in Mermaid Chart',
+      url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=teams_A'
     },
     {
       name: 'B Teams',
       design: '2',
       label: 'Diagram live with teammates in Mermaid Chart',
-      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=teams_B'
+      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=teams_B'
     },
     {
       name: 'C Teams',
       design: '1',
-      label: '1 Diagram live with teammates in Mermaid Pro',
-      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=teams_C'
+      label: 'Diagram live with teammates in Mermaid Pro',
+      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=teams_C'
     },
     {
       name: 'D Teams',
       design: '2',
       label: 'Diagram live with teammates in Mermaid Pro',
-      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=teams_D'
+      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=teams_D'
     },
     {
       name: 'A Visual Editor',
       design: '1',
-      label: '1 Use the Visual Editor in Mermaid Chart to design and build diagrams',
-      url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=visual_editor_A'
+      label: 'Use the Visual Editor in Mermaid Chart to design and build diagrams',
+      url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=visual_editor_A'
     },
     {
       name: 'B Visual Editor',
       design: '2',
       label: 'Use the Visual Editor in Mermaid Chart to design and build diagrams',
-      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=visual_editor_B'
+      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=visual_editor_B'
     },
     {
       name: 'C Visual Editor',
       design: '1',
-      label: '1 Use the Visual Editor in Mermaid Pro to design and build diagrams',
-      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=visual_editor_C'
+      label: 'Use the Visual Editor in Mermaid Pro to design and build diagrams',
+      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=visual_editor_C'
     },
     {
       name: 'D Visual Editor',
       design: '2',
       label: 'Use the Visual Editor in Mermaid Pro to design and build diagrams',
-      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=visual_editor_D'
+      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=visual_editor_D'
     },
     {
       name: 'A Whiteboard',
       design: '1',
-      label: '1 Explore the Mermaid Whiteboard from the creators of Mermaid',
-      url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=whiteboard_A'
+      label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
+      url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=whiteboard_A'
     },
     {
       name: 'B Whiteboard',
       design: '2',
       label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
-      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=whiteboard_A'
+      url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=whiteboard_A'
     },
     {
       name: 'C Whiteboard',
       design: '1',
-      label: '1 Explore the Mermaid Whiteboard from the creators of Mermaid',
-      url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=whiteboard_B'
+      label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
+      url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=whiteboard_B'
     },
     {
       name: 'D Whiteboard',
       design: '2',
       label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
-      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=whiteboard_B'
+      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=whiteboard_B'
     }
   ];
 

From bb224b486a0e6f9c37c34deccb8c682841c32e11 Mon Sep 17 00:00:00 2001
From: Sidharth Vinod <sidharthv96@gmail.com>
Date: Thu, 13 Feb 2025 18:26:26 +0530
Subject: [PATCH 3/6] fix: Position of text when switching, data structure for
 links

---
 src/lib/components/Navbar.svelte       |   2 +-
 src/lib/util/promos/January2025.svelte | 228 ++++++++++++-------------
 2 files changed, 106 insertions(+), 124 deletions(-)

diff --git a/src/lib/components/Navbar.svelte b/src/lib/components/Navbar.svelte
index b3ec50f6..e2474035 100644
--- a/src/lib/components/Navbar.svelte
+++ b/src/lib/components/Navbar.svelte
@@ -60,7 +60,7 @@
 </script>
 
 {#if activePromotion}
-  <div class="top-bar z-10 flex h-fit w-full">
+  <div class="top-bar z-10 flex h-fit w-full bg-primary">
     <div
       class="flex flex-grow"
       role="button"
diff --git a/src/lib/util/promos/January2025.svelte b/src/lib/util/promos/January2025.svelte
index abcc448d..ec8a7cb0 100644
--- a/src/lib/util/promos/January2025.svelte
+++ b/src/lib/util/promos/January2025.svelte
@@ -3,115 +3,99 @@
   import { fade } from 'svelte/transition';
 
   interface Taglines {
-    name: string;
-    design: string;
     label: string;
     url: string;
   }
 
-  const allTaglines: Taglines[] = [
-    {
-      name: 'A AI Bundle',
-      design: '1',
-      label: 'Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Chart',
-      url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=AIbundle_A'
+  const allTaglines: { [key: string]: { design: number; taglines: Taglines[] } } = {
+    A: {
+      design: 1,
+      taglines: [
+        {
+          label: 'Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Chart',
+          url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=AIbundle_A'
+        },
+        {
+          label: 'Diagram live with teammates in Mermaid Chart',
+          url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=teams_A'
+        },
+        {
+          label: 'Use the Visual Editor in Mermaid Chart to design and build diagrams',
+          url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=visual_editor_A'
+        },
+        {
+          label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
+          url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=whiteboard_A'
+        }
+      ]
     },
-    {
-      name: 'B AI Bundle',
-      design: '2',
-      label: 'Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Chart',
-      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=AIbundle_B'
+    B: {
+      design: 2,
+      taglines: [
+        {
+          label: 'Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Chart',
+          url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=AIbundle_B'
+        },
+        {
+          label: 'Diagram live with teammates in Mermaid Chart',
+          url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=teams_B'
+        },
+        {
+          label: 'Use the Visual Editor in Mermaid Chart to design and build diagrams',
+          url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=visual_editor_B'
+        },
+        {
+          label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
+          url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=whiteboard_A'
+        }
+      ]
     },
-    {
-      name: 'C AI Bundle',
-      design: '1',
-      label: 'Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Pro',
-      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=AIbundle_C'
+    C: {
+      design: 1,
+      taglines: [
+        {
+          label: 'Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Pro',
+          url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=AIbundle_C'
+        },
+        {
+          label: 'Diagram live with teammates in Mermaid Pro',
+          url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=teams_C'
+        },
+        {
+          label: 'Use the Visual Editor in Mermaid Pro to design and build diagrams',
+          url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=visual_editor_C'
+        },
+        {
+          label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
+          url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=whiteboard_B'
+        }
+      ]
     },
-    {
-      name: 'D AI Bundle',
-      design: '2',
-      label: 'Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Pro',
-      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=AIbundle_D'
-    },
-    {
-      name: 'A Teams',
-      design: '1',
-      label: 'Diagram live with teammates in Mermaid Chart',
-      url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=teams_A'
-    },
-    {
-      name: 'B Teams',
-      design: '2',
-      label: 'Diagram live with teammates in Mermaid Chart',
-      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=teams_B'
-    },
-    {
-      name: 'C Teams',
-      design: '1',
-      label: 'Diagram live with teammates in Mermaid Pro',
-      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=teams_C'
-    },
-    {
-      name: 'D Teams',
-      design: '2',
-      label: 'Diagram live with teammates in Mermaid Pro',
-      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=teams_D'
-    },
-    {
-      name: 'A Visual Editor',
-      design: '1',
-      label: 'Use the Visual Editor in Mermaid Chart to design and build diagrams',
-      url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=visual_editor_A'
-    },
-    {
-      name: 'B Visual Editor',
-      design: '2',
-      label: 'Use the Visual Editor in Mermaid Chart to design and build diagrams',
-      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=visual_editor_B'
-    },
-    {
-      name: 'C Visual Editor',
-      design: '1',
-      label: 'Use the Visual Editor in Mermaid Pro to design and build diagrams',
-      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=visual_editor_C'
-    },
-    {
-      name: 'D Visual Editor',
-      design: '2',
-      label: 'Use the Visual Editor in Mermaid Pro to design and build diagrams',
-      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=visual_editor_D'
-    },
-    {
-      name: 'A Whiteboard',
-      design: '1',
-      label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
-      url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=whiteboard_A'
-    },
-    {
-      name: 'B Whiteboard',
-      design: '2',
-      label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
-      url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=whiteboard_A'
-    },
-    {
-      name: 'C Whiteboard',
-      design: '1',
-      label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
-      url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=whiteboard_B'
-    },
-    {
-      name: 'D Whiteboard',
-      design: '2',
-      label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
-      url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=whiteboard_B'
+    D: {
+      design: 2,
+      taglines: [
+        {
+          label: 'Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Pro',
+          url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=AIbundle_D'
+        },
+        {
+          label: 'Diagram live with teammates in Mermaid Pro',
+          url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=teams_D'
+        },
+        {
+          label: 'Use the Visual Editor in Mermaid Pro to design and build diagrams',
+          url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=visual_editor_D'
+        },
+        {
+          label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
+          url: 'https://www.mermaidchart.com/play?utm_source=mermaid_live_editor&utm_medium=banner_ad&utm_campaign=whiteboard_B'
+        }
+      ]
     }
-  ];
+  };
 
-  const sets = ['A', 'B', 'C', 'D'];
-  let selectedSet = sets[Math.floor(Math.random() * sets.length)];
-
-  const taglines = allTaglines.filter((tagline) => tagline.name.startsWith(selectedSet));
+  const { design, taglines } =
+    Object.values(allTaglines)[Math.floor(Math.random() * Object.values(allTaglines).length)];
 
   let index = Math.floor(Math.random() * taglines.length);
   let currentTagline = $state(taglines[index]);
@@ -126,26 +110,24 @@
   });
 </script>
 
-{#key currentTagline}
-  <div class="w-full">
-    <div
-      class={currentTagline.design === '1'
-        ? 'bg-gradient-to-r from-[#bd34fe] to-[#ff3670] '
-        : 'bg-[#2E2183]'}>
-      <a
-        href={currentTagline.url}
-        target="_blank"
-        class="col-start-1 row-start-1 flex items-center justify-center gap-4 no-underline"
-        in:fade={{ delay: 750 }}
-        out:fade={{ duration: 1000 }}>
-        <span class="text-sm tracking-wider">{currentTagline.label}</span>
-        <button
-          class="rounded p-1 px-2 text-sm font-semibold tracking-wide {currentTagline.design === '1'
-            ? 'bg-[#2E2183]'
-            : currentTagline.design === '2'
-              ? 'bg-[#E0095F]'
-              : ''}">Try now</button>
-      </a>
-    </div>
-  </div>
-{/key}
+<div
+  class="grid w-full {design === 1
+    ? 'bg-gradient-to-r from-[#bd34fe] to-[#ff3670] '
+    : 'bg-[#2E2183]'} ">
+  {#key currentTagline}
+    <a
+      href={currentTagline.url}
+      target="_blank"
+      class="col-start-1 row-start-1 flex w-full items-center justify-center gap-4 no-underline"
+      in:fade={{ delay: 750 }}
+      out:fade={{ duration: 1000 }}>
+      <span class="text-sm tracking-wider">{currentTagline.label}</span>
+      <button
+        class="rounded p-1 px-2 text-sm font-semibold tracking-wide {design === 1
+          ? 'bg-[#2E2183]'
+          : design === 2
+            ? 'bg-[#E0095F]'
+            : ''}">Try now</button>
+    </a>
+  {/key}
+</div>

From 942840fb6283c2374e00881e7b70a2af65603d75 Mon Sep 17 00:00:00 2001
From: Steph <35910788+huynhicode@users.noreply.github.com>
Date: Thu, 13 Feb 2025 15:41:19 -0800
Subject: [PATCH 4/6] update interval

---
 src/lib/util/promos/January2025.svelte | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/lib/util/promos/January2025.svelte b/src/lib/util/promos/January2025.svelte
index ec8a7cb0..f1f1a424 100644
--- a/src/lib/util/promos/January2025.svelte
+++ b/src/lib/util/promos/January2025.svelte
@@ -103,7 +103,7 @@
   const interval = setInterval(() => {
     index = (index + 1) % taglines.length;
     currentTagline = taglines[index];
-  }, 2000);
+  }, 5000);
 
   onDestroy(() => {
     clearInterval(interval);

From 8ddf56191d00bfd4500309942cc3735c14296eeb Mon Sep 17 00:00:00 2001
From: Sidharth Vinod <sidharthv96@gmail.com>
Date: Fri, 14 Feb 2025 13:27:22 +0530
Subject: [PATCH 5/6] chore: Add padding to link

---
 src/lib/util/promos/January2025.svelte | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/lib/util/promos/January2025.svelte b/src/lib/util/promos/January2025.svelte
index ec8a7cb0..b5f3272f 100644
--- a/src/lib/util/promos/January2025.svelte
+++ b/src/lib/util/promos/January2025.svelte
@@ -112,18 +112,18 @@
 
 <div
   class="grid w-full {design === 1
-    ? 'bg-gradient-to-r from-[#bd34fe] to-[#ff3670] '
+    ? 'bg-gradient-to-r from-[#bd34fe] to-[#ff3670]'
     : 'bg-[#2E2183]'} ">
   {#key currentTagline}
     <a
       href={currentTagline.url}
       target="_blank"
-      class="col-start-1 row-start-1 flex w-full items-center justify-center gap-4 no-underline"
+      class="col-start-1 row-start-1 flex items-center justify-center gap-4 p-0.5 no-underline"
       in:fade={{ delay: 750 }}
       out:fade={{ duration: 1000 }}>
       <span class="text-sm tracking-wider">{currentTagline.label}</span>
       <button
-        class="rounded p-1 px-2 text-sm font-semibold tracking-wide {design === 1
+        class="rounded p-0.5 px-2 text-sm font-semibold tracking-wide {design === 1
           ? 'bg-[#2E2183]'
           : design === 2
             ? 'bg-[#E0095F]'

From 1df59ae5dda65e33bf39199320ee97da2f75588e Mon Sep 17 00:00:00 2001
From: Sidharth Vinod <sidharthv96@gmail.com>
Date: Fri, 14 Feb 2025 13:39:04 +0530
Subject: [PATCH 6/6] chore: Cleanup class

---
 src/lib/util/promos/January2025.svelte | 8 +++-----
 1 file changed, 3 insertions(+), 5 deletions(-)

diff --git a/src/lib/util/promos/January2025.svelte b/src/lib/util/promos/January2025.svelte
index cce9817a..3490469f 100644
--- a/src/lib/util/promos/January2025.svelte
+++ b/src/lib/util/promos/January2025.svelte
@@ -123,11 +123,9 @@
       out:fade={{ duration: 1000 }}>
       <span class="text-sm tracking-wider">{currentTagline.label}</span>
       <button
-        class="rounded p-0.5 px-2 text-sm font-semibold tracking-wide {design === 1
-          ? 'bg-[#2E2183]'
-          : design === 2
-            ? 'bg-[#E0095F]'
-            : ''}">Try now</button>
+        class="rounded p-0.5 px-2 text-sm font-semibold tracking-wide"
+        class:bg-[#2E2183]={design === 1}
+        class:bg-[#E0095F]={design === 2}>Try now</button>
     </a>
   {/key}
 </div>