From 7ef45a4de9d4dd1df9b1c1be6230d6bbafb60a7c Mon Sep 17 00:00:00 2001
From: Matthew Ramsden <6657488+reez@users.noreply.github.com>
Date: Mon, 17 Nov 2025 19:17:20 -0600
Subject: [PATCH] adoption: sort and badge members

* feat: add badge for foundation members

* refactor: sort adoption page members at top

* refactor: center badge

* refactor: badge padding

* adoption: make badges clickable

* adoption: badge hover state dark mode
---
 docs/.vuepress/public/css/variables.css | 29 ++++++++++++
 docs/adoption/all.md                    | 62 +++++++++++++------------
 docs/adoption/desktop.md                |  1 +
 docs/adoption/mobile.md                 | 31 +++++++------
 docs/adoption/web.md                    | 31 +++++++------
 5 files changed, 94 insertions(+), 60 deletions(-)

diff --git a/docs/.vuepress/public/css/variables.css b/docs/.vuepress/public/css/variables.css
index 02eec1d457..f78568253a 100644
--- a/docs/.vuepress/public/css/variables.css
+++ b/docs/.vuepress/public/css/variables.css
@@ -87,3 +87,32 @@ iframe.playground {
   word-wrap: break-word;
   overflow-wrap: anywhere;
 }
+
+.tagline h3 {
+  display: inline-flex;
+  align-items: center;
+}
+
+.foundation-member-badge {
+  display: inline-flex;
+  margin-left: 0.5rem;
+  padding: 0.2rem 1rem;
+  font-size: 0.7rem;
+  font-weight: 600;
+  letter-spacing: 0.05em;
+  text-transform: uppercase;
+  border-radius: 999px;
+  background-color: var(--docs-primary-dark);
+  color: var(--docs-dark);
+  vertical-align: middle;
+  line-height: 1;
+  text-decoration: none;
+}
+
+.foundation-member-badge:visited,
+.foundation-member-badge:hover,
+.foundation-member-badge:focus,
+.foundation-member-badge:active {
+  color: var(--docs-dark);
+  text-decoration: none;
+}
diff --git a/docs/adoption/all.md b/docs/adoption/all.md
index 1428d6bfa8..84446de2eb 100644
--- a/docs/adoption/all.md
+++ b/docs/adoption/all.md
@@ -11,6 +11,38 @@ lastUpdated: false
 
 Explore the ecosystem of projects that are built with the BDK family of libraries.
 
+<!-- AnchorWatch -->
+<div class="project">
+  <div class="project-logo">
+  <a href="https://www.anchorwatch.com/" target="_blank">
+    <img src="/img/case-studies-logos/anchorwatch-130.png" />
+  </a>
+  </div>
+  <div class="tagline">
+    <h3>
+      <a href="https://www.anchorwatch.com/" target="_blank">AnchorWatch</a>
+      <a class="foundation-member-badge" href="/foundation/members">Foundation Member</a>
+    </h3>
+    <p>Protect your bitcoin with regulated insurance and enterprise-grade multi-institutional custody.</p>
+  </div>
+</div>
+
+<!-- Proton Wallet -->
+<div class="project">
+  <div class="project-logo">
+    <a href="https://proton.me/wallet" target="_blank">
+      <img src="/img/case-studies-logos/protonwallet-logo-transparent-130.png" />
+    </a>
+  </div>
+  <div class="tagline">
+    <h3>
+      <a href="https://proton.me/wallet" target="_blank">Proton Wallet</a>
+      <a class="foundation-member-badge" href="/foundation/members">Foundation Member</a>
+    </h3>
+    <p>A self-custodial Bitcoin wallet from the makers of Proton Mail.</p>
+  </div>
+</div>
+
 <!-- 10101 -->
 <div class="project">
   <div class="project-logo">
@@ -41,21 +73,6 @@ Explore the ecosystem of projects that are built with the BDK family of librarie
   </div>
 </div>
 
-<!-- AnchorWatch -->
-<div class="project">
-  <div class="project-logo">
-  <a href="https://www.anchorwatch.com/" target="_blank">
-    <img src="/img/case-studies-logos/anchorwatch-130.png" />
-  </a>
-  </div>
-  <div class="tagline">
-  <h3>
-    <a href="https://www.anchorwatch.com/" target="_blank">AnchorWatch</a>
-  </h3>
-  <p>Protect your bitcoin with regulated insurance and enterprise-grade multi-institutional custody.</p>
-  </div>
-</div>
-
 <!-- Bark -->
 <div class="project">
   <div class="project-logo">
@@ -392,21 +409,6 @@ Explore the ecosystem of projects that are built with the BDK family of librarie
     </div>
 </div>
 
