added judges section

HackInTheNorth · Dec 18, 2020 · 375d690 · 375d690
1 parent 2b29469
commit 375d690
Show file tree

Hide file tree

Showing 14 changed files with 133 additions and 4 deletions.
diff --git a/css/style.css b/css/style.css
@@ -1520,6 +1520,55 @@ a, a:hover, a:after, a:visited, a:active{
     margin-top: -15px;
 }
 
+.judge-head h1{
+    font-size: 3.4rem;
+}
+
+.judges-cards-section{
+    width: 100%;
+    max-width: 1254px;
+    margin: 0 auto;
+}
+
+.judge-card{
+    text-align: center;
+    margin: 2rem auto;
+
+}
+
+.judge-card:hover img{
+    transform: scale(0.9);
+}
+
+.judge-card:hover .judge-position{
+    opacity: 1;
+    transform: translateY(0);
+}
+
+.judge-position{
+    position: relative;
+    color:rgba(220 , 220 , 220 , 1);
+    font-size: 1rem;
+    margin: 0;
+    opacity: 0;
+    transform: translateY(-50px);
+    z-index: 1;
+    transition: all .6s cubic-bezier(.34,1.56,.64,1);
+}
+
+.judge-card img{
+    position: relative;
+    z-index: 2;
+    height: 200px;
+    width: 200px;
+    border-radius: 50%;
+    transition: transform .6s cubic-bezier(.34,1.56,.64,1);
+}
+
+.judge-name{
+    font-size: 1.5rem;
+}
+
 
 .yellow
 {

diff --git a/images/judges/Dagar.JPG b/images/judges/Dagar.JPG
diff --git a/images/judges/Pawan.jpeg b/images/judges/Pawan.jpeg
diff --git a/images/judges/abhinav.jpeg b/images/judges/abhinav.jpeg
diff --git a/images/judges/anagh.jpg b/images/judges/anagh.jpg
diff --git a/images/judges/ashvin.jpg b/images/judges/ashvin.jpg
diff --git a/2019/images/team/ashwin.jpg → images/judges/ashwin.jpg b/2019/images/team/ashwin.jpg → images/judges/ashwin.jpg
diff --git a/images/judges/gautham.jpeg b/images/judges/gautham.jpeg
diff --git a/images/judges/rahulkala.jpeg b/images/judges/rahulkala.jpeg
diff --git a/images/judges/ritika.jpeg b/images/judges/ritika.jpeg
diff --git a/images/speaker/Gautham Santhosh.png b/images/speaker/Gautham Santhosh.png
diff --git a/images/speaker/rahulkala b/images/speaker/rahulkala
diff --git a/images/speaker/rahulkala.jpeg b/images/speaker/rahulkala.jpeg
diff --git a/index.html b/index.html
@@ -88,17 +88,17 @@
     font-style: normal;
 }
 
-#content div h1, #com-content div h1 , .faq-head h1 , h1.what, .theme-header, .theme-list-heading
+#content div h1, #com-content div h1 , .faq-head h1 , .judge-head h1, h1.what, .theme-header, .theme-list-heading
 {
   font-family: 'CeraPro-bold';
 }
 
-#content div p, #com-content div p
+#content div p, #com-content div p, .judge-position
 {
   font-family: 'CeraPro-regular';
 }
 
-.link p, .link a, .collapsible , .later p, .content, #lady p, a.nav-link 
+.link p, .link a, .collapsible , .later p, .content, #lady p, a.nav-link , .judge-name
 {
   font-family:'CeraPro-medium';
 }
@@ -546,6 +546,86 @@ <h3 class="theme-list-heading theme-type-5">
 
                 </div>
 
+                <div class="judge-section" id="judges">
+
+                  <div class="row mt-4">
+                    <div class="col-12 judge-head text-center">
+                      <h1>Our Judges</h1>
+                    </div>
+
+                    <div class="judges-cards-section mt-4">
+                      <div class="row mt-4">
+                        <div class="col-sm-12">
+                          <div class="judge-card">
+                            <div class="inner-part">
+                              <img src="./images/judges/rahulkala.jpeg" alt="speaker-img">
+                              <p class="judge-position">Assistant Professor, IIITA</p>
+                            </div>
+                            <p class="judge-name">Rahul Kala</p>
+                          </div>
+                        </div>
+                        <div class="col-lg-4 col-md-6 col-sm-12">
+                          <div class="judge-card">
+                            <div class="inner-part">
+                              <img src="./images/judges/abhinav.jpeg" alt="speaker-img">
+                              <p class="judge-position"> Researcher at MCU</p>
+                            </div>
+                            <p class="judge-name">Abhinav Khare</p>
+                          </div>
+                        </div>
+                        <div class="col-lg-4 col-md-6 col-sm-12">
+                          <div class="judge-card">
+                            <div class="inner-part">
+                              <img src="./images/judges/ritika.jpeg" alt="speaker-img">
+                              <p class="judge-position">Software Developer at Glints</p>
+                            </div>
+                            <p class="judge-name">Ritika Motwani</p>
+                          </div>
+                        </div>
+                        <div class="col-lg-4 col-md-6 col-sm-12">
+                          <div class="judge-card">
+                            <div class="inner-part">
+                              <img src="./images/judges/gautham.jpeg" alt="speaker-img">
+                              <p class="judge-position"> ML Engineer, Berlin</p>
+                            </div>
+                            <p class="judge-name">Gautham Santhosh</p>
+                          </div>
+                        </div>
+                        <div class="col-lg-4 col-md-6 col-sm-12">
+                          <div class="judge-card">
+                            <div class="inner-part">
+                              <img src="./images/judges/Dagar.JPG" alt="speaker-img">
+                              <p class="judge-position">Software Engineer, Deutsche Telecom</p>
+                            </div>
+                            <p class="judge-name">Anupam Dagar</p>
+                          </div>
+                        </div>
+                        <div class="col-lg-4 col-md-6 col-sm-12">
+                          <div class="judge-card">
+                            <div class="inner-part">
+                              <img src="./images/judges/ashvin.jpg" alt="speaker-img">
+                              <p class="judge-position">Software Engineer, Deutsche Telecom</p>
+                            </div>
+                            <p class="judge-name">Ashwin vb</p>
+                          </div>
+                        </div>
+                        <div class="col-lg-4 col-md-6 col-sm-12">
+                          <div class="judge-card">
+                            <div class="inner-part">
+                              <img src="./images/judges/anagh.jpg" alt="speaker-img">
+                              <p class="judge-position">Software Engineer, Qualcomm</p>
+                            </div>
+                            <p class="judge-name">Anagh G S</p>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+
+
+                  </div>
+
+                </div>
+
                 <div class="row speaker-section" >
                   <div class="container-fluid speaker-header-container">
                     <img src="./images/vector/OUR_SPEAKERS.png" class="speaker-header-image"> 
@@ -634,7 +714,7 @@ <h3 class="theme-list-heading theme-type-5">
                               </p>
                             </div>
                             <div class="row">
-                              <img src="./images/speaker/GautamSantosh.png" width="100%">
+                              <img src="./images/speaker/Gautham Santhosh.png" width="100%">
                             </div>
                           </div>
                           <div class="col-4">