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.
This commit is contained in:
parent
c7d133c395
commit
c423f172d0
49 changed files with 369 additions and 286 deletions
|
|
@ -49,7 +49,7 @@ function Shell({ children }: { children: ReactNode }): React.ReactElement {
|
|||
scrollPositions.set(pathname, { main: main.scrollTop, nested: scrollableChildren(main).map((element) => element.scrollTop) });
|
||||
};
|
||||
}, [pathname, mobile]);
|
||||
const title = titles[pathname.split("/")[1] ?? ""] ?? "Tactical Media Broadcast Hub";
|
||||
const title = titles[pathname.split("/")[1] ?? ""] ?? "T-HUB";
|
||||
return (
|
||||
<div className="flex h-dvh min-w-0 overflow-hidden lg:h-screen">
|
||||
<Sidebar />
|
||||
|
|
|
|||
|
|
@ -48,7 +48,7 @@ export default function MorePage(): React.ReactElement {
|
|||
<section className="flex items-center gap-4 px-5 py-5">
|
||||
<div className="scale-125"><Avatar handle={session?.user.displayName || session?.user.username || "AP"} /></div>
|
||||
<div className="min-w-0 flex-1 pl-2">
|
||||
<h1 className="truncate text-xl font-bold">{session?.user.displayName || session?.user.username || "Tactical Media Broadcast Hub"}</h1>
|
||||
<h1 className="truncate text-xl font-bold">{session?.user.displayName || session?.user.username || "T-HUB"}</h1>
|
||||
<p className="truncate text-xs text-text-faint">@{session?.user.username || "offline"}{session?.user.email ? ` · ${session.user.email}` : ""}</p>
|
||||
<div className="mt-2 flex items-center gap-2"><span className="rounded-full bg-accent px-2.5 py-1 text-[11px] font-bold uppercase text-white">{session?.role || "Preview"}</span><span className="truncate text-xs text-text-dim">{session?.workspace.name || "Studio"}</span></div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -221,15 +221,15 @@ export default function OnboardingPage(): React.ReactElement {
|
|||
<div className="mb-5">
|
||||
<div className="-m-6 mb-5 overflow-hidden bg-black">
|
||||
<div className="flex items-center gap-5 px-8 py-8">
|
||||
<LogoMark size={96} className="shrink-0 text-accent" />
|
||||
<LogoMark size={96} className="shrink-0 text-white" />
|
||||
<div className="min-w-0">
|
||||
<div className="text-xl font-semibold leading-tight text-white">Horizontal Collaborative Broadcast System</div>
|
||||
<div className="mt-1 text-xs uppercase tracking-wider text-text-faint">Tactical Media Broadcast Hub</div>
|
||||
<div className="mt-1 text-xs uppercase tracking-wider text-[#00e5ff]">T-HUB</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="text-center">
|
||||
<h1 className="text-2xl font-semibold tracking-tight">Tactical Media Broadcast Hub</h1>
|
||||
<h1 className="text-2xl font-semibold tracking-tight">T-HUB</h1>
|
||||
<p className="mt-1 text-2xs text-text-faint">Your platform. Their feeds. No algorithm in between.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -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) {
|
||||
|
|
|
|||
|
|
@ -324,11 +324,11 @@ export default function JoinWorkspacePage({ params }: { params: { token: string
|
|||
<Card className="w-[520px] max-w-full p-6">
|
||||
<div className="mb-5 text-center">
|
||||
<img
|
||||
src="/brand/hero.png"
|
||||
alt="Tactical Media Broadcast Hub — arrows from a circle, warm red on black"
|
||||
width={1024}
|
||||
height={1024}
|
||||
className="mx-auto mb-3 h-20 w-20 rounded-lg object-cover"
|
||||
src="/brand/t-hub.svg"
|
||||
alt="T-HUB: three tents wired to a switch with an antenna"
|
||||
width={400}
|
||||
height={400}
|
||||
className="mx-auto mb-3 h-20 w-20"
|
||||
/>
|
||||
<h1 className="text-xl font-semibold tracking-tight">Join {info.workspaceName}</h1>
|
||||
<p className="mt-1 text-2xs text-text-faint">
|
||||
|
|
|
|||
|
|
@ -3,8 +3,8 @@ import type { Metadata, Viewport } from "next";
|
|||
import "./globals.css";
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Tactical Media Broadcast Hub",
|
||||
description: "Tactical Media Broadcast Hub — post, schedule and amplify across every network you refuse to be owned by.",
|
||||
title: "T-HUB",
|
||||
description: "T-HUB — post, schedule and amplify across every network you refuse to be owned by. Based on Tactical Media Broadcast Hub.",
|
||||
icons: { icon: "/brand/favicon.svg" },
|
||||
};
|
||||
|
||||
|
|
@ -13,7 +13,7 @@ export const viewport: Viewport = {
|
|||
initialScale: 1,
|
||||
viewportFit: "cover",
|
||||
interactiveWidget: "resizes-content",
|
||||
themeColor: "#000000",
|
||||
themeColor: "#ffffff",
|
||||
};
|
||||
|
||||
export default function RootLayout({ children }: { children: ReactNode }): React.ReactNode {
|
||||
|
|
|
|||
|
|
@ -40,7 +40,7 @@ export default function LoginPage(): React.ReactElement {
|
|||
<Card className="w-[420px] max-w-full p-6">
|
||||
<div className="mb-5 text-center">
|
||||
<h1 className="text-xl font-semibold tracking-tight">Sign in</h1>
|
||||
<p className="mt-1 text-2xs text-text-faint">Tactical Media Broadcast Hub</p>
|
||||
<p className="mt-1 text-2xs text-text-faint">T-HUB</p>
|
||||
</div>
|
||||
<form onSubmit={(e) => void submit(e)}>
|
||||
<div className="space-y-2">
|
||||
|
|
|
|||
|
|
@ -116,7 +116,7 @@ function ManualLanding(): React.ReactElement {
|
|||
<header className="sticky top-0 z-10 border-b border-border-subtle bg-surface">
|
||||
<div className="mx-auto flex max-w-2xl items-center gap-3 px-4 py-4">
|
||||
<Logo size={26} withText={false} />
|
||||
<span className="flex-1 truncate text-xs font-bold tracking-tight text-accent">Tactical Media Broadcast Hub</span>
|
||||
<span className="flex-1 truncate text-xs font-bold tracking-tight text-accent">T-HUB</span>
|
||||
<div className="flex shrink-0 items-center rounded-md border border-border bg-surface-2 p-0.5" role="group" aria-label={t({ es: "Idioma", en: "Language" })}>
|
||||
{(["es", "en"] as const).map((code) => (
|
||||
<button
|
||||
|
|
|
|||
|
|
@ -119,10 +119,10 @@ export default function SubmitPage({ params }: { params: { token: string } }): R
|
|||
|
||||
if (phase === "checking") {
|
||||
return (
|
||||
<main className="flex min-h-dvh items-center justify-center bg-[#060403] px-6">
|
||||
<main className="flex min-h-dvh items-center justify-center bg-white px-6">
|
||||
<div className="flex flex-col items-center gap-3">
|
||||
<Loading size={32} label="Opening the box…" />
|
||||
<span className="text-2xs text-[#a4a09e]">Opening the box…</span>
|
||||
<span className="text-2xs text-[#555]">Opening the box…</span>
|
||||
</div>
|
||||
</main>
|
||||
);
|
||||
|
|
@ -130,7 +130,7 @@ export default function SubmitPage({ params }: { params: { token: string } }): R
|
|||
|
||||
if (phase === "unreachable") {
|
||||
return (
|
||||
<main className="flex min-h-dvh items-center justify-center bg-[#060403] p-6">
|
||||
<main className="flex min-h-dvh items-center justify-center bg-white p-6">
|
||||
<DeadCard
|
||||
tone="warn"
|
||||
title="Can't reach the server"
|
||||
|
|
@ -143,7 +143,7 @@ export default function SubmitPage({ params }: { params: { token: string } }): R
|
|||
|
||||
if (phase === "gone" || box === null) {
|
||||
return (
|
||||
<main className="flex min-h-dvh items-center justify-center bg-[#060403] p-6">
|
||||
<main className="flex min-h-dvh items-center justify-center bg-white p-6">
|
||||
<DeadCard
|
||||
tone="danger"
|
||||
title="This box isn't open"
|
||||
|
|
@ -154,7 +154,7 @@ export default function SubmitPage({ params }: { params: { token: string } }): R
|
|||
}
|
||||
|
||||
return (
|
||||
<main className="min-h-dvh bg-[#060403] px-4 py-10 sm:px-6">
|
||||
<main className="min-h-dvh bg-white px-4 py-10 sm:px-6">
|
||||
<SubmitForm key={token} token={token} box={box} />
|
||||
</main>
|
||||
);
|
||||
|
|
@ -162,16 +162,16 @@ export default function SubmitPage({ params }: { params: { token: string } }): R
|
|||
|
||||
function DeadCard({ tone, title, body, action }: { tone: "warn" | "danger"; title: string; body: string; action?: React.ReactNode }): React.ReactElement {
|
||||
return (
|
||||
<div className="w-full max-w-md rounded-lg border border-[#2a2320] bg-[#0F0A09] p-6 text-center">
|
||||
<div className="w-full max-w-md rounded-lg border border-[#d4d4d4] bg-[#f2f2f2] p-6 text-center">
|
||||
<div
|
||||
className={`mx-auto mb-4 flex h-12 w-12 items-center justify-center rounded-full text-lg ${
|
||||
tone === "warn" ? "bg-[#00E5FF]/15 text-[#00E5FF]" : "bg-[#00E5FF]/15 text-[#00E5FF]"
|
||||
tone === "warn" ? "bg-[#00E5FF]/15 text-[#00798a]" : "bg-[#00E5FF]/15 text-[#00798a]"
|
||||
}`}
|
||||
>
|
||||
{tone === "warn" ? "!" : "✕"}
|
||||
</div>
|
||||
<h1 className="text-base font-semibold text-[#f5efed]">{title}</h1>
|
||||
<p className="mt-2 text-xs leading-relaxed text-[#a4a09e]">{body}</p>
|
||||
<h1 className="text-base font-semibold text-black">{title}</h1>
|
||||
<p className="mt-2 text-xs leading-relaxed text-[#555]">{body}</p>
|
||||
{action}
|
||||
</div>
|
||||
);
|
||||
|
|
@ -282,13 +282,13 @@ function SubmitForm({ token, box }: { token: string; box: SubmissionBoxInfo }):
|
|||
|
||||
if (phase === "sent" && done !== null) {
|
||||
return (
|
||||
<div className="mx-auto flex w-full max-w-xl flex-col items-center gap-4 rounded-lg border border-[#2a2320] bg-[#0F0A09] p-8 text-center">
|
||||
<LogoMark size={44} className="text-[#00E5FF]" title="" />
|
||||
<h1 className="text-xl font-semibold tracking-tight text-[#f5efed]">Received</h1>
|
||||
<p className="max-w-sm text-sm leading-relaxed text-[#c7c3c1]">
|
||||
<div className="mx-auto flex w-full max-w-xl flex-col items-center gap-4 rounded-lg border border-[#d4d4d4] bg-[#f2f2f2] p-8 text-center">
|
||||
<LogoMark size={44} className="text-black" title="" />
|
||||
<h1 className="text-xl font-semibold tracking-tight text-black">Received</h1>
|
||||
<p className="max-w-sm text-sm leading-relaxed text-[#333]">
|
||||
Received — the collective will review it. Nothing is published until they approve it.
|
||||
</p>
|
||||
<p className="max-w-sm text-2xs leading-relaxed text-[#a4a09e]">
|
||||
<p className="max-w-sm text-2xs leading-relaxed text-[#555]">
|
||||
Your footage stays under {box.licenseDefault}: it may be shared and remixed with attribution.
|
||||
</p>
|
||||
</div>
|
||||
|
|
@ -301,13 +301,13 @@ function SubmitForm({ token, box }: { token: string; box: SubmissionBoxInfo }):
|
|||
return (
|
||||
<form
|
||||
onSubmit={(event) => void submit(event)}
|
||||
className="mx-auto flex w-full max-w-xl flex-col gap-6 rounded-lg border border-[#2a2320] bg-[#0F0A09] p-6 sm:p-8"
|
||||
className="mx-auto flex w-full max-w-xl flex-col gap-6 rounded-lg border border-[#d4d4d4] bg-[#f2f2f2] p-6 sm:p-8"
|
||||
>
|
||||
<header className="flex flex-col items-center gap-3 text-center">
|
||||
<LogoMark size={36} className="text-[#00E5FF]" title="Tactical Media Broadcast Hub" />
|
||||
<LogoMark size={36} className="text-black" />
|
||||
<div>
|
||||
<h1 className="text-xl font-semibold tracking-tight text-[#f5efed]">Send footage to the collective</h1>
|
||||
<p className="mt-1 text-xs leading-relaxed text-[#a4a09e]">
|
||||
<h1 className="text-xl font-semibold tracking-tight text-black">Send footage to the collective</h1>
|
||||
<p className="mt-1 text-xs leading-relaxed text-[#555]">
|
||||
No account needed. mp4 or webm video up to 200 MiB, jpeg or png photo up to 50 MiB.
|
||||
</p>
|
||||
</div>
|
||||
|
|
@ -339,13 +339,13 @@ function SubmitForm({ token, box }: { token: string; box: SubmissionBoxInfo }):
|
|||
}}
|
||||
className={`flex min-h-[180px] flex-col items-center justify-center gap-2 rounded-lg border-2 border-dashed px-4 py-8 text-center transition-colors duration-150 ${
|
||||
uploading
|
||||
? "cursor-not-allowed border-[#3a312e] opacity-60"
|
||||
: "cursor-pointer border-[#3a312e] hover:border-[#00E5FF] focus-visible:border-[#00E5FF]"
|
||||
? "cursor-not-allowed border-black opacity-60"
|
||||
: "cursor-pointer border-black hover:border-[#00E5FF] focus-visible:border-[#00E5FF]"
|
||||
}`}
|
||||
>
|
||||
{uploading ? (
|
||||
<div className="w-full max-w-md space-y-2">
|
||||
<span className="inline-flex items-center gap-2 text-xs text-[#c7c3c1]">
|
||||
<span className="inline-flex items-center gap-2 text-xs text-[#333]">
|
||||
<Loading size={14} label="Uploading" />
|
||||
{progress < 100 ? `Uploading ${progress}%` : "Upload sent — the collective's server is taking it in…"}{" "}
|
||||
{file !== null && `${file.name} (${formatBytes(file.size)})`}
|
||||
|
|
@ -354,15 +354,15 @@ function SubmitForm({ token, box }: { token: string; box: SubmissionBoxInfo }):
|
|||
</div>
|
||||
) : file !== null && kind !== null ? (
|
||||
<>
|
||||
<span className="text-sm font-medium text-[#f5efed]">{file.name}</span>
|
||||
<span className="text-2xs text-[#a4a09e]">
|
||||
<span className="text-sm font-medium text-black">{file.name}</span>
|
||||
<span className="text-2xs text-[#555]">
|
||||
{kind === "video" ? "video" : "photo"} · {formatBytes(file.size)} · click or drop to choose another
|
||||
</span>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<span className="text-sm text-[#c7c3c1]">Drop your video or photo here</span>
|
||||
<span className="text-2xs leading-relaxed text-[#a4a09e]">
|
||||
<span className="text-sm text-[#333]">Drop your video or photo here</span>
|
||||
<span className="text-2xs leading-relaxed text-[#555]">
|
||||
or browse your device, or paste a file. Nothing is sent until you press Send.
|
||||
</span>
|
||||
<span className="mt-2 rounded-md bg-[#00E5FF] px-3 py-1.5 text-xs font-medium text-black">Browse files</span>
|
||||
|
|
@ -381,11 +381,11 @@ function SubmitForm({ token, box }: { token: string; box: SubmissionBoxInfo }):
|
|||
/>
|
||||
</div>
|
||||
|
||||
{fileError !== null && <p role="alert" className="text-xs text-[#ff6f6b]">{fileError}</p>}
|
||||
{error !== null && <p role="alert" className="rounded-md border border-[#00E5FF]/30 bg-[#00E5FF]/10 px-3 py-2 text-xs text-[#ff9b97]">{error}</p>}
|
||||
{fileError !== null && <p role="alert" className="text-xs text-[#c4001a]">{fileError}</p>}
|
||||
{error !== null && <p role="alert" className="rounded-md border border-[#00E5FF]/30 bg-[#00E5FF]/10 px-3 py-2 text-xs text-[#c4001a]">{error}</p>}
|
||||
|
||||
<div className="space-y-4">
|
||||
<label className="flex cursor-pointer items-start gap-2.5 rounded-lg border border-[#3a312e] bg-[#060403] p-3">
|
||||
<label className="flex cursor-pointer items-start gap-2.5 rounded-lg border border-black bg-white p-3">
|
||||
<input
|
||||
type="checkbox"
|
||||
checked={licence}
|
||||
|
|
@ -393,12 +393,12 @@ function SubmitForm({ token, box }: { token: string; box: SubmissionBoxInfo }):
|
|||
disabled={uploading}
|
||||
className="mt-0.5 h-4 w-4 shrink-0 accent-[#00E5FF]"
|
||||
/>
|
||||
<span className="text-xs leading-relaxed text-[#c7c3c1]">
|
||||
{SUBMISSION_LICENSE_TEXT} <span className="text-[#00E5FF]">(required)</span>
|
||||
<span className="text-xs leading-relaxed text-[#333]">
|
||||
{SUBMISSION_LICENSE_TEXT} <span className="text-[#00798a]">(required)</span>
|
||||
</span>
|
||||
</label>
|
||||
|
||||
<label className="block text-2xs text-[#a4a09e]">
|
||||
<label className="block text-2xs text-[#555]">
|
||||
Credit name (optional, max {SUBMISSION_CREDIT_MAX})
|
||||
<input
|
||||
type="text"
|
||||
|
|
@ -407,12 +407,12 @@ function SubmitForm({ token, box }: { token: string; box: SubmissionBoxInfo }):
|
|||
onChange={(event) => setCreditName(event.target.value)}
|
||||
disabled={uploading}
|
||||
placeholder="How your name should appear in the credit"
|
||||
className="mt-1 w-full rounded-md border border-[#3a312e] bg-[#060403] px-3 py-2 text-sm text-[#f5efed] placeholder:text-[#6b6563] focus:border-[#00E5FF] focus:outline-none"
|
||||
className="mt-1 w-full rounded-md border border-black bg-white px-3 py-2 text-sm text-black placeholder:text-[#888] focus:border-[#00E5FF] focus:outline-none"
|
||||
/>
|
||||
{creditTooLong && <span className="mt-1 block text-[#ff6f6b]">Up to {SUBMISSION_CREDIT_MAX} characters.</span>}
|
||||
{creditTooLong && <span className="mt-1 block text-[#c4001a]">Up to {SUBMISSION_CREDIT_MAX} characters.</span>}
|
||||
</label>
|
||||
|
||||
<label className="block text-2xs text-[#a4a09e]">
|
||||
<label className="block text-2xs text-[#555]">
|
||||
Contact (optional, max {SUBMISSION_CONTACT_MAX})
|
||||
<textarea
|
||||
value={contact}
|
||||
|
|
@ -421,9 +421,9 @@ function SubmitForm({ token, box }: { token: string; box: SubmissionBoxInfo }):
|
|||
disabled={uploading}
|
||||
rows={2}
|
||||
placeholder="How licensors can reach you — shown only to admins"
|
||||
className="mt-1 w-full resize-none rounded-md border border-[#3a312e] bg-[#060403] px-3 py-2 text-sm text-[#f5efed] placeholder:text-[#6b6563] focus:border-[#00E5FF] focus:outline-none"
|
||||
className="mt-1 w-full resize-none rounded-md border border-black bg-white px-3 py-2 text-sm text-black placeholder:text-[#888] focus:border-[#00E5FF] focus:outline-none"
|
||||
/>
|
||||
{contactTooLong && <span className="mt-1 block text-[#ff6f6b]">Up to {SUBMISSION_CONTACT_MAX} characters.</span>}
|
||||
{contactTooLong && <span className="mt-1 block text-[#c4001a]">Up to {SUBMISSION_CONTACT_MAX} characters.</span>}
|
||||
</label>
|
||||
</div>
|
||||
|
||||
|
|
@ -434,7 +434,7 @@ function SubmitForm({ token, box }: { token: string; box: SubmissionBoxInfo }):
|
|||
>
|
||||
{uploading ? `Sending… ${progress}%` : "Send to the collective"}
|
||||
</button>
|
||||
<p className="text-center text-2xs leading-relaxed text-[#a4a09e]">
|
||||
<p className="text-center text-2xs leading-relaxed text-[#555]">
|
||||
The collective reviews every submission before anything is used. Your contact details stay with their admins.
|
||||
</p>
|
||||
</form>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue