fix responsive issues

dscbitshyd · Aug 13, 2021 · 41fc11d · 41fc11d · vercel · Aug 13, 2021
1 parent 08c7755
commit 41fc11d
Show file tree

Hide file tree

Showing 12 changed files with 138 additions and 36 deletions.
diff --git a/components/hero/Hero.jsx b/components/hero/Hero.jsx
@@ -8,6 +8,7 @@ import {
   RiYoutubeLine,
   RiMailLine,
 } from 'react-icons/ri';
+import NavItem from '../header/NavItem';
 import DiscordJoinCommunity from '../header/DiscordJoinCommunity';
 
 import GoogleRectangle from './GoogleRectangle';
@@ -74,15 +75,38 @@ function Hero() {
               }}
               className="flex space-x-5"
             >
-              <SocialIcon href="www.instagram.com" icon={<RiFacebookCircleLine size={50} />} />
-              <SocialIcon href="www.instagram.com" icon={<RiInstagramLine size={50} />} />
-              <SocialIcon href="www.instagram.com" icon={<RiLinkedinBoxLine size={50} />} />
-              <SocialIcon href="www.instagram.com" icon={<RiMediumLine size={50} />} />
-              <SocialIcon href="www.instagram.com" icon={<RiYoutubeLine size={50} />} />
-              <SocialIcon href="www.instagram.com" icon={<RiMailLine size={50} />} />
+              <SocialIcon
+                href="https://www.facebook.com/DSC-BITS-Pilani-Hyderabad-Campus-100721895642962"
+                icon={<RiFacebookCircleLine size={50} />}
+              />
+              <SocialIcon
+                href="https://www.instagram.com/gdscbitshyderabad/"
+                icon={<RiInstagramLine size={50} />}
+              />
+              <SocialIcon
+                href="https://www.linkedin.com/company/75016791/"
+                icon={<RiLinkedinBoxLine size={50} />}
+              />
+              <SocialIcon href="https://medium.com/@dscbitshyd" icon={<RiMediumLine size={50} />} />
+              <SocialIcon
+                href="https://www.youtube.com/channel/UCJq1Z26Ed4ZS-RZ5GSs5pKA"
+                icon={<RiYoutubeLine size={50} />}
+              />
+              <SocialIcon href="mailto:[email protected]" icon={<RiMailLine size={50} />} />
             </motion.div>
           </div>
-          <div className="block lg:hidden md:hidden">
+          <div className="flex gap-5 lg:hidden md:hidden mt-5">
+            <div className="border rounded-md p-2">
+              <NavItem text="Events" href="/events" />
+            </div>
+            <div className="border rounded-md p-2">
+              <NavItem text="Team" href="/team" />
+            </div>
+            <div className="border rounded-md p-2">
+              <NavItem text="Projects" href="https://github.com/dscbitshyd" />
+            </div>
+          </div>
+          <div className="block lg:hidden md:hidden mt-5">
             <DiscordJoinCommunity />
           </div>
         </div>
