Added some minor improvements

adithyaanilkumar · Nov 17, 2020 · a159de4 · a159de4
1 parent 63ff309
commit a159de4
Show file tree

Hide file tree

Showing 9 changed files with 80 additions and 20 deletions.
diff --git a/Website/ZeWIT-Landing Page/aboutUs.html b/Website/ZeWIT-Landing Page/aboutUs.html
@@ -18,12 +18,13 @@
   <!-- fonts  -->
   <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@500&family=Roboto:wght@400&display=swap" rel="stylesheet">
 
+  <link rel="icon" href="assets/media/zewit-favicon.png" type="image/png">
+
 </head>
 
 <body>
   <!-- navbar starts here  -->
   <nav class="navbar navbar-expand-lg navbar-light bg-light">
-
     <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav"
       aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
       <span class="navbar-toggler-icon"></span>
@@ -51,7 +52,7 @@
   </nav>
   <!-- navbar ends here  -->
 
-  <div id="main" class="scroll-container">
+  <div id="main" class="scroll-container content">
     <section>
       <h3>Why ZeW - IT ?</h3>
       <p>
@@ -89,9 +90,9 @@ <h3>Advantages of ZeW - IT</h3>
 
   </div>
 
-  <footer class="container-fluid">
+  <!-- <footer class="container-fluid">
     <p>FOOTER FOOTER FOOTER</p>
-  </footer>
+  </footer> -->
 
   <script src="assets/js/full-page-scroll.min.js"></script>
     <script type="text/javascript">

diff --git a/Website/ZeWIT-Landing Page/assets/css/aboutUs.css b/Website/ZeWIT-Landing Page/assets/css/aboutUs.css
@@ -15,10 +15,10 @@ h3{
 }
 @media only screen and (max-width: 767px){
     h3 {
-     font-size:25px;
+     font-size:20px;
     }
     p {
-        font-size: 19px;
+        font-size: 15px;
     }
 }
 /* navbar css starts here  */
@@ -27,7 +27,9 @@ h3{
 }
 
 .navbar{
-    position: static;
+    position: absolute;
+    width: 100%;
+    z-index: 1000;
 }
 
 .nav-item{
@@ -65,8 +67,17 @@ h3{
 /* navbar css ends here*/
 
 section{
-    margin: 30px auto;
-    padding: 0px 125px;
+    justify-content: center;
+    align-items: center;
+    height: 100%;
+    margin: 0px auto;
+    padding: 135px;
+}
+
+@media only screen and (max-width: 767px){
+    section{
+        padding: 120px 29px;
+    }
 }
 
 /* footer css starts here */

diff --git a/Website/ZeWIT-Landing Page/assets/css/style.css b/Website/ZeWIT-Landing Page/assets/css/style.css
@@ -4,6 +4,12 @@
 }
 
 /* navbar css starts here  */
+.navbar{
+    position: fixed;
+    width: 100%;
+    z-index: 1000;
+}
+
 .bg-light{
     background-color: #ffffff!important;
 }
@@ -43,6 +49,11 @@
 /* navbar css ends here*/
 
 /* hero content css starts here  */
+.hero-content{
+    height: 100vh;
+    padding-top: 100px;
+}
+
 #green-leaf-on-hero-content{
     height: 70vh;
     z-index: -10;
@@ -72,7 +83,7 @@
 
 /* our-mission css starts here */
 .our-mission{
-    height: 120vh;
+    height: 100%;
     background-size: cover;
     padding-top: 10vh;
     background: linear-gradient(90.16deg, #4E82AA 26.31%, #172941 99.87%);
@@ -111,15 +122,24 @@
 
 @media only screen and (max-width: 600px) {
     .card{
-        height: 2px;
-    }    
+        margin-top: 35px;
+        text-align: center;
+    }
+    .card-img-top{
+
+    }
+    .card-body{
+
+    } 
 }
 
 /* our-mission css ends here */
 
 /* locate-nearest-bin css starts here */
 .locate-nearest-bin{
-
+    display: flex;
+    justify-content: center;
+    align-items: center;
 }
 
 .bullet-point{
@@ -148,6 +168,9 @@
     background-color: #f2f2f2;
     width: 100%;
     text-align: center;
+    display: flex;
+    justify-content: center;
+    align-items: center;
 }
 
 .abra-kadabra p{
@@ -158,6 +181,18 @@
 #abraka-dabra-img{
     height: 50vh;
     border-radius: 0.75rem;
+    width: 100%;
+}
+
+@media only screen and (max-width: 767px) {
+    #abraka-dabra-img {
+      height: 25vh;
+      text-align: center;
+    }
+
+    .abra-kadabra .row{
+        flex-direction: column-reverse;
+    }
 }
 
 /* abra-kadabra css ends here  */
@@ -166,9 +201,22 @@
 .get-rewarded{
     margin: 0;
     text-align: center;
+    width: 100%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
 }
 #get-rewarded-img{
     height: 70vh;
+    width: 100%;
+}
+
+@media only screen and (max-width: 767px) {
+    #get-rewarded-img {
+      height: 25vh;
+      text-align: center;
+    }
+
 }
 /* get-rewarded css ends here  */
 
