Files
5c279eba-87be-417a-a210-ddc…/src/components/shared/SvgTextLogo/SvgTextLogo.tsx

46 lines
913 B
TypeScript

import React from 'react';
interface SvgTextLogoProps {
text: string;
className?: string;
fontSize?: number;
fontWeight?: string | number;
fill?: string;
}
const SvgTextLogo: React.FC<SvgTextLogoProps> = ({
text,
className = '',
fontSize = 48,
fontWeight = 700,
fill = 'currentColor',
}) => {
const textLength = text.length;
const charWidth = fontSize * 0.6;
const width = textLength * charWidth + 40;
const height = fontSize + 20;
return (
<svg
viewBox={`0 0 ${width} ${height}`}
className={className}
xmlns="http://www.w3.org/2000/svg"
preserveAspectRatio="xMidYMid meet"
>
<text
x="50%"
y="50%"
fontSize={fontSize}
fontWeight={fontWeight}
fill={fill}
textAnchor="middle"
dominantBaseline="central"
>
{text}
</text>
</svg>
);
};
export default SvgTextLogo;