add discord button, fix logo overflowing for small screens

Author: pettiboy

index.html

@@ -142,7 +142,7 @@
         <div id="header-content" class="container" itemscope="itemscope" itemtype="http://schema.org/Event">
 
           <div class="wow animated fadeInDown" style="margin-top: 50px;">
-            <img class="" src="./static/logos/logo-full-blue.png" style="height: 8vh;" alt="">
+            <img class="home-screen-logo" src="./static/logos/logo-full-blue.png" style="height: 8vh;" alt="KJSCE CodeCell">
           </div>
 
 
@@ -169,9 +169,26 @@
             </span>
 
           </address>
-          <a class="wow animated fadeInUp blog-link btn-blog" target="_blank" data-wow-delay="1.5s"
-            href="https://blogs.kjscecodecell.com">Codecell
-            Blogs<img class="beta" src="./static/images/beta-white.png"></img></a>
+
+          <div style="margin-bottom: 25px;">
+            <!-- discord community ka button -->
+            <div style="margin-bottom: 25px;">
+              <a class="wow animated fadeInUp blog-link btn-blog" target="_blank" data-wow-delay="1.5s"
+                href="https://discord.com/invite/UBbSuw7swW">
+                Join Our Community
+                <img style="margin-left: 6px; margin-right: 5px;"  class="beta" src="./static/images/discord-logo-white.png"></img>
+              </a>
+            </div>
+            <!-- codecell blog ka button -->
+            <div>
+              <a class="wow animated fadeInUp blog-link btn-blog" target="_blank" data-wow-delay="1.5s"
+                href="https://blogs.kjscecodecell.com">
+                Codecell Blogs
+                <img class="beta" src="./static/images/beta-white.png"></img>
+              </a>
+            </div>
+          </div>
+
           <div class="hello wow animated fadeInUp" data-wow-delay="2.5s" style="font-size:25px;margin-top: 20px;">
             <p>The Codechef Campus Chapter of KJSCE</p>
           </div>

static/images/discord-logo-white.png

@@ -11797,6 +11797,17 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
 }
 
 @media only screen and (max-width: 670px) {
+  .section-header .blog-link {
+    font-size: 25px;
+    color: white;
+  }
+
+  .beta {
+    margin-bottom: 5px;
+    width: 30px;
+    height: 30px;
+  }
+
   .speaker-list {
     margin-left: auto;
     margin-right: auto;
@@ -11988,13 +11999,13 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
   }
 
   .section-header .blog-link {
-    font-size: 25px;
+    font-size: 20px;
     color: white;
     /* background-color: pink; */
   }
 
   .beta {
-    margin-bottom: 10px;
+    margin-bottom: 5px;
     width: 30px;
     height: 30px;
   }
@@ -12104,6 +12115,12 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
 .speaker p {
   font-size: 15px;
 }
+
+/* for smaller screen make sure the home screen logo does not overflow */
+@media only screen and (max-width: 377px) {
+  .home-screen-logo {
+    height: 6vh !important;
+  }
 }
 
 @media only screen and (max-width: 370px) {