31 lines
1.0 KiB
TypeScript
31 lines
1.0 KiB
TypeScript
import { cn } from '@/lib/utils';
|
|
|
|
/**
|
|
* Blurred crimson light used as section atmosphere. Position and size come
|
|
* from `className`; it is toned down in light mode so text stays crisp.
|
|
*/
|
|
export default function Glow({ className }: { className?: string }) {
|
|
return (
|
|
<div
|
|
aria-hidden="true"
|
|
className={cn(
|
|
'bg-paj-crimson/20 pointer-events-none absolute rounded-full opacity-40 blur-[130px] dark:opacity-100',
|
|
className,
|
|
)}
|
|
/>
|
|
);
|
|
}
|
|
|
|
/** Faint engineering grid pattern for hero backgrounds. */
|
|
export function GridPattern({ className }: { className?: string }) {
|
|
return (
|
|
<div
|
|
aria-hidden="true"
|
|
className={cn(
|
|
'pointer-events-none absolute inset-0 [background-image:linear-gradient(to_right,var(--site-on-surface)_1px,transparent_1px),linear-gradient(to_bottom,var(--site-on-surface)_1px,transparent_1px)] [background-size:40px_40px] opacity-[0.04]',
|
|
className,
|
|
)}
|
|
/>
|
|
);
|
|
}
|