jayjennings
a382fa904a
- Added shared styles for UI components in `src/components/styles.ts`. - Created configuration constants in `src/lib/config.ts`. - Implemented date formatting and greeting functions in `src/lib/dates.ts` and corresponding tests in `src/lib/dates.test.ts`. - Developed incident management functions in `src/lib/incidents.ts` with tests in `src/lib/incidents.test.ts`. - Established navigation structure in `src/lib/navigation.ts`. - Seeded demo data for incidents and users in `src/lib/seed.ts`. - Defined tone classes for UI elements in `src/lib/tones.ts`. - Created type definitions for incidents and related entities in `src/lib/types.ts`. - Set up main application entry point in `src/main.tsx`. - Developed various pages including About, Analytics, Incidents, Locations, Overview, and Report Incident. - Configured testing setup in `src/test/setup.ts` and TypeScript configurations. - Integrated Vite for development and testing with appropriate plugins.
23 lines
668 B
TypeScript
23 lines
668 B
TypeScript
import type { ReactNode } from 'react'
|
|
import { Eyebrow } from './Eyebrow'
|
|
|
|
interface PageIntroProps {
|
|
eyebrow: string
|
|
title: string
|
|
copy?: string
|
|
action?: ReactNode
|
|
}
|
|
|
|
export function PageIntro({ eyebrow, title, copy, action }: PageIntroProps) {
|
|
return (
|
|
<div className="mb-[31px] flex flex-col items-start gap-5 sm:flex-row sm:items-center sm:justify-between">
|
|
<div>
|
|
<Eyebrow>{eyebrow}</Eyebrow>
|
|
<h1 className="mt-[7px] mb-[5px] font-display text-[29px] font-semibold tracking-[-1px] text-ink sm:text-[34px]">{title}</h1>
|
|
{copy && <p className="text-sm text-muted">{copy}</p>}
|
|
</div>
|
|
{action}
|
|
</div>
|
|
)
|
|
}
|