Merge pull request #12 from sudarshanmaan/adjusting_fontsize

MananJethwani · web-flow · commit 37a4898093bb · 2021-01-22T01:38:35.000+05:30
Adjusting fontsize, key animations, ignoring eslintcache
diff --git a/.gitignore b/.gitignore
@@ -159,3 +159,4 @@ GitHub.sublime-settings
 
 # React #
 frontend/node_modules
+frontend/.eslintcache
diff --git a/frontend/.eslintcache b/frontend/.eslintcache
diff --git a/frontend/public/bitbyte-2.png b/frontend/public/bitbyte-2.png
diff --git a/frontend/public/bitbyte.png b/frontend/public/bitbyte.png
diff --git a/frontend/public/index.html b/frontend/public/index.html
@@ -2,7 +2,7 @@
 <html lang="en">
   <head>
     <meta charset="utf-8" />
-    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
+    <link rel="icon" href="./bitbyte.png" />
     <link rel="preconnect" href="https://fonts.gstatic.com">
     <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;900&display=swap" rel="stylesheet">
     <meta name="viewport" content="width=device-width, initial-scale=1" />
@@ -26,7 +26,7 @@
       work correctly both with client-side routing and a non-root public URL.
       Learn how to configure a non-root public URL by running `npm run build`.
     -->
-    <title>React App</title>
+    <title>The Programming Club IIITDMJ</title>
   </head>
   <body>
     <noscript>You need to enable JavaScript to run this app.</noscript>
diff --git a/frontend/src/components/homeNav/style.module.css b/frontend/src/components/homeNav/style.module.css
@@ -39,5 +39,6 @@
   }
   .vector {
     width: 80%;
+    z-index: 2;
   }
 }
diff --git a/frontend/src/components/homePage/index.jsx b/frontend/src/components/homePage/index.jsx
@@ -8,7 +8,7 @@ function HomePage() {
     <div className={styles.home}>
       <div className={styles.container}>
           <span className={styles.heading}>The Programming Club IIITDMJ</span>
-          <img src="./ComponentTMP_0-image.png" alt="The Programming Club"/>
+          <img className={styles.computer} src="./ComponentTMP_0-image.png" alt="The Programming Club"/>
           <span className={styles.text}>An Open Coding Community to explore and do a lot more with your friends and members.</span>
           <button className={styles.primaryBtn}>Explore Now</button>
           <SvgBackground />
diff --git a/frontend/src/components/homePage/style.module.css b/frontend/src/components/homePage/style.module.css
@@ -19,6 +19,7 @@
   letter-spacing: 0px;
   color: var(--heading-color);
   z-index: 3;
+  animation: headingAnimation 1s forwards 0s ease-out;
 }
 .text {
   color: white;
@@ -36,6 +37,38 @@
   height: 5vh;
   cursor: pointer;
   font-size: 1.1rem;
+  z-index: 5;
+}
+
+.primaryBtn:focus {
+  border: none;
+  outline: none;
+}
+
+.computer{
+  animation: computerAnimation 1s forwards 0s ease-out;
+}
+
+@keyframes computerAnimation{
+  0%{
+      transform: rotate(0) scale(0.75) translateY(-20%);
+      opacity: 0;
+      }
+  100%{
+      transform: rotate(0) scale(1) translateY(0);
+      opacity: 1;
+      }
+}
+
+@keyframes headingAnimation{
+  0%{
+      transform: rotate(0) translateY(-35%);
+      opacity: 0;
+      }
+  100%{
+      transform: rotate(0) translateY(0);
+      opacity: 1;
+      }
 }
 
 @media only screen and (max-width: 1080px) {
@@ -59,6 +92,6 @@
     width: 70%;
   }
   .text {
-    font-size: 1rem;
+    font-size: 0.8rem;
   }
 }
diff --git a/frontend/src/components/nav/style.module.css b/frontend/src/components/nav/style.module.css
@@ -25,7 +25,7 @@
     background: #14335f;
     height: 100vh;
     width: 100vw;
-    z-index: 4;
+    z-index: 6;
     color: white;
     list-style: none;
     display: flex;
