Add social media handles to signatories list and links to send a thank you message

Author: marcprux

src/data/signatures.yaml

@@ -17,18 +17,25 @@
   url: "adguard.com"
   poc: "Daria Magdik <daria@adguard.com>"
   region: "CY"
+  social-x: "https://x.com/AdGuard"
 - organization: "The App Fair Project"
   url: "appfair.org"
   poc: "Marc Prud'hommeaux <marc@appfair.org>"
   region: "FR"
+  social-x: "https://x.com/TheAppFair"
+  social-mastodon: "https://fosstodon.org/@appfair"
 - organization: "ARTICLE 19"
   url: "article19.org"
   poc: "Mark Dempsey <mark.dempsey@article19.org>"
   region: "GB"
+  social-bluesky: "https://bsky.app/profile/article19.bsky.social"
+  social-x: "https://x.com/article19org"
 - organization: "Associação Nacional para o Software Livre (ANSOL)"
   url: "ansol.org"
   poc: "ANSOL - Direcção <direccao@ansol.org>"
   region: "PT"
+  social-mastodon: "https://floss.social/@ansol"
+  social-x: "https://x.com/ANSOL"
 - organization: "Aurora Store"
   url: "auroraoss.com"
   poc: "Vishal Bakhai <vishal@auroraoss.com>"
@@ -37,179 +44,266 @@
   url: "brave.com"
   poc: "Shivan Sahib <shivan@brave.com>"
   region: "US"
+  social-bluesky: "https://bsky.app/profile/brave.com"
+  social-x: "https://x.com/brave"
 - organization: "The Center for Digital Progress (D64)"
   url: "d-64.org"
   poc: "Esther Bauer - D64 – Zentrum für Digitalen Fortschritt <buero@d-64.org>"
   region: "DE"
+  social-mastodon: "https://d-64.social/@D64eV"
+  social-bluesky: "https://bsky.app/profile/d-64.org"
+  social-x: "https://x.com/D64eV"
 - organization: "The Chaos Computer Club (CCC)"
   url: "ccc.de"
   poc: "Elina Eickstädt <presse@ccc.de>"
   region: "DE"
+  social-mastodon: "https://social.bau-ha.us/@CCC"
+  social-bluesky: "https://bsky.app/profile/ccc.de"
 - organization: "Codeberg e.V."
   url: "codeberg.org"
   poc: "Gusted <contact@codeberg.org>"
   region: "DE"
+  social-mastodon: "https://social.anoxinon.de/@Codeberg"
 - organization: "CryptPad"
   url: "cryptpad.org"
   poc: "David Benqué <david@cryptpad.org>"
   region: "FR"
+  social-mastodon: "https://fosstodon.org/@cryptpad"
+  social-bluesky: "https://bsky.app/profile/cryptpad.org"
 - organization: "Cryptee"
   url: "crypt.ee"
   poc: "John Ozbay <hello@johnozbay.com>"
   region: "EE"
+  social-x: "https://x.com/crypteeapp"
 - organization: "Data Rights"
   url: "datarights.ngo"
   poc: "Eliot Bendinelli <info@datarights.ngo>"
   region: "NL"
+  social-mastodon: "https://eupolicy.social/@datarights"
+  social-x: "https://x.com/dataRights_"
 - organization: "Digitale Gesellschaft"
   url: "digitale-gesellschaft.ch"
   poc: "Philippe Gervais <docta.gervais@proton.me>"
   region: "CH"
+  social-mastodon: "https://mastodon.social/@digiges"
+  social-bluesky: "https://bsky.app/profile/digitale-gesellschaft.ch"
+  social-x: "https://x.com/digiges_ch"
 - organization: "The Digital Rights Foundation"
   url: "digitalrightsfoundation.pk"
   poc: "Nighat Dad <nighat@digitalrightsfoundation.pk>"
   region: "PK"
+  social-bluesky: "https://bsky.app/profile/digitalrightspk.bsky.social"
+  social-x: "https://x.com/DigitalRightsPK"
 - organization: "Digital Rights Watch"
   url: "digitalrightswatch.org.au"
   poc: "Tom Sulston <tom@digitalrightswatch.org.au>"
   region: "AU"
+  social-mastodon: "https://aus.social/@drwaus"
+  social-bluesky: "https://bsky.app/profile/drwaus.bsky.social"
+  social-x: "https://x.com/DRWaus"
 - organization: "epicenter.works – for digital rights"
   url: "epicenter.works"
   poc: "Thomas Lohninger <thomas.lohninger@epicenter.works>"
   region: "AT"
