Animated flip cards

'use client';

import * as React from 'react'
import { AnimatedCard } from "@/components/ui/animated-flip-cards"

export function Demo() {
  const data = [
    {
      date: '20 May, 2023',
      company: 'Amazon',
      role: 'Senior UI/UX Designer',
      logo: 'https://cdn.jsdelivr.net/gh/devicons/devicon@latest/icons/amazonwebservices/amazonwebservices-original-wordmark.svg',
      tags: ['Part time', 'Full time', 'Distant', 'Remote'],
      rate: '$250/hr',
      location: 'San Francisco, CA',
      backgroundColor: 'bg-red-100',
      backFaceContent:
        "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s check",
    },
    {
      date: '21 June, 2023',
      company: 'Google',
      role: 'Frontend Developer',
      logo: 'https://cdn.jsdelivr.net/gh/devicons/devicon@latest/icons/google/google-original.svg',
      tags: ['Full time', 'Tech', 'Remote', 'Project work'],
      rate: '$200/hr',
      location: 'Mountain View, CA',
      backgroundColor: 'bg-[#D6F6ED]',
      backFaceContent:
        "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s",
    },
  ];
  return (
    <section
      className="m-auto h-screen items-center justify-center flex-wrap flex gap-6 "
    >
      {data.map((job) => (
        <AnimatedCard key={job.company} {...job} />
      ))}
    </section>
  );
};