Files
b4fa4cc8-e2a6-4ae7-9392-1ee…/src/components/shared/SvgTextLogo/SvgTextLogo.tsx

49 lines
980 B
TypeScript

import React from 'react';
interface SvgTextLogoProps {
text: string;
fontSize?: number;
fontFamily?: string;
fill?: string;
className?: string;
}
const SvgTextLogo: React.FC<SvgTextLogoProps> = ({
text,
fontSize = 32,
fontFamily = 'Arial, sans-serif',
fill = '#000000',
className = '',
}) => {
const textLength = text.length;
const charWidth = fontSize * 0.6;
const width = textLength * charWidth + 40;
const height = fontSize + 40;
return (
<svg
viewBox={`0 0 ${width} ${height}`}
width={width}
height={height}
xmlns="http://www.w3.org/2000/svg"
className={className}
role="img"
aria-label={`Logo: ${text}`}
>
<text
x={width / 2}
y={height / 2}
fontSize={fontSize}
fontFamily={fontFamily}
fill={fill}
textAnchor="middle"
dominantBaseline="central"
>
{text}
</text>
</svg>
);
};
export default SvgTextLogo;