+  social-mastodon: "https://chaos.social/@epicenter_works"
+  social-bluesky: "https://bsky.app/profile/epicenterworks.bsky.social"
+  social-x: "https://x.com/epicenter_works"
 - organization: "/e/ Foundation"
   url: "e.foundation"
   poc: "Rik Viergever <rikviergever@e.email>"
   region: "FR"
+  social-mastodon: "https://mastodon.social/@e_mydata"
+  social-x: "https://x.com/e_mydata"
 - organization: "European Digital Rights (EDRi)"
   url: "edri.org"
   poc: "Jan Penfrat <jan.penfrat@edri.org>"
   region: "BE"
+  social-mastodon: "https://eupolicy.social/@edri"
 - organization: "The Electronic Frontier Foundation (EFF)"
   url: "eff.org"
   poc: "Mitch Stoltz <mitch@eff.org>"
   region: "US"
+  social-mastodon: "https://mastodon.social/@eff"
+  social-bluesky: "https://bsky.app/profile/eff.org"
+  social-x: "https://x.com/eff"
 - organization: "Fastmail"
   url: "fastmail.com"
   poc: "Bek Fraser <bekf@fastmailteam.com>"
   region: "AU"
+  social-mastodon: "https://mastodon.social/@fastmail"
+  social-bluesky: "https://bsky.app/profile/fastmail.com"
+  social-x: "https://x.com/Fastmail"
 - organization: "FOSDEM"
   url: "fosdem.org"
   poc: "Gerry Demaret <gerry@fosdem.org>"
   region: "BE"
+  social-mastodon: "https://fosstodon.org/@fosdem"
+  social-bluesky: "https://bsky.app/profile/fosdem.org"
 - organization: "FULU Foundation"
   url: "fulu.org"
   poc: "Maria Palazzo <maria@fulu.org>"
   region: "US"
+  social-mastodon: "https://mastodon.social/@FuluFoundation"
+  social-x: "https://x.com/FuluFoundation"
 - organization: "FUTO"
   url: "futo.org"
   poc: "Michael McConnell <michaelm@futo.org>"
   region: "US"
+  social-x: "https://x.com/FUTO_Tech"
 - organization: "Fundación Karisma"
   url: "karisma.org.co"
   poc: "Cata Moreno Arocha <catalina.moreno@karisma.org.co>"
   region: "CO"
+  social-x: "https://x.com/Karisma"
 - organization: "Ghostery"
   url: "ghostery.com"
   poc: "Adam from Ghostery <adam@ghostery.com>"
   region: "DE"
+  social-x: "https://x.com/Ghostery"
 - organization: "F-Droid"
   url: "f-droid.org"
   poc: "board@f-droid.org"
   region: "NL"
+  social-mastodon: "https://floss.social/@fdroidorg"
+  social-x: "https://x.com/fdroidorg"
 - organization: "Fedimedia"
   url: "fedimedia.it"
   poc: "Filippo Della Bianca, Fedimedia President <info@fedimedia.it>"
   region: "IT"
+  social-mastodon: "https://mastodon.uno/@fedimedia"
 - organization: "The Free Software Foundation (FSF)"
   url: "fsf.org"
   poc: "Greg Farough via RT <campaigns@fsf.org>"
   region: "US"
+  social-mastodon: "https://hostux.social/@fsf"
+  social-x: "https://x.com/fsf"
 - organization: "The Free Software Foundation Europe (FSFE)"
   url: "fsfe.org"
   poc: "Lucas Lasota <lucas.lasota@fsfe.org>"
   region: "DE"
+  social-mastodon: "https://mastodon.social/@fsfe"
+  social-bluesky: "https://bsky.app/profile/fsfe.org"
+  social-x: "https://x.com/fsfe"
 - organization: "The Guardian Project"
   url: "guardianproject.info"
   poc: "Nathan Freitas <nathan@guardianproject.info>"
   region: "US"
+  social-mastodon: "https://social.librem.one/@guardianproject"
+  social-x: "https://x.com/guardianproject"
 - organization: "IzzyOnDroid"
   url: "izzyondroid.org"
   poc: "Andreas Itzchak Rehberg <izzy@izzyondroid.org>"
