Files
zeekay 9d66337dec Show the brand as the Hanzo eSign wordmark alone, under hanzo.ai's bar
The wordmark was an SVG that guessed its own width, and clipped the name
to "Hanzo Sigı". It is now text: NEXT_PUBLIC_APP_NAME, "Hanzo eSign" by
default, measured by the browser and sized by the caller, with no mark in
front of it anywhere. The mobile menu and the public profile header drew
the upstream Documenso logo; the emails and the sealed PDF's certificate
and audit log drew it too, from static/logo.png, which is now the
wordmark set in Zen.

The app header is hanzo.ai's: the wordmark at the left, quiet nav, pill
controls at the right, a hairline under it. A visitor without a session
sees the same bar with the wordmark alone, and a footer with the
copyright and hanzo.ai's terms and privacy policy, on sign-in, the other
unauthenticated pages, a recipient's completion and result pages and
public profiles. The signing pages keep their own bar, which now shows
the wordmark at every width.
2026-10-20 12:47:20 -07:00

31 lines
939 B
TypeScript

import type { ReactNode } from 'react';
import { cn } from '@hanzo/esign-ui/lib/utils';
export type PageHeaderProps = {
title: ReactNode;
description?: ReactNode;
/** Rendered at the trailing edge of the title row. */
children?: ReactNode;
className?: string;
};
/**
* The title of a page, and the one gap between it and its description. A
* heading and the line explaining it are one unit, so they sit closer to each
* other than to anything else on the page.
*/
export const PageHeader = ({ title, description, children, className }: PageHeaderProps) => {
return (
<div className={cn('flex flex-row items-center justify-between gap-x-4', className)}>
<div className="space-y-1.5">
<h1 className="text-3xl font-semibold tracking-tight">{title}</h1>
{description && <p className="text-balance text-sm text-muted-foreground">{description}</p>}
</div>
{children}
</div>
);
};