Update src/components/shared/SvgTextLogo/SvgTextLogo.tsx

Merge version_2 into main

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #fde8f3;
+  --background: #fef5f8;
   --card: #ffffff;
-  --foreground: #5a1f42;
-  --primary-cta: #d946a6;
+  --foreground: #6b2d52;
+  --primary-cta: #ec4899;
   --primary-cta-text: #ffffff;
   --secondary-cta: #ffffff;
   --secondary-cta-text: #5a1f42;
   --accent: #f472b6;
-  --background-accent: #ec4899;
+  --background-accent: #fbcfe8;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);

src/components/shared/SvgTextLogo/SvgTextLogo.tsx

@@ -6,7 +6,6 @@ interface SvgTextLogoProps {
   fontSize?: number;
   fontWeight?: number | string;
   letterSpacing?: number;
-  fill?: string;
 }
 
 const SvgTextLogo: React.FC<SvgTextLogoProps> = ({
@@ -15,22 +14,22 @@ const SvgTextLogo: React.FC<SvgTextLogoProps> = ({
   fontSize = 48,
   fontWeight = 700,
   letterSpacing = 0,
-  fill = 'currentColor',
 }) => {
   return (
     <svg
-      viewBox={`0 0 ${text.length * fontSize * 0.6} ${fontSize * 1.2}`}
-      className={`h-auto w-auto ${className}`}
+      viewBox={`0 0 ${text.length * fontSize * 0.6} ${fontSize * 1.5}`}
+      className={className}
       xmlns="http://www.w3.org/2000/svg"
     >
       <text
-        x="0"
-        y={fontSize}
+        x="50%"
+        y="50%"
+        textAnchor="middle"
+        dominantBaseline="central"
         fontSize={fontSize}
         fontWeight={fontWeight}
         letterSpacing={letterSpacing}
-        fill={fill}
-        dominantBaseline="hanging"
+        fill="currentColor"
       >
         {text}
       </text>