@@ -186,11 +234,11 @@
 
 /* land-1 css starts here  */
 .land-1{
-
+    width: 100%;
 }
 
 #land-img{
-    height: 150vh;
+    width: 100%;
 }
 /* land-1 css ends here  */
 

diff --git a/Website/ZeWIT-Landing Page/assets/media/abra_kadabra.jpeg b/Website/ZeWIT-Landing Page/assets/media/abra_kadabra.jpeg
diff --git a/...ssets/media/cartoon-illustration-cactus-is-happy-holding-up-golden-trophy_.jpeg b/...ssets/media/cartoon-illustration-cactus-is-happy-holding-up-golden-trophy_.jpeg
diff --git a/Website/ZeWIT-Landing Page/assets/media/get_rewarded.jpeg b/Website/ZeWIT-Landing Page/assets/media/get_rewarded.jpeg
diff --git a/Website/ZeWIT-Landing Page/assets/media/locate_nearest_bin.png b/Website/ZeWIT-Landing Page/assets/media/locate_nearest_bin.png
diff --git a/Website/ZeWIT-Landing Page/assets/media/zewit-favicon.png b/Website/ZeWIT-Landing Page/assets/media/zewit-favicon.png
diff --git a/index.html b/index.html
@@ -15,6 +15,8 @@
   <!-- fonts  -->
   <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@500&display=swap" rel="stylesheet">
 
+  <link rel="icon" href="Website/ZeWIT-Landing Page/assets/media/zewit-favicon.png" type="image/png"> 
+
 </head>
 
 <body>
@@ -72,8 +74,6 @@ <h1 class="display-1">ZeW-IT</h1>
 
   <!-- our mission -->
   <div class="container-fluid our-mission">
-    <br>
-    <img id="blue-leaf-in-our-mission" src="Website/ZeWIT-Landing Page/assets/media/blue_leaf.png" alt="">
     <br>
     <div class="row">
       <div class="our-mission-text">
@@ -86,23 +86,23 @@ <h2 class="display-2">OUR MISSION</h2>
       </div>
       <div class="col-md-11">
         <div class="row">
-          <div class="col-md-4">
+          <div class="col-md-4 col-sm-12">
             <div class="card card-1" style="width: 18rem;">
               <img src="./Website/ZeWIT-Landing Page/assets/media/jasmin-sessler-CIItgnBEOgw-unsplash.jpeg" class="card-img-top" alt="card-img">
               <div class="card-body">
                 <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
               </div>
             </div>
           </div>
-          <div class="col-md-4">
+          <div class="col-md-4 col-sm-12">
             <div class="card card-2" style="width: 18rem;">
               <img src="./Website/ZeWIT-Landing Page/assets/media/cartoon-illustration-cactus-is-happy-holding-up-golden-trophy_.jpeg" class="card-img-top" alt="card-img">
               <div class="card-body">
                 <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
               </div>
             </div>
           </div>
-          <div class="col-md-4">
+          <div class="col-md-4 col-sm-12">
             <div class="card card-3" style="width: 18rem;">
               <img src="./Website/ZeWIT-Landing Page/assets/media/alfonso-navarro-qph7tJfcDys-unsplash.jpeg" class="card-img-top" alt="card-img">
               <div class="card-body">