hacklab/T-HUB
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

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

Browse source 
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
Download patch file Download diff file Expand all files Collapse all files

55
apps/web/src/app/globals.css
View file

@ -8,23 +8,25 @@
}
@theme {
/* T-HUB: the acampada26s.net palette (black, white, neon) on a dark base. */
--color-bg: #000;
--color-surface: #0d0d0d;
--color-surface-2: #181818;
--color-border: #3d3d3d;
--color-border-subtle: #262626;
--color-text: #fff;
--color-text-dim: #b3b3b3;
--color-text-faint: #808080;
--color-accent: #00e5ff;
--color-accent-hover: #5cefff;
--color-accent-dim: rgb(0 229 255 / 0.15);
--color-live: oklch(0.72 0.19 145);
--color-warn: oklch(0.78 0.16 85);
--color-danger: oklch(0.55 0.24 15);
--color-added: oklch(0.72 0.16 145);
--color-removed: oklch(0.55 0.24 15);
/* T-HUB: the acampada26s.net palette. White page, black ink and borders,
neon #00e5ff for hover, focus and the offset shadows. */
--color-bg: #fff;
--color-surface: #fff;
--color-surface-2: #f2f2f2;
--color-border: #000;
--color-border-subtle: #d4d4d4;
--color-text: #000;
--color-text-dim: #333;
--color-text-faint: #666;
--color-accent: #000;
--color-accent-hover: #222;
--color-accent-dim: rgb(0 229 255 / 0.28);
--color-neon: #00e5ff;
--color-live: #007a3d;
--color-warn: #8a5a00;
--color-danger: #c4001a;
--color-added: #007a3d;
--color-removed: #c4001a;
--font-sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
--font-mono: ui-monospace, "SF Mono", Menlo, monospace;
@ -51,7 +53,7 @@
}
html {
color-scheme: dark;
color-scheme: light;
}
body {
@ -72,13 +74,20 @@ h1, h2 {
letter-spacing: 0.01em;
}
h1 {
text-shadow: 0.04em 0.04em 0 var(--color-accent);
font-size: 1.75rem;
line-height: 1.05;
text-shadow: 0.01em 0.01em 0 var(--color-neon), 0.02em 0.02em 0 var(--color-neon), 0.03em 0.03em 0 var(--color-neon), 0.04em 0.04em 0 var(--color-neon);
}
/* Neon fills need dark text; unlayered so it outranks the text-white utility. */
.bg-accent.text-white,
.bg-accent .text-white {
color: #000;
/* Buttons as on acampada26s.net: hard offset shadow, neon on hover. */
button.bg-accent, a.bg-accent {
box-shadow: 0 3px 0 var(--color-neon);
}
button.bg-accent:hover, a.bg-accent:hover, button.bg-accent:focus-visible, a.bg-accent:focus-visible {
box-shadow: 0 5px 0 var(--color-neon);
}
:focus-visible {
outline-color: var(--color-neon);
}
@media (max-width: 1023px) {