Recreated About Page and Ambassador page

[sanyamjain04]

I have made changes to the About pages. I have tried to keep the design as same as Figma design

I have created two new components newsletter and Teams and added them to the about page. I have also improved some code and CSS of other components in about page. I have added social media handles to the founder component.

Before	After

I have created a data.js file now we don't have to create a new team member card for every team member. we just have to add data to the teamData.js and it will create a new card just like the above image

   const teamData = [
    {
        name: 'Saiyam Pathak',
        coverPhoto: 'https://avatars.githubusercontent.com/u/8190114?v=4',
        role: 'Founder',
        twitterLink: 'https://twitter.com/saiyampathak',
        linkedinLink: 'https://www.linkedin.com/in/saiyampathak/',
        githubLink: 'https://github.com/saiyam1814'
    },
    {
        name: 'Saiyam',
        coverPhoto: 'https://avatars.githubusercontent.com/u/8190114?v=4',
        role: 'Founder',
        twitterLink: 'https://twitter.com/saiyampathak',
        linkedinLink: 'https://twitter.com/saiyampathak',
        githubLink: 'https://twitter.com/saiyampathak'
    },
]

Hello @AvineshTripathi , Can you please review the PR ?

[AvineshTripathi]

@saiyam1814 do we want profile to be added to website like above shown image ?

[saiyam1814]

Slider would bebetter, as this will keep taking more space as people gets added or you can create a separate page, Kubesimplify ambassadors that have this format and even if it keep getting added its fine

[AvineshTripathi]

+1 for the slider thing(I liked the profile card template for slider maybe you can use react slick up to you), now do we want this to be in about page or the ambassador page

[sanyamjain04]

hello @AvineshTripathi, I have created a slider in team component. i have not used any library. On screen width more than 1000px it will slide 2 cards and on screen width less than 1000px it will slide 1 card. can you please review the changes ?

[saiyam1814]

So actually they are the Ambassadors , instead of team just put Kubesimplify ambassadors, also on the Kubesimplify ambassadors have all of the cards as a scroll bard , @AvineshTripathi can you provide him with picture, socials etc

[AvineshTripathi]

also on the Kubesimplify ambassadors have all of the cards as a scroll bard

same images both the places about as well as ambassador page, is that what you mean @saiyam1814

[saiyam1814]

YEs on the about page there can be the slider but if people want to see all on a single page then that can be on the Ambassadors page just like CNCF MAbassadors page

[sanyamjain04]

I have updated the ambassador page as this Figma design

Before	After

Hello @AvineshTripathi can you please review this PR? Now we just have to add data and it will work fine

If the coverprofile url is wrong it will show the default Image as shown in above image

[AvineshTripathi]

remove the newslettercomponent from the about page Reason: it is already there on the home page

[sanyamjain04]

remove the newslettercomponent from the about page Reason: it is already there on the home page

@AvineshTripathi i have removed the newletter component

[sanyamjain04]

Hello @AvineshTripathi is there anything left in this PR?

[AvineshTripathi]

there is a conflict in branches have a look

[sanyamjain04]

there is a conflict in branches have a look

hello @AvineshTripathi ,Can we undo this PR? This will solve the merge conflict. I have breifly explain the reason why "undoing this PR is better solution" on discord DM

[AvineshTripathi]

@sanyamjain04 please add those points from discord to here also for documentation

[sanyamjain04]

@sanyamjain04 please add those points from discord to here also for documentation

The reason why there is a merge conflict because of these two files |---| ||

the code of two files also have changed in ⬇️ PR #182 |-----| ||

still the PR (182) does not solve all the bugs	Screenshots	of	Bugs
Height of icons are incorrect	text is overlapping 👇🏻 (mobile - 320px)	icon and text is not responsive to its background div (tab - 768px)	apllication component is not aligned properly (tab 768px)

there are some other bugs too. Now There are two ways we can Solve the Merge Conflict Solution 1 ( faster and efficient ): We can undo PR 182 Solution 2 (slower and time taking) : I have to fix these bugs in this PR ( #182 ) and refactor style file code again

I am saying solution 1 is better bcz I have recreated the ambassador page in this PR so there is no need to solve the bugs if we undo the 182 PR .

[sanyamjain04]

@AvineshTripathi Is there anything left in this PR ?