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

…100x#480) Co-authored-by: Vineet Agarwal <[email protected]>
pratiiikkk · Oct 9, 2024 · e233092 · e233092
1 parent 06258fc
commit e233092
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 11 deletions.
diff --git a/src/app/globals.css b/src/app/globals.css
@@ -392,6 +392,7 @@ html {
   display: inline-block;
   transform: rotate(-2deg);
 }
+
 .react-tweet-theme {
   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
@@ -24,7 +26,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)',