feat: use actual SVG/PNG logos for OSS tools section

Replace text-badge placeholders with real project logos from
Simple Icons CDN and official sources:
- 10 tools via cdn.simpleicons.org (white SVGs for dark bg)
- Automerge brandmark from GitHub repo
- Safe logo from safe.global (white variant)
- FolkJS logo from folk.computer (PNG, no SVG exists)

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Jeff Emmett 2026-03-02 17:43:39 -08:00
parent a796bb43b9
commit 723d674973
1 changed files with 20 additions and 18 deletions

View File

@ -636,12 +636,14 @@
display: flex;
align-items: center;
justify-content: center;
font-size: 0.65rem;
font-weight: 800;
color: #fff;
flex-shrink: 0;
letter-spacing: -0.02em;
line-height: 1;
padding: 6px;
}
.oss-logo img {
width: 100%;
height: 100%;
object-fit: contain;
}
.oss-card .oss-tag {
@ -1700,7 +1702,7 @@
<div class="oss-grid">
<div class="oss-card">
<div class="oss-card-header">
<div class="oss-logo" style="background:#22d3ee;">Fk</div>
<div class="oss-logo"><img src="https://folk.computer/_media/logo.png" alt="FolkJS"></div>
<h4>FolkJS</h4>
</div>
<p>Spatial canvas engine powering rSpace. Web components positioned, connected, and composed on an infinite 2D surface.</p>
@ -1708,7 +1710,7 @@
</div>
<div class="oss-card">
<div class="oss-card-header">
<div class="oss-logo" style="background:#FFCC33; color:#2A1E20;">Am</div>
<div class="oss-logo"><img src="https://raw.githubusercontent.com/automerge/automerge/main/img/brandmark.svg" alt="Automerge"></div>
<h4>Automerge</h4>
</div>
<p>Local-first CRDTs for real-time sync. Peer-to-peer, offline-capable, Byzantine fault tolerant. The data layer for every rApp.</p>
@ -1716,7 +1718,7 @@
</div>
<div class="oss-card">
<div class="oss-card-header">
<div class="oss-logo" style="background:#3423A6;">Wa</div>
<div class="oss-logo"><img src="https://cdn.simpleicons.org/webauthn/ffffff" alt="WebAuthn"></div>
<h4>WebAuthn</h4>
</div>
<p>W3C standard for passwordless authentication. Hardware-backed passkeys via TPM and Secure Enclave.</p>
@ -1724,7 +1726,7 @@
</div>
<div class="oss-card">
<div class="oss-card-header">
<div class="oss-logo" style="background:#0E76B2;">Dc</div>
<div class="oss-logo"><img src="https://cdn.simpleicons.org/discourse/ffffff" alt="Discourse"></div>
<h4>Discourse</h4>
</div>
<p>The leading open-source discussion platform. Trust levels, moderation, and rich threading for rForum.</p>
@ -1732,7 +1734,7 @@
</div>
<div class="oss-card">
<div class="oss-card-header">
<div class="oss-logo" style="background:#89C442;">Lf</div>
<div class="oss-logo"><img src="https://cdn.simpleicons.org/leaflet/ffffff" alt="Leaflet"></div>
<h4>Leaflet + OSM</h4>
</div>
<p>Open-source mapping with OpenStreetMap tiles. Powers rMaps, rCal's spatial view, and rTrips route planning.</p>
@ -1740,7 +1742,7 @@
</div>
<div class="oss-card">
<div class="oss-card-header">
<div class="oss-logo" style="background:#0DBD8B;">[m]</div>
<div class="oss-logo"><img src="https://cdn.simpleicons.org/matrix/ffffff" alt="Matrix"></div>
<h4>Matrix Protocol</h4>
</div>
<p>Decentralized, end-to-end encrypted messaging standard. Interoperable federation for rChats.</p>
@ -1748,7 +1750,7 @@
</div>
<div class="oss-card">
<div class="oss-card-header">
<div class="oss-logo" style="background:#239DAD;">Ty</div>
<div class="oss-logo"><img src="https://cdn.simpleicons.org/typst/ffffff" alt="Typst"></div>
<h4>Typst</h4>
</div>
<p>Modern typesetting system that's fast, ergonomic, and beautiful. Powers rPubs' document pipeline.</p>
@ -1756,7 +1758,7 @@
</div>
<div class="oss-card">
<div class="oss-card-header">
<div class="oss-logo" style="background:#E8AA17; color:#1a1200;">Im</div>
<div class="oss-logo"><img src="https://cdn.simpleicons.org/immich/ffffff" alt="Immich"></div>
<h4>Immich</h4>
</div>
<p>High-performance self-hosted photo management. AI-powered tagging, facial recognition, and mobile backup. Powers rPhotos.</p>
@ -1764,7 +1766,7 @@
</div>
<div class="oss-card">
<div class="oss-card-header">
<div class="oss-logo" style="background:#F1680D;">PT</div>
<div class="oss-logo"><img src="https://cdn.simpleicons.org/peertube/ffffff" alt="PeerTube"></div>
<h4>PeerTube</h4>
</div>
<p>Federated video hosting with ActivityPub. No algorithms, no ads, no surveillance. Powers rTube.</p>
@ -1772,7 +1774,7 @@
</div>
<div class="oss-card">
<div class="oss-card-header">
<div class="oss-logo" style="background:#4B38D8;">Pl</div>
<div class="oss-logo"><img src="https://cdn.simpleicons.org/plausibleanalytics/ffffff" alt="Plausible"></div>
<h4>Plausible</h4>
</div>
<p>Privacy-friendly analytics. No cookies, GDPR compliant, lightweight. Powers rData.</p>
@ -1780,7 +1782,7 @@
</div>
<div class="oss-card">
<div class="oss-card-header">
<div class="oss-logo" style="background:#008C73;">Sf</div>
<div class="oss-logo"><img src="https://safe.global/images/common/safe-white.svg" alt="Safe"></div>
<h4>Gnosis Safe</h4>
</div>
<p>Multi-sig wallet standard. Passkey-derived EOA as signer. Threshold signing for community treasuries across 12+ EVM chains.</p>
@ -1788,7 +1790,7 @@
</div>
<div class="oss-card">
<div class="oss-card-header">
<div class="oss-logo" style="background:#1D63ED;">Dk</div>
<div class="oss-logo"><img src="https://cdn.simpleicons.org/docker/ffffff" alt="Docker"></div>
<h4>Docker + Traefik</h4>
</div>
<p>Container orchestration with automatic service discovery and TLS. The deployment backbone of every app.</p>
@ -1796,7 +1798,7 @@
</div>
<div class="oss-card">
<div class="oss-card-header">
<div class="oss-logo" style="background:#E36002;">Ho</div>
<div class="oss-logo"><img src="https://cdn.simpleicons.org/hono/ffffff" alt="Hono"></div>
<h4>Hono + x402</h4>
</div>
<p>Edge-first web framework with HTTP 402 micropayment middleware. Any route can require payment &mdash; settled on EVM L2 rollups.</p>