Merge branch 'main' into rohitroy-dev

hack4bengal · Jun 11, 2024 · fc3d0e8 · fc3d0e8
2 parents eab9079 + e0f9545
commit fc3d0e8
Show file tree

Hide file tree

Showing 10 changed files with 86 additions and 700 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -15,7 +15,7 @@
     "@vercel/analytics": "^1.2.2",
     "@vercel/speed-insights": "^1.0.10",
     "clsx": "^2.1.0",
-    "node-modules": "^1.0.1",
+    "node-modules": "^0.0.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-fast-marquee": "^1.6.2",

diff --git a/src/components/private/about/About.jsx b/src/components/private/about/About.jsx
@@ -83,7 +83,7 @@ const About = () => {
 
             <div className="about__metrics">
               <div className="about__metrics_item">
-                <p>2000+</p>
+                <p>5000+</p>
                 <span>Hackers</span>
               </div>
               <div className="about__metrics_item">
@@ -92,7 +92,7 @@ const About = () => {
               </div>
 
               <div className="about__metrics_item">
-                <p>36+</p>
+                <p>70+</p>
                 <span>Hack hours</span>
               </div>
 
@@ -106,7 +106,7 @@ const About = () => {
                 <span>Projects</span>
               </div>
               <div className="about__metrics_item">
-                <p>40+</p>
+                <p>50+</p>
                 <span>Mentors</span>
               </div>
             </div>

diff --git a/src/components/private/faq/FAQ.scss b/src/components/private/faq/FAQ.scss
@@ -126,6 +126,8 @@
                 width: 1em;
                 height: 1em;
                 fill: #ff1717;
+                margin-left: 0.01em;
+                margin-top: 0.01em;
               }
 
               @media screen and (max-width: 576px) {

diff --git a/src/components/private/sponsors/Sponsors.jsx b/src/components/private/sponsors/Sponsors.jsx
@@ -29,9 +29,8 @@ const Sponsors = () => {
             })}
           </div>
         </div>
-
         <div className="sponsors__container_flex">
-          <div className="sponsors__container domain_container">
+          <div className="sponsors__container domain_container silv">
             <h1>Silver Sponsor</h1>
             <div className="sponsors__flexbox">
               {sponsors["Silver"].map((item, index) => {
@@ -41,7 +40,7 @@ const Sponsors = () => {
               })}
             </div>
           </div>
-          <div className="sponsors__container">
+          <div className="sponsors__container silv">
             <h1>Education Partner</h1>
             <div className="sponsors__flexbox">
               {sponsors["Education"].map((item, index) => {

diff --git a/src/components/private/sponsors/Sponsors.scss b/src/components/private/sponsors/Sponsors.scss
@@ -17,7 +17,7 @@
   .sponsors__container_flex {
     display: flex;
     flex-wrap: wrap;
-    justify-content: space-between;
+    justify-content: center;
     align-items: center;
     gap: 4rem;
     max-width: 1400px;
@@ -32,6 +32,14 @@
     display: flex;
     flex-direction: column;
 
+    &.silv {
+      width: 20rem;
+
+      @media screen and (max-width: 576px) {
+        max-width: 15rem;
+      }
+    }
+
     h1 {
       font-size: 2rem;
       margin-bottom: 2.5rem;

diff --git a/src/components/private/themes/Theme.jsx b/src/components/private/themes/Theme.jsx
@@ -11,29 +11,7 @@ const Theme = () => {
         <Header {...HeaderData.theme} />
 
         <div className="themes_container">
-          {themedata?.slice(0, 6)?.map((item, index) => {
-            return (
-              <div className="box-item" key={index}>
-                <div className="flip-box" onClick={() => {}}>
-                  <div
-                    className="flip-box-front text-center"
-                    style={{ backgroundImage: `url(${item.img})` }}
-                  ></div>
-                  <div
-                    className="flip-box-back text-center"
-                    style={{ backgroundImage: `url(${item.img})` }}
-                  >
-                    <div className="inner color-white flipbox_desc">
-                      <p>{item.desc}</p>
-                    </div>
-                  </div>
-                </div>
-              </div>
-            );
-          })}
-        </div>
-        <div className=" themes_container2">
-          {themedata?.slice(6)?.map((item, index) => {
+          {themedata?.map((item, index) => {
             return (
               <div className="box-item" key={index}>
                 <div className="flip-box" onClick={() => {}}>

diff --git a/src/components/private/themes/Theme.scss b/src/components/private/themes/Theme.scss
@@ -5,15 +5,21 @@
   position: relative;
   overflow: hidden;
 
+  @media screen and (max-width: 720px) {
+    padding-inline: 1.5rem;
+  }
+
   @media screen and (max-width: 576px) {
-    padding: 2rem 1.5rem;
+    padding-block: 2rem;
+    padding-inline: 0;
     margin-top: 2rem;
   }
 
   .themes_container {
-    display: grid;
-    grid-template-columns: repeat(3, 1fr);
-    width: 1200px;
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: center;
+    max-width: 1200px;
     margin: 0 auto;
     margin-top: 6rem;
     gap: 40px;
@@ -28,10 +34,8 @@
     }
 
     @media screen and (max-width: 576px) {
-      display: flex;
-      flex-direction: column;
       margin: 0;
-      width: auto;
+      width: 100%;
       padding: 10px;
       gap: 40px;
       max-width: 100vw;
@@ -102,6 +106,7 @@
   .box-item {
     position: relative;
     -webkit-backface-visibility: hidden;
+    backface-visibility: hidden;
     width: 360px;
     height: 420px;
     margin-bottom: 3px;
@@ -111,6 +116,7 @@
     @media screen and (max-width: 500px) {
       width: 90vw;
     }
+
     /* 8 */
   }
 
@@ -206,7 +212,7 @@
     border-radius: 20px;
   }
 
-  .inner > h3 {
+  .inner>h3 {
     font-family: "Poppins";
     font-style: normal;
     font-weight: 600;
@@ -348,4 +354,4 @@
 //     align-items: center;
 //     justify-content: center;
 //   }
-// }
+// }
diff --git a/src/components/private/timer/Timer.scss b/src/components/private/timer/Timer.scss
@@ -13,7 +13,7 @@
     display: flex;
     align-items: center;
 
-    @media screen and (max-width: 850px) {
+    @media screen and (max-width: 900px) {
       justify-content: center;
     }
 
@@ -24,12 +24,17 @@
       align-items: center;
       gap: 4rem;
       margin-top: -4rem;
+      position: relative;
+
+      @media screen and (max-width: 1400px) {
+        margin-right: 0rem;
+      }
 
       @media screen and (max-width: 1120px) {
         margin-top: 0rem;
       }
 
-      @media screen and (max-width: 850px) {
+      @media screen and (max-width: 900px) {
         margin-top: 5rem;
       }
 
@@ -51,6 +56,7 @@
         background: #ffffff;
         background: linear-gradient(to right, #ffffff 0%, #ff0000 100%);
         -webkit-background-clip: text;
+        background-clip: text;
         -webkit-text-fill-color: transparent;
 
         @media screen and (max-width: 1120px) {
@@ -80,13 +86,21 @@
           width: 90%;
           row-gap: 20px;
           justify-content: center;
+
           .colon {
             justify-content: center;
             display: flex;
           }
         }
 
         .time {
+          $size: 115px;
+          width: $size;
+          height: $size;
+          display: flex;
+          flex-direction: column;
+          justify-content: center;
+          align-items: center;
           font-family: "Montserrat", sans-serif;
           font-size: 60px;
           text-align: center;
@@ -96,11 +110,12 @@
           background-color: #2a2727;
           padding: 1rem;
           border-radius: 18px;
-          width: 115px;
-          height: 115px;
 
           @media screen and (max-width: 1120px) {
             font-size: 30px;
+            $size: 100px;
+            width: $size;
+            height: $size;
           }
 
           @media screen and (max-width: 576px) {
@@ -109,6 +124,9 @@
             justify-content: center;
             flex-direction: column;
             padding: 0.5rem;
+            $size: 90px;
+            width: $size;
+            height: $size;
           }
 
           p:nth-child(2) {
@@ -160,11 +178,11 @@
   .ghori {
     width: 55%;
 
-    @media screen and (max-width: 1200px) {
+    @media screen and (max-width: 1400px) {
       width: 45%;
     }
 
-    @media screen and (max-width: 850px) {
+    @media screen and (max-width: 900px) {
       display: none;
     }
   }

diff --git a/src/components/shared/footer/Footer.scss b/src/components/shared/footer/Footer.scss
@@ -149,6 +149,7 @@
     transition: all 2s ease-in-out;
     left: 46%;
     transform: translateX(-50%);
+    z-index: 2;
 
     @media screen and (max-width: 850px) {
       display: none;
@@ -184,10 +185,6 @@
       transition: opacity 1.5s ease-in-out;
       opacity: 0;
 
-      &:hover {
-        opacity: 1;
-      }
-
       a {
         color: var(--h4bred);
         text-decoration: none;
@@ -212,9 +209,10 @@
       }
 
       .season_linkdiv {
+        opacity: 1;
+
         a {
           transition: all 1.5s ease-in-out;
-          opacity: 1;
           z-index: 99;
         }
       }
@@ -305,4 +303,4 @@
       display: none;
     }
   }
-}
+}