diff --git a/frontend/src/components/navLinks/index.jsx b/frontend/src/components/navLinks/index.jsx
@@ -5,22 +5,22 @@ import { Link } from 'react-router-dom';
 function NavLinks() {
   return (
     <>
-      <Link to=''>
+      <Link to='' className={styles.Link}>
         <li className={styles.first}>Club Registrations</li>
       </Link>
-      <Link to=''>
+      <Link to='' className={styles.Link}>
         <li className={styles.sec}>Leaderboard</li>
       </Link>
-      <Link to=''>
+      <Link to='' className={styles.Link}>
         <li className={styles.third}>Events</li>
       </Link>
-      <Link to=''>
+      <Link to='' className={styles.Link}>
         <li className={styles.fourth}>Sessions</li>
       </Link>
-      <Link to=''>
+      <Link to='' className={styles.Link}>
         <li className={styles.fifth}>Domains</li>
       </Link>
-      <Link to=''>
+      <Link to='' className={styles.Link}>
         <li className={styles.sixth}>Projects</li>
       </Link>
     </>
diff --git a/frontend/src/components/navLinks/style.module.css b/frontend/src/components/navLinks/style.module.css
@@ -5,6 +5,10 @@ li {
   margin: 2vh 0 0 0;
 }
 
+.Link {
+  text-decoration: none;
+}
+
 .first {
   transform: translatex(-11vh);
 }
diff --git a/frontend/src/components/shortcuts/index.jsx b/frontend/src/components/shortcuts/index.jsx
@@ -6,11 +6,11 @@ function Shortcuts() {
   return (
     <div className={styles.container}>
         <div className={styles.logos}>
-          <a href="https://www.github.com"><img className={styles.logo}  src="./ComponentTMP_0-image2.png" alt="github"/></a>
-          <a href="https://www.facebook.com"><img className={styles.logo} src="./ComponentTMP_0-image3.png" alt="facebook"/></a>
-          <a href="https://www.instagram.com"><img className={styles.logo} src="./ComponentTMP_0-image4.png" alt="instagram"/></a>
-          <a href="https://www.geeksforgeeks.org"><img className={styles.logo} src="./ComponentTMP_0-image5.png" alt="gfg"/></a>
-          <a href="https://www.codeforces.com"><img className={styles.logo} src="./ComponentTMP_0-image6.png" alt="codeforces"/></a>
+          <a href="https://github.com/BitByte-TPC" target="_blank" rel='noreferrer'><img className={styles.logo}  src="./ComponentTMP_0-image2.png" alt="github"/></a>
+          <a href="https://www.facebook.com/geeks.IIITJ/" target="_blank" rel='noreferrer'><img className={styles.logo} src="./ComponentTMP_0-image3.png" alt="facebook"/></a>
+          <a href="https://www.instagram.com" target="_blank" rel='noreferrer'><img className={styles.logo} src="./ComponentTMP_0-image4.png" alt="instagram"/></a>
+          <a href="https://www.geeksforgeeks.org" target="_blank" rel='noreferrer'><img className={styles.logo} src="./ComponentTMP_0-image5.png" alt="gfg"/></a>
+          <a href="https://www.codeforces.com" target="_blank" rel='noreferrer'><img className={styles.logo} src="./ComponentTMP_0-image6.png" alt="codeforces"/></a>
         </div>
     </div>
   );
diff --git a/frontend/src/components/shortcuts/style.module.css b/frontend/src/components/shortcuts/style.module.css
@@ -18,8 +18,8 @@
 }
 
 .logo {
-  width: 50px;
-  margin-top: 1vh;
+  width: 45px;
+  margin-top: 1.5vh;
   cursor: pointer;
   transition: all 0.2s ease-in-out;
 }

Original file line number	Diff line number	Diff line change
`@@ -159,3 +159,4 @@ GitHub.sublime-settings`
`159`	`159`
`160`	`160`	`# React #`
`161`	`161`	`frontend/node_modules`
	`162`	`+frontend/.eslintcache`
Original file line number	Diff line number	Diff line change
`@@ -39,5 +39,6 @@`
`39`	`39`	`}`
`40`	`40`	`.vector {`
`41`	`41`	`width: 80%;`
	`42`	`+ z-index: 2;`
`42`	`43`	`}`
`43`	`44`	`}`