From ac778f04dca93bc26e20d4e738a9bd2ddea1d130 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Thu, 5 Feb 2026 14:28:08 +0000
Subject: [PATCH] feat: add Product Hunt embed badge to landing page

Add a Product Hunt featured badge to the hero section of the landing page,
positioned between the action buttons and the install command.

https://claude.ai/code/session_016azfcpwRcBWsy4exiAMCqB
---
 apps/web/src/components/Hero.css | 20 +++++++++++++++++++-
 apps/web/src/components/Hero.tsx | 22 +++++++++++++++++++++-
 2 files changed, 40 insertions(+), 2 deletions(-)

diff --git a/apps/web/src/components/Hero.css b/apps/web/src/components/Hero.css
index 5ebecda..9ba97d4 100644
--- a/apps/web/src/components/Hero.css
+++ b/apps/web/src/components/Hero.css
@@ -136,11 +136,29 @@
   transform: translateY(-2px);
 }
 
+.hero-producthunt {
+  margin-top: 1.5rem;
+}
+
+.hero-producthunt a {
+  display: block;
+  transition: transform 0.2s ease, opacity 0.2s ease;
+}
+
+.hero-producthunt a:hover {
+  transform: translateY(-2px);
+  opacity: 0.9;
+}
+
+.hero-producthunt img {
+  display: block;
+}
+
 .hero-install {
   display: flex;
   align-items: center;
   gap: 0.5rem;
-  margin-top: 2rem;
+  margin-top: 1.5rem;
   padding: 0.75rem 1rem;
   background: var(--bg-secondary);
   border: 1px solid var(--border);
diff --git a/apps/web/src/components/Hero.tsx b/apps/web/src/components/Hero.tsx
index 4214f35..ec52439 100644
--- a/apps/web/src/components/Hero.tsx
+++ b/apps/web/src/components/Hero.tsx
@@ -116,11 +116,31 @@ export default function Hero() {
           </a>
         </motion.div>
 
+        <motion.div
+          className="hero-producthunt"
+          initial={{ opacity: 0, y: 20 }}
+          animate={{ opacity: 1, y: 0 }}
+          transition={{ duration: 0.6, delay: 0.8 }}
+        >
+          <a
+            href="https://www.producthunt.com/products/ember-mug-cli?embed=true&utm_source=badge-featured&utm_medium=badge&utm_campaign=badge-ember-mug-cli"
+            target="_blank"
+            rel="noopener noreferrer"
+          >
+            <img
+              src="https://api.producthunt.com/widgets/embed-image/v1/featured.svg?post_id=1072278&theme=light&t=1770301556157"
+              alt="Ember Mug CLI - Control your ember mug from the terminal | Product Hunt"
+              width="250"
+              height="54"
+            />
+          </a>
+        </motion.div>
+
         <motion.div
           className="hero-install"
           initial={{ opacity: 0 }}
           animate={{ opacity: 1 }}
-          transition={{ duration: 0.6, delay: 0.9 }}
+          transition={{ duration: 0.6, delay: 1.0 }}
         >
           <code className="install-command">
             <span className="prompt">$</span> npx ember-mug@latest