@@ -0,0 +1,30 @@
|
||||
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,
|
||||
)}
|
||||
/>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user