30 lines
809 B
TypeScript
30 lines
809 B
TypeScript
|
import React from 'react';
|
||
|
|
import { useTheme } from '../../contexts/ThemeContext';
|
||
|
|
|
||
|
|
export const TPattern: React.FC = () => {
|
||
|
|
const { theme, isDark } = useTheme();
|
||
|
|
const patternOpacity = isDark ? 0.03 : 0.04;
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div
|
||
|
|
style={{
|
||
|
|
position: 'absolute',
|
||
|
|
top: 0,
|
||
|
|
right: 0,
|
||
|
|
width: 300,
|
||
|
|
height: 300,
|
||
|
|
opacity: patternOpacity,
|
||
|
|
pointerEvents: 'none',
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
<svg width="300" height="300" viewBox="0 0 300 300">
|
||
|
|
<defs>
|
||
|
|
<pattern id="grid" width="30" height="30" patternUnits="userSpaceOnUse">
|
||
|
|
<path d="M 30 0 L 0 0 0 30" fill="none" stroke={theme.accent} strokeWidth="1"/>
|
||
|
|
</pattern>
|
||
|
|
</defs>
|
||
|
|
<rect width="300" height="300" fill="url(#grid)"/>
|
||
|
|
</svg>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
};
|