add full data of panel

src/App.tsx

@@ -18,7 +18,7 @@ const App = () => {
  <PanelDiscussion />
  <Schedule />
  <RegisterEvent />
- <Support />
+ {/* <Support /> */}
  <About />
  </div>
  );

src/components/About.tsx

@@ -2,80 +2,149 @@ import swiftMumbai from "../assets/images/organisers/swift-mumbai.svg";
 import swiftBengaluru from "../assets/images/organisers/swift-begaluru.svg";
 import swiftHyderabad from "../assets/images/organisers/swift-hyderabad.svg";
 
+import leader01 from "../assets/images/about/delhi/01.svg";
+import leader02 from "../assets/images/about/ahemdabad/01.svg";
+import leader03 from "../assets/images/about/ahemdabad/02.svg";
+import leader04 from "../assets/images/about/mumbai/01.svg";
+import leader05 from "../assets/images/about/mumbai/02.svg";
+import leader06 from "../assets/images/about/mumbai/03.svg";
+import leader07 from "../assets/images/about/bengaluru/01.svg";
+import leader08 from "../assets/images/about/bengaluru/02.svg";
+import leader09 from "../assets/images/about/bengaluru/03.svg";
+import leader10 from "../assets/images/about/hyderabad/01.svg";
+import leader11 from "../assets/images/about/hyderabad/02.svg";
+
 const About = () => {
  const listOfChapters = [
  {
  id: 1,
+ name: "Watch Party Delhi",
+ voulenteers: [
+ {
+ id: 1,
+ name: "Raghav Sethi",
+ designation: "iOS Developer",
+ company: "Freelance",
+ imageSrc: leader01,
+ linkedIn: "",
+ twitter: "",
+ },
+ ],
+ },
+ {
+ id: 2,
+ name: "Swift Ahemdadbad",
+ voulenteers: [
+ {
+ id: 3,
+ name: "Devanshi Modha",
+ designation: "Senior iOS Developer",
+ company: "",
+ imageSrc: leader02,
+ linkedIn: "",
+ twitter: "",
+ },
+ {
+ id: 4,
+ name: "Pallav Trivedi",
+ designation: "Senior iOS Developer",
+ company: "Assistant Project Manager",
+ imageSrc: leader03,
+ linkedIn: "",
+ twitter: "",
+ },
+ ],
+ },
+ {
+ id: 3,
  name: "Swift Mumbai",
  icon: swiftMumbai,
  voulenteers: [
  {
- id: 1,
- name: "John Appleseed",
- designation: "iOS Engineer, Apple",
- location: "Swift Mumbai",
+ id: 5,
+ name: "Raj H Raval",
+ designation: "Public Relations",
+ company: "",
+ imageSrc: leader04,
+ linkedIn: "",
+ twitter: "",
  },
  {
- id: 2,
- name: "Jane Appleseed",
- designation: "iOS Engineer, Apple",
- location: "Swift Bengaluru",
+ id: 6,
+ name: "Yogesh",
+ designation: "Senior iOS Developer",
+ company: "100ms",
+ imageSrc: leader05,
+ linkedIn: "",
+ twitter: "",
  },
  {
- id: 3,
- name: "John Doe",
- designation: "iOS Engineer, Apple",
- location: "Swift Hyderabad",
+ id: 7,
+ name: "Akanksha Sharma",
+ designation: "Senior Software Engineer",
+ company: "HERE Maps",
+ imageSrc: leader06,
+ linkedIn: "",
+ twitter: "",
  },
  ],
  },
  {
- id: 2,
+ id: 4,
  name: "Swift Bengaluru",
  icon: swiftBengaluru,
  voulenteers: [
  {
- id: 1,
- name: "John Appleseed",
- designation: "iOS Engineer, Apple",
- location: "Swift Mumbai",
+ id: 8,
+ name: "Amit Samant",
+ designation: "Senior iOS Engineer",
+ company: "",
+ imageSrc: leader07,
+ linkedIn: "",
+ twitter: "",
  },
  {
- id: 2,
- name: "Jane Appleseed",
- designation: "iOS Engineer, Apple",
- location: "Swift Bengaluru",
+ id: 9,
+ name: "Sinchan Maitri",
+ designation: "iOS Engineer",
+ company: "",
+ imageSrc: leader08,
+ linkedIn: "",
+ twitter: "",
  },
  {
- id: 3,
- name: "John Doe",
- designation: "iOS Engineer, Apple",
- location: "Swift Hyderabad",
+ id: 10,
+ name: "Nayyan Mujadiya",
+ designation: "R & D Engineer",
+ company: "",
+ imageSrc: leader09,
+ linkedIn: "",
+ twitter: "",
  },
  ],
  },
  {
- id: 3,
+ id: 5,
  name: "Swift Hyderabad",
  icon: swiftHyderabad,
  voulenteers: [
  {
- id: 1,
- name: "John Appleseed",
- designation: "iOS Engineer, Apple",
- location: "Swift Mumbai",
+ id: 11,
+ name: "Ranga Reddy",
+ designation: "Senior Software Engineer",
+ company: "",
+ imageSrc: leader10,
+ linkedIn: "",
+ twitter: "",
  },
  {
- id: 2,
- name: "Jane Appleseed",
- designation: "iOS Engineer, Apple",
- location: "Swift Bengaluru",
- },
- {
- id: 3,
- name: "John Doe",
- designation: "iOS Engineer, Apple",
- location: "Swift Hyderabad",
+ id: 12,
+ name: "Anirudh Jwala",
+ designation: "Senior Software Engineer",
+ company: "IRIS",
+ imageSrc: leader11,
+ linkedIn: "",
+ twitter: "",
  },
  ],
  },
@@ -95,7 +164,7 @@ const About = () => {
  Ahemdabad.
  </p>
  <div className='h-8'></div>
- <div className='flex flex-col items-center max-w-fit'>
+ <div className='flex flex-col'>
  {listOfChapters.map((chapter) => (
  <div key={chapter.id}>
  <div className='flex items-center justify-center mb-4'>
@@ -111,19 +180,55 @@ const About = () => {
  </p>
  </div>
 
- <div className='grid grid-cols-2 md:grid-cols-3 items-center justify-items-center gap-8'>
+ <div className='grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 mx-auto gap-8'>
  {chapter.voulenteers.map((voulenteer) => (
  <div
  key={voulenteer.id}
- className='flex flex-col items-center mx-4'
+ className='flex flex-col items-center'
  >
- <div className='w-24 h-24 rounded-full bg-slate-200 mb-4' />
- <p className='font-semibold text-base text-white text-center'>
+ <img
+ src={voulenteer.imageSrc}
+ alt={voulenteer.name}
+ className='w-40 h-40 rounded-full mb-4 object-cover'
+ />
+ <p className='font-semibold text-xl text-white text-center'>
  {voulenteer.name}
  </p>
- <p className='text-xs font-medium text-white text-center'>
- {voulenteer.location}
+ <p className='text-base text-slate-400 text-center'>
+ {voulenteer.designation}
+ </p>
+ <p className='text-base mb-1 text-slate-400 text-center'>
+ {voulenteer.company}
  </p>
+ <div className='h-2'></div>
+ <div
+ className={`flex items-center ${
+ voulenteer.linkedIn && voulenteer.twitter
+ ? "justify-between"
+ : "justify-center"
+ }`}
+ >
+ {voulenteer.linkedIn && (
+ <i
+ className={`fa-brands fa-linkedin-in text-white cursor-pointer ${
+ voulenteer.linkedIn && voulenteer.twitter
+ ? "mr-4"
+ : "mr-0"
+ }`}
+ onClick={() => {
+ window.open(voulenteer.linkedIn, "_blank");
+ }}
+ ></i>
+ )}
+ {voulenteer.twitter && (
+ <i
+ className='fa-brands fa-twitter text-white cursor-pointer'
+ onClick={() => {
+ window.open(voulenteer.twitter, "_blank");
+ }}
+ ></i>
+ )}
+ </div>
  </div>
  ))}
  </div>

src/components/Header.tsx

@@ -22,12 +22,13 @@ const Header = () => {
  >
  About
  </Link>
- <Link
- to='#sponsor'
+ <a
+ href='https://docs.google.com/document/d/1I4Jr1OWuk5C_ZjlbrUzQv2Qb2PJApntWghPpVojfh2o/view'
+ target='_blank'
  className='font-medium hover:text-orange-gradient text-slate-300 text-sm'
  >
- Sponsor
- </Link>
+ Code of Conduct
+ </a>
  <Link
  to='#register'
  className='font-medium hover:text-pink-gradient text-slate-300 text-sm'
@@ -76,15 +77,16 @@ const Header = () => {
  >
  About
  </Link>
- <Link
- to='#sponsor'
+ <a
+ href='https://docs.google.com/document/d/1I4Jr1OWuk5C_ZjlbrUzQv2Qb2PJApntWghPpVojfh2o/view'
+ target='_blank'
  onClick={() => {
  setShowNavDialog("hidden");
  }}
  className='font-medium text-xl text-slate-300 hover:text-orange-gradient block rounded-lg m-3 p-3 transition duration-200'
  >
- Sponsor
- </Link>
+ Code of Conduct
+ </a>
  <Link
  to='#register'
  onClick={() => {

src/components/Hero.tsx

@@ -34,10 +34,6 @@ const Hero = () => {
  10th June 2024, Monday
  </h3>
  <div className='h-4'></div>
- {/* TODO: Add after entire schedule is confirmed
- <h4 className='text-slate-400 font-bold text-base md:text-xl lg:text-2xl'>
- 7:30 PM IST to 12:30 AM IST
- </h4> */}
  </div>
  </div>
  );

src/components/Organisers.tsx

@@ -10,7 +10,7 @@ const Organisers = () => {
  },
  {
  id: 2,
- name: "Watch Party Ahemdadbad",
+ name: "Swift Ahemdadbad",
  },
  {
  id: 3,
@@ -35,9 +35,9 @@ const Organisers = () => {
  organised by
  </h5>
  <div className='h-4'></div>
- <div className='overflow-x-auto flex items-center md:mx-auto no-scrollbar'>
+ <div className='md:overflow-x-auto flex flex-col md:flex-row items-center md:mx-auto md:no-scrollbar'>
  {listOfOrganisers.map((organiser) => (
- <div key={organiser.id} className='flex items-center mx-2 min-w-fit'>
+ <div key={organiser.id} className='flex items-center m-2 min-w-fit'>
  {organiser.icon && (
  <img
  src={organiser.icon}