@@ -106,7 +130,7 @@ function Hero() {
           className="flex justify-center flex-1 mb-10 md:mb-16 lg:mb-0 z-10 transition duration-500 hover:scale-105"
         >
           <Image
-            className="w-5/6 h-5/6 sm:w-3/4 sm:h-3/4 md:w-full md:h-full rounded-lg shadow-2xl "
+            className="w-5/6 h-5/6 sm:w-3/4 sm:h-3/4 md:w-full md:h-full rounded-lg shadow-2xl sm:px-5"
             src="/dome-01.jpeg"
             width={1022}
             height={681}

diff --git a/components/team/BusinessDivision.jsx b/components/team/BusinessDivision.jsx
@@ -10,14 +10,14 @@ function BusinessDivision() {
           name="Mani Venkat"
           position="Business Lead"
           github="www.github.com/saiankit"
-          linkedin="www.linkedin.com"
+          linkedin="https://www.linkedin.com/in/mani-venkat-149965192/"
         />
         <TeamItem
-          url="/Shreya DSC.jpg"
+          url="/Vibha DSC.jpeg"
           name="Vibha Narendra"
           position="Business Lead"
           github="www.github.com/saiankit"
-          linkedin="www.linkedin.com"
+          linkedin="https://www.linkedin.com/in/vibha-n-4a14201a9/"
         />
       </div>
     </div>

diff --git a/components/team/CreativeDivision.jsx b/components/team/CreativeDivision.jsx
@@ -7,24 +7,24 @@ function CreativeDivision() {
       <div className="grid-cols-1 md:flex gap-16 justify-center items-center">
         <TeamItem
           url="/Geetha Charan DSC.jpeg"
-          name="Geetha Charan Nallana"
+          name="Geetha Charan"
           position="UI/UX Lead"
           github="www.github.com/saiankit"
-          linkedin="www.linkedin.com"
+          linkedin="https://www.linkedin.com/in/geethacharan-nallana-06691518b/"
         />
         <TeamItem
           url="/Sambhav DSC.jpeg"
           name="Sambhav Jain"
           position="Design Lead"
           github="www.github.com/saiankit"
-          linkedin="www.linkedin.com"
+          linkedin="https://www.linkedin.com/in/sambhav-jain-4864001aa/"
         />
         <TeamItem
           url="/Pratyush DSC.jpeg"
           name="Pratyush Choudhary"
-          position="Media Lead"
+          position="Video Production Lead"
           github="www.github.com/saiankit"
-          linkedin="www.linkedin.com"
+          linkedin="https://www.linkedin.com/in/pratyush-choudhary-a20978192/"
         />
       </div>
     </div>

diff --git a/components/team/DevelopmentDivision.jsx b/components/team/DevelopmentDivision.jsx
@@ -10,16 +10,16 @@ function DevelopmentDivision() {
           url="/Shreya DSC.jpg"
           name="Shreya Banerjee"
           position="Dev Lead"
-          github="www.github.com/saiankit"
-          linkedin="www.linkedin.com"
+          github="https://github.com/Shreya1805-web"
+          linkedin="https://www.linkedin.com/in/shreya-banerjee1805/"
         />
         <TeamItem
           dev
           url="/Vaishnavi DSC.jpg"
           name="Vaishnavi Shrivastava"
           position="Dev Lead"
-          github="www.github.com/saiankit"
-          linkedin="www.linkedin.com"
+          github="https://github.com/VaishnaviShri"
+          linkedin="https://www.linkedin.com/in/vaishnavi-shrivastava-664747206/"
         />
       </div>
     </div>

diff --git a/components/team/Team.jsx b/components/team/Team.jsx
@@ -12,8 +12,8 @@ function Team() {
           url="/Sai Ankit DSC.png"
           name="Sai Ankit"
           position="Lead"
-          github="www.github.com/saiankit"
-          linkedin="www.linkedin.com"
+          github="https://github.com/saiankit"
+          linkedin="https://www.linkedin.com/in/sai-ankit/"
         />
       </div>
       <DevelopmentDivision />

diff --git a/components/team/TeamItem.jsx b/components/team/TeamItem.jsx
@@ -1,30 +1,36 @@
 import Image from 'next/image';
 import { FiGithub, FiLinkedin } from 'react-icons/fi';
 
-function TeamItem({ dev, url, name, position }) {
+function TeamItem({ dev, url, name, position, github, linkedin }) {
   let githubIcon;
   if (dev) {
     githubIcon = (
       <div className="flex gap-5">
         <div className="border rounded-full p-2">
-          <FiGithub size={25} className="hover:rotate-12 transition duration-200" />
-        </div>
-        <div className="border rounded-full p-2">
-          <FiLinkedin size={25} className="hover:-rotate-12 transition duration-200" />
+          <a href={github}>
+            <FiGithub size={25} className="hover:rotate-12 transition duration-200" />
+          </a>
         </div>
+        <a href={linkedin}>
+          <div className="border rounded-full p-2">
+            <FiLinkedin size={25} className="hover:-rotate-12 transition duration-200" />
+          </div>
+        </a>
       </div>
     );
   } else {
     githubIcon = (
       <div className="flex gap-5">
-        <div className="border rounded-full p-2">
-          <FiLinkedin size={25} className="hover:rotate-12 transition duration-200" />
-        </div>
+        <a href={linkedin}>
+          <div className="border rounded-full p-2">
+            <FiLinkedin size={25} className="hover:rotate-12 transition duration-200" />
+          </div>
+        </a>
       </div>
     );
   }
   return (
-    <div className=" transition duration-500 hover:scale-105 dark:bg-gray-100 border-2  flex flex-col rounded-2xl shadow-xl lg:mb-16">
+    <div className="transition duration-500 hover:scale-105 dark:bg-gray-100 border-2 flex flex-col rounded-2xl shadow-xl lg:mb-16">
       <div className="p-6 flex flex-col items-center">
         <Image
           className="p-12 rounded-full mx-auto"

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -12,6 +12,7 @@
     "framer-motion": "^4.1.17",
     "next": "11.0.1",
     "next-themes": "^0.0.15",
+    "rc-drawer": "^4.4.0",
     "react": "17.0.2",
     "react-dom": "17.0.2",
     "react-icons": "^4.2.0"

diff --git a/pages/events.jsx b/pages/events.jsx
@@ -12,7 +12,7 @@ export default function Events() {
       exit={{ opacity: 0 }}
     >
       <Head>
-        <title>DSC Team</title>
+        <title>GDSC Events</title>
       </Head>
       <div className="container">
         <Header />
@@ -34,9 +34,9 @@ export default function Events() {
           }}
           className="text-center md:text-left max-w-4xl mx-auto md:mx-auto mt-12 md:mt-24 items-center"
         >
-          <div className="flex">
+          <div className="flex-col-reverse lg:flex">
             <h1 className="text-5xl font-bold tracking-wide mx-auto">
-              Stay Tuned! DSC is supercharged for providing many events throughout the year!
+              Stay Tuned! GDSC is supercharged for providing many events throughout the year!
             </h1>
             <img src="/events.svg" height={300} width={300} />
           </div>

diff --git a/pages/index.jsx b/pages/index.jsx
@@ -13,7 +13,7 @@ export default function Home() {
       exit={{ opacity: 0 }}
     >
       <Head>
-        <title>DSC BITS Hyd</title>
+        <title>GDSC BITS Hyd</title>
       </Head>
       <div className="container">
         <Header />

diff --git a/pages/team.jsx b/pages/team.jsx
@@ -12,7 +12,7 @@ function TeamPage() {
       exit={{ opacity: 0 }}
     >
       <Head>
-        <title>DSC Team</title>
+        <title>GDSC Team</title>
       </Head>
       <div className="container">
         <Header />

diff --git a/public/Vibha DSC.jpeg b/public/Vibha DSC.jpeg