fix: timeline svg

Author: giorgia-bagnasco

src/components/Sanity/Timeline.tsx

@@ -1,41 +1,14 @@
-import * as React from "react";
-
 import Landscape from "./Timeline/Landscape";
 import Portrait from "./Timeline/Portrait";
 
 const Timeline = () => {
-  const [{ height, width }, setSizes] = React.useState<{
-    width: number;
-    height: number;
-  }>({
-    width: 0,
-    height: 0,
-  });
-
-  React.useEffect(() => {
-    const handleResize = () => {
-      const width = window.innerWidth - 32;
-      const height = (width * 695) / 732;
-      setSizes({ width, height });
-    };
-
-    if (typeof window !== "undefined") {
-      handleResize();
-      window.addEventListener("resize", handleResize);
-    }
-
-    return () => {
-      window.removeEventListener("resize", handleResize);
-    };
-  }, []);
-
   return (
     <div className="flex w-full items-center justify-center">
-      <div className="hidden sm:block">
+      <div className="relative hidden px-[16px] sm:block">
         <Landscape />
       </div>
-      <div className="block w-full px-[16px] sm:hidden">
-        <Portrait width={width} height={height} />
+      <div className="relative block w-full px-[16px] sm:hidden">
+        <Portrait />
       </div>
     </div>
   );

src/components/Sanity/Timeline/Landscape.tsx

@@ -5,6 +5,7 @@ const Landscape = () => (
     viewBox="0 0 1220 412"
     fill="none"
     xmlns="http://www.w3.org/2000/svg"
+    className="w-full"
   >
     <circle cx="7" cy="17" r="7" fill="white" />
     <path

src/components/Sanity/Timeline/Portrait.tsx

@@ -1,15 +1,16 @@
-interface Props {
-  height: number;
-  width: number;
-}
+// interface Props {
+//   height: number;
+//   width: number;
+// }
 
-const Portrait = ({ height, width }: Props) => (
+const Portrait = () => (
   <svg
-    width={height}
-    height={width}
+    width="732"
+    height="835"
     viewBox="0 0 732 835"
     fill="none"
     xmlns="http://www.w3.org/2000/svg"
+    className="w-full"
   >
     <path
       d="M354 15.3333C352.527 15.3333 351.333 16.5272 351.333 18C351.333 19.4728 352.527 20.6667 354 20.6667C355.473 20.6667 356.667 19.4728 356.667 18C356.667 16.5272 355.473 15.3333 354 15.3333ZM353.5 741C353.5 741.276 353.724 741.5 354 741.5C354.276 741.5 354.5 741.276 354.5 741L353.5 741ZM354 18L353.5 18L353.5 741L354 741L354.5 741L354.5 18L354 18Z"