+  social-mastodon: "https://floss.social/@IzzyOnDroidOrg"
 - organization: "JMP.chat"
   url: "jmp.chat"
   poc: "Stephen Paul Weber <info@jmp.chat>"
   region: "CA"
+  social-x: "https://x.com/JMP_chat"
 - organization: "KDE e.V."
   url: "kde.org"
   poc: "Carl Schwan <carlschwan@kde.org>"
   region: "DE"
+  social-mastodon: "https://floss.social/@kde"
+  social-bluesky: "https://bsky.app/profile/kde.org"
+  social-x: "https://x.com/kdecommunity"
 - organization: "LineageOS"
   url: "lineageos.org"
   poc: "Nolen Johnson <nolenjohnson@lineageos.org>"
   region: "US"
+  social-mastodon: "https://fosstodon.org/@LineageOS"
+  social-bluesky: "https://bsky.app/profile/lineageos.org"
 - organization: "microG"
   url: "microg.org"
   poc: "Marvin W. <marvin@microg.org>"
 - organization: "Molly"
   url: "molly.im"
   poc: "Oscar Mira <valldrac@molly.im>"
+  social-mastodon: "https://fosstodon.org/@mollyim"
 - organization: "Nextcloud"
   url: "nextcloud.com"
   poc: "Jos Poortvliet <jos.poortvliet@nextcloud.com>"
   region: "DE"
+  social-mastodon: "https://mastodon.xyz/@nextcloud"
+  social-bluesky: "https://bsky.app/profile/nextcloud.bsky.social"
 - organization: "OW2"
   url: "ow2.org"
   poc: "Pierre-Yves Gibello <pierre-yves.gibello@ow2.org>"
   region: "FR"
+  social-mastodon: "https://fosstodon.org/@ow2"
 - organization: "Obtainium"
   url: "obtainium.imranr.dev"
   poc: "Imran <contact@imranr.dev>"
 - organization: "OpenMedia"
   url: "openmedia.org"
   poc: "Matt Hatfield <matt@openmedia.org>"
   region: "CA"
+  social-mastodon: "https://mastodon.social/@OpenMediaOrg"
+  social-bluesky: "https://bsky.app/profile/openmediaorg.bsky.social"
+  social-x: "https://x.com/OpenMediaOrg"
 - organization: "The OpenStreetMap Foundation (OSMF)"
   url: "osmfoundation.org"
   poc: "Héctor Ochoa Ortiz <hector.ochoa.ortiz@osmfoundation.org>"
   region: "GB"
+  social-mastodon: "https://en.osm.town/@openstreetmap"
+  social-bluesky: "https://bsky.app/profile/openstreetmap.bsky.social"
+  social-x: "https://x.com/openstreetmap"
 - organization: "Open Rights Group (ORG)"
   url: "openrightsgroup.org"
   poc: "Jim Killock <jim@openrightsgroup.org>"
   region: "GB"
+  social-mastodon: "https://social.openrightsgroup.org/@openrightsgroup"
+  social-bluesky: "https://bsky.app/profile/openrightsgroup.org"
+  social-x: "https://x.com/OpenRightsGroup"
 - organization: "Osservatorio Nessuno OdV"
   url: "osservatorionessuno.org"
   poc: "Giulio B <giulio@osservatorionessuno.org>"
   region: "IT"
+  social-mastodon: "https://mastodon.cisti.org/@0n_odv"
+  social-bluesky: "https://bsky.app/profile/osservatorionessuno.org"
 - organization: "Proton AG"
   url: "proton.me"
   poc: "Samuele Kaplun <samuele.kaplun@proton.ch>"
   region: "CH"
+  social-bluesky: "https://bsky.app/profile/proton.me"
+  social-x: "https://x.com/ProtonPrivacy"
 - organization: "Rossmann Group"
   url: "rossmanngroup.com"
   poc: "Louis Rossmann <youtube@rossmanngroup.com>"
   region: "US"
+  social-x: "https://x.com/rossmannsupply"
 - organization: "Software Freedom Conservancy"
   url: "sfconservancy.org"
   poc: "Denver Gingerich <denver@sfconservancy.org>"
   region: "US"
+  social-mastodon: "https://social.sfconservancy.org/@conservancy"
+  social-x: "https://x.com/conservancy"
 - organization: "Techlore"
   url: "techlore.tech"
   poc: "Henry Fisher <henry@techlore.tech>"
   region: "US"
