Fix download widget form wrapping

JAVA-1695

Author: rozza

docs/landing/layouts/partials/quickStart.html

@@ -12,9 +12,10 @@ <h2 id="quickStart">Quick Start</h2>
 {{$currentReleasedVersion := $.Scratch.Get "qs.currentReleasedVersion"}}
 
 <div id="downloadWidget">
-  <form class="form-inline">
-    <a id="downloadLink" href="https://oss.sonatype.org/content/repositories/releases/org/mongodb/mongodb-driver/{{$currentReleasedVersion.version}}/"
-          class="btn btn-large btn-dark btn-download" target="_blank">Download</a>
+  <div class="container">
+    <div class="row downloadForm">
+      <form>
+        <div class="col-xs-5 col-lg-4 col-lg-push-2 ">
       {{ $.Scratch.Set "qs.pos" 0 }}
       {{ $.Scratch.Set "qs.firstDriver" false }}
       {{ with $.Site.Data.releases.drivers }}
@@ -26,7 +27,8 @@ <h2 id="quickStart">Quick Start</h2>
           {{ end }}
         </select>
       {{ end }}
-
+      </div>
+    <div class="col-xs-5 col-lg-4 col-lg-push-2 ">
     {{ $.Scratch.Set "qs.pos" 0 }}
     {{ $firstDriver := $.Scratch.Get "qs.firstDriver"}}
     {{ with $.Site.Data.releases.versions }}
@@ -37,8 +39,19 @@ <h2 id="quickStart">Quick Start</h2>
         {{ end }}
       </select>
     {{ end }}
+    </div>
+    <div class="col-lg-2 col-lg-push-2 ">
     <input type="checkbox" checked class="distroPicker" data-toggle="toggle" data-on="Maven" data-off="Gradle" data-offstyle="success">
+    </div>
   </form>
+  <div class="hidden-md hidden-sm hidden-xs col-lg-2 col-lg-pull-10 downloadLink">
+  <a href="https://oss.sonatype.org/content/repositories/releases/org/mongodb/mongodb-driver/{{$currentReleasedVersion.version}}/"
+        class="btn btn-dark btn-download" target="_blank">Download</a>
+  </div>
+  </div>
+
+
+  <div class="row">
   <div class="clipboard" title="copy">
   <button class="btn btn-dark"><i class="fa fa-clipboard fa-2"></i></button>
   </div>
@@ -88,4 +101,6 @@ <h2 id="quickStart">Quick Start</h2>
           {{ $.Scratch.Add "qs.driverPos" 1 }}
       {{ end }}
       {{ end }}
-</div>
+    </div>
+    </div>
+  </div>

docs/landing/static/s/css/frontpage.css

@@ -274,11 +274,8 @@ input.gsc-search-button[title], input.gsc-search-button:hover[title], input.gsc-
 }
 
 .btn-download, .btn-download:visited, .btn-download:active {
-  font-size: 14px;
-  font-weight: 800;
-  line-height: 14px;
-  margin: 0px;
-  padding: 20px 60px;
+  margin-top: -10px;
+  padding: 15px 10px;
   text-shadow: none;
   text-transform: uppercase;
 }
@@ -314,6 +311,15 @@ input.gsc-search-button[title], input.gsc-search-button:hover[title], input.gsc-
   border: 1px solid #3b291f;
 }
 
+#downloadWidget .downloadForm {
+  margin-top: 10px;
+}
+
+#downloadWidget .downloadLink {
+  padding-left: 0;
+  padding-right: 5px;
+}
+
 #downloadWidget .description {
   border-top: 1px solid #3b291f;
   padding: 10px;
@@ -328,8 +334,9 @@ input.gsc-search-button[title], input.gsc-search-button:hover[title], input.gsc-
   padding: 0;
 }
 
-#downloadWidget code {
-  padding: 0 10px;
+#downloadWidget pre code {
+  padding: 10px;
+  min-height: 65px;
 }
 
 #downloadWidget .clipboard {