website: include adopter logos on homepage

assets/scss/_styles_project.scss

@@ -543,11 +543,19 @@ nav.foldable-nav {
     }
   }
 
+  .adopter-logo {
+    pointer-events: none;
+    user-select: none;
+    height: 3rem;
+    width: 100%;
+  }
+
   .section-head {
     color: $home-section-title-color;
 
     font-size: 1.8rem;
     font-weight: bold;
+    line-height: 1.8;
 
     margin-bottom: 2rem;
     padding-bottom: 1rem;
@@ -583,7 +591,7 @@ nav.foldable-nav {
     margin: 0 0 1.5em 1.5em;
   }
 
-  #overview, #pageContent, #cncf, #community {
+  #overview, #pageContent, #cncf, #community, #adopters {
     padding: 4rem 0 4rem 0 !important;
   }
 
@@ -595,6 +603,10 @@ nav.foldable-nav {
     border-bottom: 0.1rem solid $home-section-border-color;
   }
 
+  #adopters {
+    border-bottom: 0.1rem solid $home-section-border-color;
+  }
+
   #pageContent .container {
     max-width: 70rem;
   }

content/en/_index.html

@@ -40,6 +40,52 @@ <h3 class="section-head">
   </div>
 </div>
 
+<div id="adopters" class="text-center">
+  <div class="container">
+    <h3 class="section-head">
+      <span class="border-bottom pb-2">Featured Adopters of Kubeflow</span>
+    </h3>
+    <div class="mb-5 d-flex flex-wrap align-content-between align-items-center justify-content-center user-select-none">
+      <!-- ====================================================================================== -->
+      <!-- WARNING: logos MUST be approved by the KSC BEFORE being featured on the homepage       -->
+      <!-- WARNING: organizations MUST be listed in at least one adopter file                     -->
+      <!--          https://github.com/kubeflow/community/blob/master/ADOPTERS.md                 -->
+      <!-- WARNING: we only consider logos of CNCF Member organizations for trademark reasons     -->
+      <!--          https://landscape.cncf.io/?group=members&view-mode=card                       -->
+      <!-- ====================================================================================== -->
+
+      <!-- NVIDIA (Organization Contact: TBA) -->
+      <div class="px-5 py-4">
+        <img class="adopter-logo show_light-only" src="/docs/images/logos/nvidia-light.svg" alt="NVIDIA Logo">
+        <img class="adopter-logo show_dark-only" src="/docs/images/logos/nvidia-dark.svg" alt="NVIDIA Logo">
+      </div>
+
+      <!-- RedHat (Organization Contact: TBA) -->
+      <div class="px-5 py-4">
+        <img class="adopter-logo show_light-only" src="/docs/images/logos/redhat-light.svg" alt="RedHat Logo">
+        <img class="adopter-logo show_dark-only" src="/docs/images/logos/redhat-dark.svg" alt="RedHat Logo">
+      </div>
+
+      <!-- Google Cloud (Organization Contact: TBA) -->
+      <div class="px-5 py-4">
+        <img class="adopter-logo show_light-only" src="/docs/images/logos/google-cloud-light.svg" alt="Google Cloud Logo">
+        <img class="adopter-logo show_dark-only" src="/docs/images/logos/google-cloud-dark.svg" alt="Google Cloud Logo">
+      </div>
+
+      <!-- AWS (Organization Contact: @vara-bonthu) -->
+      <div class="px-5 py-4">
+        <img class="adopter-logo show_light-only" src="/docs/images/logos/aws-light.svg" alt="AWS Logo">
+        <img class="adopter-logo show_dark-only" src="/docs/images/logos/aws-dark.svg" alt="AWS Logo">
+      </div>
+    </div>
+    <div>
+      <a class="btn btn-lg btn-outline-primary" href="https://github.com/kubeflow/community/blob/master/ADOPTERS.md" target="_blank" rel="noopener">
+        see more adopters on <i class="fab fa-github ml-1"></i>
+      </a>
+    </div>
+  </div>
+</div>
+
 <section id="pageContent">
   <div class="container">
     <h3 class="section-head text-center">