fix: testimonial loading, animation and ui fixes (#479)

code100x · Oct 7, 2024 · 19d4469 · 19d4469
1 parent b76097f
commit 19d4469
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 17 deletions.
diff --git a/src/app/globals.css b/src/app/globals.css
@@ -392,9 +392,3 @@ html {
   display: inline-block;
   transform: rotate(-2deg);
 }
-.react-tweet-theme {
-  height: 100%;
-}
-.tweet-container_article__0ERPK {
-  height: 100%;
-}
diff --git a/src/components/Testimonials.tsx b/src/components/Testimonials.tsx
@@ -12,6 +12,8 @@ const tweetIds = [
   '1826968639049724010',
 ];
 
+const finalTweetIds = [...tweetIds, ...tweetIds];
+
 export default function Testimonials() {
   return (
     <div className="flex justify-center items-center min-h-fit max-w-[90vw] sm:max-w-[100vw]  overflow-hidden flex-col">
@@ -21,7 +23,11 @@ export default function Testimonials() {
           Real Success Stories from Job Seekers and Employers
         </p>
       </div>
-      <InfiniteMovingCards items={tweetIds} direction="right" speed="slow" />
+      <InfiniteMovingCards
+        items={finalTweetIds}
+        direction="right"
+        speed="slow"
+      />
     </div>
   );
 }
diff --git a/src/components/ui/infinite-moving-cards.tsx b/src/components/ui/infinite-moving-cards.tsx
@@ -26,15 +26,6 @@ export const InfiniteMovingCards = ({
   const [start, setStart] = useState(false);
   function addAnimation() {
     if (containerRef.current && scrollerRef.current) {
-      const scrollerContent = Array.from(scrollerRef.current.children);
-
-      scrollerContent.forEach((item) => {
-        const duplicatedItem = item.cloneNode(true);
-        if (scrollerRef.current) {
-          scrollerRef.current.appendChild(duplicatedItem);
-        }
-      });
-
       getDirection();
       getSpeed();
       setStart(true);
@@ -84,7 +75,7 @@ export const InfiniteMovingCards = ({
       >
         {items.map((id, index) => (
           <li
-            className="w-[350px] min-h-fit h-[700px] max-w-full relative rounded-2xl   flex-shrink-0  px-8 py-6 md:w-[450px]"
+            className="w-[350px] min-h-fit max-w-full relative rounded-2xl   flex-shrink-0  px-8 py-6 md:w-[450px]"
             // style={{
             //   background:
             //     'linear-gradient(180deg, var(--slate-800), var(--slate-900)',