Merge pull request #302 from brian-brazil/logos

Make logos smaller and responsive.

content/index.html

@@ -52,70 +52,60 @@ layout: jumbotron
       <div class="col-md-12">Trusted by:</div>
     </div>
   </div>
-  <div class="container text-center">
-    <div class="row logos">
-      <div class="col-md-4">
+  <div class="container">
+    <div class="row">
+      <div class="col-md-2 col-sm-4 col-xs-6 logos">
         <a href="http://argus-sec.com/"><img src="assets/company-logos/Argus.png"/></a>
       </div>
-      <div class="col-md-4">
+      <div class="col-md-2 col-sm-4 col-xs-6 logos">
         <a href="http://www.boxever.com/"><img src="assets/company-logos/Boxever.png"/></a>
       </div>
-      <div class="col-md-4">
+      <div class="col-md-2 col-sm-4 col-xs-6 logos">
         <a href="https://www.cesanta.com/"><img src="assets/company-logos/cesanta.png"/></a>
       </div>
-    </div>
-    <div class="row logos">
-      <div class="col-md-4">
+      <div class="col-md-2 col-sm-4 col-xs-6 logos">
         <a href="https://www.coreos.com/"><img src="assets/company-logos/CoreOS.png"/></a>
       </div>
-      <div class="col-md-4">
+      <div class="col-md-2 col-sm-4 col-xs-6 logos">
         <a href="http://www.crononauta.com/"><img src="assets/company-logos/crononauta.png"/></a>
       </div>
-      <div class="col-md-4">
+      <div class="col-md-2 col-sm-4 col-xs-6 logos">
         <a href="http://www.ericsson.com/"><img src="assets/company-logos/Ericsson.png"/></a>
       </div>
-    </div>
-    <div class="row logos">
-      <div class="col-md-4">
+      <div class="col-md-2 col-sm-4 col-xs-6 logos">
         <a href="http://www.eurotech.com/"><img src="assets/company-logos/Eurotech.png"/></a>
       </div>
-      <div class="col-md-4">
+      <div class="col-md-2 col-sm-4 col-xs-6 logos">
         <a href="http://improbable.io/"><img src="assets/company-logos/Improbable.png"/></a>
       </div>
-      <div class="col-md-4">
+      <div class="col-md-2 col-sm-4 col-xs-6 logos">
         <a href="http://www.mavensecurities.com/"><img src="assets/company-logos/MavenSecurities.png"/></a>
       </div>
-    </div>
-    <div class="row logos">
-      <div class="col-md-4">
+      <div class="col-md-2 col-sm-4 col-xs-6 logos">
         <a href="http://www.outbrain.com/"><img src="assets/company-logos/Outbrain.png"/></a>
       </div>
-      <div class="col-md-4">
+      <div class="col-md-2 col-sm-4 col-xs-6 logos">
         <a href="https://www.percona.com/"><img src="assets/company-logos/Percona.png"/></a>
       </div>
-      <div class="col-md-4">
+      <div class="col-md-2 col-sm-4 col-xs-6 logos">
         <a href="http://www.robustperception.io/"><img src="assets/company-logos/RobustPerception.png"/></a>
       </div>
-    </div>
-    <div class="row logos">
-      <div class="col-md-4">
+      <div class="col-md-2 col-sm-4 col-xs-6 logos">
         <a href="http://www.showmax.com/"><img src="assets/company-logos/ShowMax.png"/></a>
       </div>
-      <div class="col-md-4">
+      <div class="col-md-2 col-sm-4 col-xs-6 logos">
         <a href="https://www.shuttlecloud.com/"><img src="assets/company-logos/shuttlecloud.png"/></a>
       </div>
-      <div class="col-md-4">
+      <div class="col-md-2 col-sm-4 col-xs-6 logos">
         <a href="https://www.soundcloud.com/"><img src="assets/company-logos/soundcloud.png"/></a>
       </div>
-    </div>
-    <div class="row logos">
-      <div class="col-md-4">
+      <div class="col-md-2 col-sm-4 col-xs-6 logos">
         <a href="https://www.uda100.com/"><img src="assets/company-logos/WeLearn.png"/></a>
       </div>
-      <div class="col-md-4">
+      <div class="col-md-2 col-sm-4 col-xs-6 logos">
         <a href="https://www.unosoft.hu/"><img src="assets/company-logos/unosoft.png"/></a>
       </div>
-      <div class="col-md-4">
+      <div class="col-md-2 col-sm-4 col-xs-6 logos">
         <a href="https://www.variomedia.de/"><img src="assets/company-logos/variomedia.png"/></a>
       </div>
     </div>

static/docs.css

@@ -269,5 +269,6 @@ article {
 .logos {
   display: flex;
   align-items: center;
-  height: 128px;
+  justify-content: center;
+  height: 64px;
 }