+  social-mastodon: "https://social.lol/@techlore"
+  social-bluesky: "https://bsky.app/profile/techlore.bsky.social"
 - organization: "The Tor Project"
   url: "torproject.org"
   poc: "Isabela Fernandes <isabela@torproject.org>"
   region: "US"
+  social-mastodon: "https://mastodon.social/@torproject"
+  social-bluesky: "https://bsky.app/profile/torproject.org"
+  social-x: "https://x.com/torproject"
 - organization: "Tuta Mail"
   url: "tuta.com"
   poc: "Hanna Bozakov <hanna.bozakov@tutao.de>"
   region: "DE"
+  social-mastodon: "https://mastodon.social/@Tutanota"
+  social-bluesky: "https://bsky.app/profile/tuta.com"
+  social-x: "https://x.com/TutaPrivacy"
 - organization: "Vivaldi Technologies AS"
   url: "vivaldi.com"
   poc: "Jon von Tetzchner <jon@vivaldi.com>"
   region: "NO"
+  social-mastodon: "https://social.vivaldi.net/@Vivaldi"
+  social-bluesky: "https://bsky.app/profile/vivaldi.com"
+  social-x: "https://x.com/vivaldibrowser"
 
 #- organization: "XXX"
 #  url: "XXX"
-

src/layouts/Base.astro

@@ -221,8 +221,45 @@ const dir = isRtl(lang) ? "rtl" : "ltr";
       opacity: 0.8;
     }
 
-    .header-icon-link img {
-      display: block;
+    /* Social media icons – CSS mask with brand colors */
+    .social-icon {
+      display: inline-block;
+      -webkit-mask-size: contain;
+      mask-size: contain;
+      -webkit-mask-repeat: no-repeat;
+      mask-repeat: no-repeat;
+      -webkit-mask-position: center;
+      mask-position: center;
+    }
+
+    .icon-mastodon {
+      -webkit-mask-image: url('/img/mastodon.svg');
+      mask-image: url('/img/mastodon.svg');
+      background-color: #6364FF;
+    }
+
+    .icon-bluesky {
+      -webkit-mask-image: url('/img/bluesky.svg');
+      mask-image: url('/img/bluesky.svg');
+      background-color: #1185FE;
+    }
+
+    .icon-x {
+      -webkit-mask-image: url('/img/x-twitter.svg');
+      mask-image: url('/img/x-twitter.svg');
+      background-color: #14171A;
+    }
+
+    [data-theme="dark"] .icon-mastodon {
+      background-color: #858AFA;
+    }
+
+    [data-theme="dark"] .icon-bluesky {
+      background-color: #409CFF;
+    }
+
+    [data-theme="dark"] .icon-x {
+      background-color: #E7E9EA;
     }
 
     .callout-warning {

src/layouts/Default.astro

@@ -47,9 +47,9 @@ const languageEntries = Object.entries(languages);
   <header>
     <h1>{title}</h1>
     <span class="header-icons">
-      <a href="https://techhub.social/@keepandroidopen" class="header-icon-link" aria-label="Mastodon" title="Mastodon" rel="me" target="_blank"><img src="/img/mastodon.svg" width="20" height="20" alt="Mastodon" /></a>
-      <a href="https://bsky.app/profile/keepandroidopen.bsky.social" class="header-icon-link" aria-label="BlueSky" title="BlueSky" target="_blank"><img src="/img/bluesky.svg" width="20" height="20" alt="BlueSky" /></a>
-      <a href="https://x.com/AlteredDeal" class="header-icon-link" aria-label="Twitter" title="Twitter" target="_blank"><img src="/img/x-twitter.svg" width="20" height="20" alt="Twitter" /></a>
+      <a href="https://techhub.social/@keepandroidopen" class="header-icon-link" aria-label="Mastodon" title="Mastodon" rel="me" target="_blank"><span class="social-icon icon-mastodon" style="width:20px;height:20px"></span></a>
+      <a href="https://bsky.app/profile/keepandroidopen.bsky.social" class="header-icon-link" aria-label="BlueSky" title="BlueSky" target="_blank"><span class="social-icon icon-bluesky" style="width:20px;height:20px"></span></a>
+      <a href="https://x.com/AlteredDeal" class="header-icon-link" aria-label="Twitter" title="Twitter" target="_blank"><span class="social-icon icon-x" style="width:20px;height:20px"></span></a>
       <ThemeToggle />
     </span>
     <div class="lang-menu">