fix(site): remove canvas frame, invert logos, new footer text

The canvas had a 1px frame. The company logos are opaque white, so
invert them to match the dark tiles. Core fetches the Auth public key
(JWKS), so the To Be Played diagram now shows that arrow.
This commit is contained in:
lobo committed 2026-10-14 08:49:00 +02:00
1 parent 93e9c59436
commit 07a9b8bc11
9 files changed
+84 -19

No files matched your search

@@ -1,6 +1,6 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 630" width="1200" height="630" role="img" aria-labelledby="title desc">
<title id="title">To Be Played</title>
<desc id="desc">Architecture of To Be Played: a React frontend talks to an Auth service that signs tokens and a Core service that verifies them. Both use PostgreSQL, Core also calls the Steam API and IGDB.</desc>
<desc id="desc">Architecture of To Be Played: a React frontend talks to an Auth service that signs tokens and a Core service that verifies them. Both use PostgreSQL, Core also calls the Steam API and IGDB. Core fetches the Auth public key (JWKS) at runtime.</desc>
<defs>
<linearGradient id="bg" x1="0" y1="0" x2="0" y2="1">
@@ -42,16 +42,16 @@
<text x="370" y="184" class="sans name">Auth service</text>
<text x="370" y="210" class="sans sub">signs tokens, Ed25519 private key</text>
<text x="370" y="232" class="sans sub">HttpOnly cookies</text>
<rect x="350" y="290" width="310" height="220" rx="10" fill="#212a35" stroke="#2f3a47"/>
<text x="370" y="324" class="sans name">Core service</text>
<text x="370" y="350" class="sans sub">library, stats, suggestions</text>
<text x="370" y="372" class="sans sub">verifies tokens, public key only</text>
<rect x="350" y="320" width="310" height="220" rx="10" fill="#212a35" stroke="#2f3a47"/>
<text x="370" y="354" class="sans name">Core service</text>
<text x="370" y="380" class="sans sub">library, stats, suggestions</text>
<text x="370" y="402" class="sans sub">verifies tokens, public key only</text>
<rect x="740" y="150" width="180" height="230" rx="14" fill="#1a222c" stroke="#2f3a47"/>
<text x="760" y="178" class="sans cap" text-anchor="start">POSTGRESQL</text>
<rect x="760" y="192" width="140" height="56" rx="10" fill="#243040" stroke="#33475c"/>
<text x="830" y="227" class="mono chip" text-anchor="middle">auth db</text>
<rect x="760" y="302" width="140" height="56" rx="10" fill="#243040" stroke="#33475c"/>
<text x="830" y="337" class="mono chip" text-anchor="middle">core db</text>
<rect x="760" y="312" width="140" height="56" rx="10" fill="#243040" stroke="#33475c"/>
<text x="830" y="347" class="mono chip" text-anchor="middle">core db</text>
<text x="1000" y="372" class="sans cap" text-anchor="start">EXTERNAL</text>
<rect x="1000" y="395" width="152" height="50" rx="10" fill="#212a35" stroke="#2f3a47" stroke-dasharray="4 4"/>
<text x="1076" y="427" class="sans chip" text-anchor="middle">Steam API</text>
@@ -59,10 +59,12 @@
<text x="1076" y="492" class="sans chip" text-anchor="middle">IGDB</text>
<path d="M 252 258 H 342" stroke="#4a5563" stroke-width="2" fill="none" marker-end="url(#arrow)"/>
<text x="297" y="248" class="sans arr" text-anchor="middle">login</text>
<path d="M 252 330 H 342" stroke="#4a5563" stroke-width="2" fill="none" marker-end="url(#arrow)"/>
<text x="297" y="320" class="sans arr" text-anchor="middle">API, cookie</text>
<path d="M 252 340 H 342" stroke="#4a5563" stroke-width="2" fill="none" marker-end="url(#arrow)"/>
<text x="297" y="330" class="sans arr" text-anchor="middle">API, cookie</text>
<path d="M 668 220 H 752" stroke="#26c6da" stroke-width="2" fill="none" marker-end="url(#arrowCyan)"/>
<path d="M 668 330 H 752" stroke="#26c6da" stroke-width="2" fill="none" marker-end="url(#arrowCyan)"/>
<path d="M 668 340 H 752" stroke="#26c6da" stroke-width="2" fill="none" marker-end="url(#arrowCyan)"/>
<path d="M 600 312 V 278" stroke="#4a5563" stroke-width="2" fill="none" marker-end="url(#arrow)"/>
<text x="588" y="300" class="sans arr" text-anchor="end">public key (JWKS)</text>
<path d="M 668 420 H 992" stroke="#4a5563" stroke-width="2" fill="none" marker-end="url(#arrow)"/>
<text x="830" y="410" class="sans arr" text-anchor="middle">sync</text>
<path d="M 668 485 H 992" stroke="#4a5563" stroke-width="2" fill="none" marker-end="url(#arrow)"/>

Before

Width:  |  Height:  |  Size: 4.8 KiB

After

Width:  |  Height:  |  Size: 5.0 KiB