united-tattoo/components/united/section-label.tsx
Nicholai 3e739877b4 feat(components): add new UI components for enhanced user experience
- Introduced multiple new components including AnimatedLink, Button, Calendar, Card, ColorSwatch, Divider, Filmstrip, FormContainer, FormField, GalleryCard, Heading, HeroOverlay, IdentitySection, ImmersionSection, NewArtistsSection, NewContactSection, NewHero, NewNavigation, Reveal, SectionLabel, StickySplit, and Toast.
- Each component is designed with responsive layouts and customizable styles to improve the overall UI consistency and interactivity.
- Implemented accessibility features and animations to enhance user engagement.

This commit significantly expands the component library, providing a robust foundation for building a cohesive user interface.
2025-11-25 03:00:50 -07:00

28 lines
676 B
TypeScript

import * as React from "react"
import { cn } from "@/lib/utils"
export interface SectionLabelProps extends React.HTMLAttributes<HTMLSpanElement> {
number?: string
}
const SectionLabel = React.forwardRef<HTMLSpanElement, SectionLabelProps>(
({ className, number, children, ...props }, ref) => {
return (
<span
ref={ref}
className={cn(
"block text-[0.75rem] font-semibold uppercase tracking-[0.3em] text-[var(--moss)] mb-3",
className,
)}
{...props}
>
{number && <>{number} </>}
{children}
</span>
)
},
)
SectionLabel.displayName = "SectionLabel"
export { SectionLabel }