Files
9ca2c65a-c42d-4669-9b2d-24e…/src/components/shared/SvgTextLogo/SvgTextLogo.tsx

43 lines
1022 B
TypeScript

import React from 'react';
interface SvgTextLogoProps {
text: string;
className?: string;
fontSize?: number;
fontWeight?: number | string;
letterSpacing?: number;
dominantBaseline?: 'auto' | 'text-bottom' | 'alphabetic' | 'ideographic' | 'middle' | 'central' | 'mathematical' | 'hanging';
}
const SvgTextLogo: React.FC<SvgTextLogoProps> = ({
text,
className = '',
fontSize = 48,
fontWeight = 700,
letterSpacing = 0,
dominantBaseline = 'middle',
}) => {
return (
<svg
viewBox={`0 0 ${text.length * fontSize * 0.6} ${fontSize * 1.5}`}
className={`w-full h-auto ${className}`}
preserveAspectRatio="xMidYMid meet"
>
<text
x="50%"
y="50%"
textAnchor="middle"
dominantBaseline={dominantBaseline}
fontSize={fontSize}
fontWeight={fontWeight}
letterSpacing={letterSpacing}
fill="currentColor"
className="font-sans"
>
{text}
</text>
</svg>
);
};
export default SvgTextLogo;