-<!-- Proton Wallet -->
-<div class="project">
-  <div class="project-logo">
-    <a href="https://proton.me/wallet" target="_blank">
-      <img src="/img/case-studies-logos/protonwallet-logo-transparent-130.png" />
-    </a>
-  </div>
-  <div class="tagline">
-    <h3>
-      <a href="https://proton.me/wallet" target="_blank">Proton Wallet</a>
-    </h3>
-    <p>A self-custodial Bitcoin wallet from the makers of Proton Mail.</p>
-  </div>
-</div>
-
 <!-- Satoshi -->
 <div class="project">
   <div class="project-logo">
diff --git a/docs/adoption/desktop.md b/docs/adoption/desktop.md
index d67c79fb7e..be8322b1b4 100644
--- a/docs/adoption/desktop.md
+++ b/docs/adoption/desktop.md
@@ -18,6 +18,7 @@ lastUpdated: false
   <div class="tagline">
   <h3>
     <a href="https://www.anchorwatch.com/" target="_blank">AnchorWatch</a>
+    <a class="foundation-member-badge" href="/foundation/members">Foundation Member</a>
   </h3>
   <p>Protect your bitcoin with regulated insurance and enterprise-grade multi-institutional custody.</p>
   </div>
diff --git a/docs/adoption/mobile.md b/docs/adoption/mobile.md
index 65a294d3cb..d4fc924c4c 100644
--- a/docs/adoption/mobile.md
+++ b/docs/adoption/mobile.md
@@ -8,6 +8,22 @@ lastUpdated: false
 
 # Mobile
 
+<!-- Proton Wallet -->
+<div class="project">
+  <div class="project-logo">
+    <a href="https://proton.me/wallet" target="_blank">
+      <img src="/img/case-studies-logos/protonwallet-logo-transparent-130.png" />
+    </a>
+  </div>
+  <div class="tagline">
+    <h3>
+      <a href="https://proton.me/wallet" target="_blank">Proton Wallet</a>
+      <a class="foundation-member-badge" href="/foundation/members">Foundation Member</a>
+    </h3>
+    <p>A self-custodial Bitcoin wallet from the makers of Proton Mail.</p>
+  </div>
+</div>
+
 <!-- 10101 -->
 <div class="project">
   <div class="project-logo">
@@ -254,21 +270,6 @@ lastUpdated: false
     </div>
 </div>
 
-<!-- Proton Wallet -->
-<div class="project">
-  <div class="project-logo">
-    <a href="https://proton.me/wallet" target="_blank">
-      <img src="/img/case-studies-logos/protonwallet-logo-transparent-130.png" />
-    </a>
-  </div>
-  <div class="tagline">
-    <h3>
-      <a href="https://proton.me/wallet" target="_blank">Proton Wallet</a>
-    </h3>
-    <p>A self-custodial Bitcoin wallet from the makers of Proton Mail.</p>
-  </div>
-</div>
-
 <!-- Satoshi -->
 <div class="project">
   <div class="project-logo">
diff --git a/docs/adoption/web.md b/docs/adoption/web.md
index e274809138..a6cece0c37 100644
--- a/docs/adoption/web.md
+++ b/docs/adoption/web.md
@@ -8,6 +8,22 @@ lastUpdated: false
 
 # Web
 
+<!-- Proton Wallet -->
+<div class="project">
+  <div class="project-logo">
+    <a href="https://proton.me/wallet" target="_blank">
+      <img src="/img/case-studies-logos/protonwallet-logo-transparent-130.png" />
+    </a>
+  </div>
+  <div class="tagline">
+    <h3>
+      <a href="https://proton.me/wallet" target="_blank">Proton Wallet</a>
+      <a class="foundation-member-badge" href="/foundation/members">Foundation Member</a>
+    </h3>
+    <p>A self-custodial Bitcoin wallet from the makers of Proton Mail.</p>
+  </div>
+</div>
+
 <!-- Alby -->
 <div class="project">
   <div class="project-logo">
@@ -68,21 +84,6 @@ lastUpdated: false
   </div>
 </div>
 
-<!-- Proton Wallet -->
-<div class="project">
-  <div class="project-logo">
-    <a href="https://proton.me/wallet" target="_blank">
-      <img src="/img/case-studies-logos/protonwallet-logo-transparent-130.png" />
-    </a>
-  </div>
-  <div class="tagline">
-    <h3>
-      <a href="https://proton.me/wallet" target="_blank">Proton Wallet</a>
-    </h3>
-    <p>A self-custodial Bitcoin wallet from the makers of Proton Mail.</p>
-  </div>
-</div>
-
 <style>
 .project {
   display: flex;
-- 
2.49.0