mirror of
https://github.com/hanzo-apps/dataroom.git
synced 2026-10-30 14:47:36 +00:00
zeekay
cefb0c8a11
Replace the placeholder H badge with the canonical Hanzo mark (the
abstract H-shape from ~/work/hanzo/logo). Mark renders via
currentColor so it inherits whatever color the parent text sets —
no per-theme variants needed.
White-label is now fully driven by env:
NEXT_PUBLIC_APP_NAME full app name ('Hanzo Dataroom')
NEXT_PUBLIC_APP_NAME_PRIMARY first wordmark token (default: first
word of APP_NAME)
NEXT_PUBLIC_APP_NAME_SUFFIX remainder (default: rest of APP_NAME)
NEXT_PUBLIC_APP_TAGLINE sub-line under the welcome headline
NEXT_PUBLIC_IAM_PROVIDER_NAME IAM brand for 'Sign in with X' button
NEXT_PUBLIC_MARKETING_URL base URL for Terms / Privacy links
Tenants drop in their own NEXT_PUBLIC_APP_NAME='Acme Rooms' and the
whole page reads correctly with no code changes — wordmark + welcome
copy + terms attribution all pick up automatically. The mark itself
stays Hanzo (this IS a Hanzo app); tenants that need their own glyph
swap the HanzoMark import for a custom <img src=BRAND_LOGO_URL />.
Favicons regenerated from the canonical SVG too.
59 lines
1.7 KiB
TypeScript
59 lines
1.7 KiB
TypeScript
// Canonical Hanzo mark — single-source SVG, mono via currentColor so it
|
|
// adopts whatever text color its parent sets. This is the same vector
|
|
// shipped in @hanzo/logo's docs/assets/hanzo-logo.svg, repainted to use
|
|
// currentColor instead of #000/#666 so it composes cleanly into any
|
|
// theme.
|
|
//
|
|
// White-label rule: this component renders the MARK only. The wordmark
|
|
// (brand name + suffix) is rendered separately by the consumer using
|
|
// process.env.NEXT_PUBLIC_APP_NAME so tenants can drop in their own
|
|
// brand without forking the component.
|
|
|
|
import * as React from "react";
|
|
|
|
import { cn } from "@/lib/utils";
|
|
|
|
export type HanzoMarkProps = React.SVGProps<SVGSVGElement> & {
|
|
size?: number;
|
|
};
|
|
|
|
export function HanzoMark({
|
|
size = 24,
|
|
className,
|
|
...props
|
|
}: HanzoMarkProps) {
|
|
return (
|
|
<svg
|
|
viewBox="0 0 67 67"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
width={size}
|
|
height={size}
|
|
aria-label="Hanzo"
|
|
className={cn("text-current", className)}
|
|
{...props}
|
|
>
|
|
<path d="M22.21 67V44.6369H0V67H22.21Z" fill="currentColor" />
|
|
<path
|
|
d="M0 44.6369L22.21 46.8285V44.6369H0Z"
|
|
fill="currentColor"
|
|
opacity="0.4"
|
|
/>
|
|
<path
|
|
d="M66.7038 22.3184H22.2534L0.0878906 44.6367H44.4634L66.7038 22.3184Z"
|
|
fill="currentColor"
|
|
/>
|
|
<path d="M22.21 0H0V22.3184H22.21V0Z" fill="currentColor" />
|
|
<path d="M66.7198 0H44.5098V22.3184H66.7198V0Z" fill="currentColor" />
|
|
<path
|
|
d="M66.6753 22.3185L44.5098 20.0822V22.3185H66.6753Z"
|
|
fill="currentColor"
|
|
opacity="0.4"
|
|
/>
|
|
<path
|
|
d="M66.7198 67V44.6369H44.5098V67H66.7198Z"
|
|
fill="currentColor"
|
|
/>
|
|
</svg>
|
|
);
|
|
}
|