style: light theme and hand-inked logo matching acampada26s.net

The previous pass kept the dark base and the red icons, which did not
read as the acampada. Now:

- Light theme: white page, black ink and borders, black buttons with a
  hard neon offset shadow, neon for focus and the active nav item;
  h1/h2 in Anton with the stepped neon shadow of the site headings.
- Nav, empty-state, spinner and pattern assets in black; platform icons
  keep their dark disc with a neon stroke.
- New mark: three dome tents wired from their doors into a switch with
  an antenna, drawn in the inked style of the acampada logo (curved
  poles, ball ends, hatching) over a neon offset copy. LogoMark renders
  it inline; visible product name is T-HUB.
- docs/brand: t-hub.svg and a lockup with the Anton wordmark converted
  to outlines so it renders without the font.
- Public submission page moved to the light palette.

Checked with headless Chromium screenshots (offline sample data) on
desktop and mobile.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
hacklab 2026-10-15 14:40:02 +02:00
parent 533a0fb1c0
commit cfabbf20ef
49 changed files with 369 additions and 286 deletions

BIN
docs/brand/t-hub-lockup.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 42 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 17 KiB

View file

@ -1,40 +1,44 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 240 240" width="240" height="240" role="img" aria-labelledby="t">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 400 400" width="400" height="400" role="img" aria-labelledby="t">
<title id="t">T-HUB</title>
<circle cx="120" cy="120" r="118" fill="#000"/>
<circle cx="120" cy="120" r="82" fill="none" stroke="#fff" stroke-width="2" stroke-dasharray="3 7" opacity=".55"/>
<!-- cables: each leaves through a tent door and runs to the switch -->
<g fill="none" stroke="#00e5ff" stroke-width="4" stroke-linecap="round">
<path d="M49 94 C 52 122, 74 130, 96 130"/>
<path d="M191 94 C 188 122, 166 130, 144 130"/>
<path d="M120 216 C 120 196, 120 168, 120 140"/>
<defs>
<!-- Dome tent in the hand-inked style of the acampada26s.net mark:
curved poles with ball ends, centre seam, hatched panel, door.
Base midpoint at 0,0. -->
<g id="tienda" stroke-linecap="round" stroke-linejoin="round">
<path fill="none" d="M-58 0 Q-56 -66 -1 -72 Q55 -66 58 0" stroke-width="7"/>
<path fill="none" d="M-64 1 Q0 -3 64 1" stroke-width="6"/>
<path fill="none" d="M-44 0 Q-30 -58 -1 -72" stroke-width="4.5"/>
<path fill="none" d="M44 0 Q30 -58 -1 -72" stroke-width="4.5"/>
<path d="M-15 0 Q-14 -30 0 -33 Q14 -30 15 0 Z" stroke-width="4"/>
<path fill="none" d="M-50 -14 L-41 -25 M-50 -4 L-37 -19 M-43 -1 L-33 -13 M-52 -27 L-45 -36" stroke-width="2.6"/>
<path fill="none" d="M28 -50 L37 -42 M24 -40 L36 -30 M22 -29 L34 -19" stroke-width="2.6"/>
<circle cx="-64" cy="1" r="5.5" stroke="none"/>
<circle cx="64" cy="1" r="5.5" stroke="none"/>
<circle cx="-1" cy="-73" r="5.5" stroke="none"/>
</g>
<g id="marca" stroke-linecap="round" stroke-linejoin="round">
<!-- cables: out of each tent door to the switch -->
<path fill="none" d="M105 150 Q112 206 168 214" stroke-width="5"/>
<path fill="none" d="M295 150 Q288 206 232 214" stroke-width="5"/>
<path fill="none" d="M200 318 Q197 280 200 236" stroke-width="5"/>
<!-- antenna -->
<path fill="none" d="M200 200 Q198 160 200 118" stroke-width="6"/>
<path fill="none" d="M184 98 Q200 82 216 98" stroke-width="5"/>
<path fill="none" d="M171 88 Q200 58 229 88" stroke-width="5"/>
<circle cx="200" cy="112" r="7" stroke="none"/>
<!-- switch -->
<path d="M168 201 L233 200 L234 235 L167 236 Z" stroke-width="6" fill="#fff"/>
<path d="M179 212 h9 v11 h-9 z M196 212 h9 v11 h-9 z M213 212 h9 v11 h-9 z" stroke="none"/>
<use xlink:href="#tienda" transform="translate(105,150)"/>
<use xlink:href="#tienda" transform="translate(295,150)"/>
<use xlink:href="#tienda" transform="translate(200,340)"/>
</g>
</defs>
<!-- neon offset underneath, ink on top, as on acampada26s.net -->
<g transform="translate(7,7)" stroke="#00e5ff" fill="#00e5ff">
<use xlink:href="#marca"/>
</g>
<!-- tents -->
<g stroke="#fff" stroke-width="3" stroke-linejoin="round">
<polygon points="19,99 49,55 79,99" fill="#000"/>
<polygon points="161,99 191,55 221,99" fill="#000"/>
<polygon points="90,221 120,177 150,221" fill="#000"/>
</g>
<g fill="#00e5ff">
<polygon points="40,99 49,80 58,99"/>
<polygon points="182,99 191,80 200,99"/>
<polygon points="111,221 120,202 129,221"/>
</g>
<!-- antenna -->
<line x1="120" y1="120" x2="120" y2="70" stroke="#fff" stroke-width="4" stroke-linecap="round"/>
<circle cx="120" cy="68" r="5" fill="#00e5ff"/>
<g fill="none" stroke="#00e5ff" stroke-width="3" stroke-linecap="round">
<path d="M106 56 A 18 18 0 0 1 134 56"/>
<path d="M97 46 A 30 30 0 0 1 143 46"/>
</g>
<!-- switch -->
<rect x="94" y="118" width="52" height="24" rx="3" fill="#fff"/>
<g fill="#000">
<rect x="101" y="125" width="9" height="9"/>
<rect x="115.5" y="125" width="9" height="9"/>
<rect x="130" y="125" width="9" height="9"/>
<g stroke="#000" fill="#000">
<use xlink:href="#marca"/>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 1.6 KiB

After

Width:  |  Height:  |  Size: 2.4 KiB

Before After
Before After