Merge pull request #449 from nicoburns/reduce-homepage-whitespace

Reduce vertical padding on homepage

Author: ashleygwilliams

src/styles/app.scss

@@ -49,15 +49,12 @@ header h1, section h2 {
 }
 
 header h1 {
+  line-height: 1;
   font-size: 10rem;
   margin-bottom: 0;
   margin-top: 0;
 }
 
-header {
-  padding: 30px 0 60px 0;
-}
-
 header .button.button-primary.button-download {
   background-color: $yellow;
   border-color: $yellow;
@@ -66,7 +63,7 @@ header .button.button-primary.button-download {
   padding: 20px;
   height: auto;
   font-size: 2em;
-  margin-top: 20px;
+  margin-top: 25px;
 }
 
 header .button.button-primary.button-download:hover {
@@ -82,7 +79,7 @@ h2.subtitle {
 }
 
 section {
-  padding: 30px 0 60px 0;
+  padding: 30px 0;
 }
 
 ul {
@@ -566,7 +563,7 @@ blockquote::before {
     .button.button-primary.button-download {
       padding: 5px;
       font-size: 1.5em;
-      margin-top: 20px;
+      margin-top: 0;
     }
   }
 }

templates/index.hbs

@@ -1,14 +1,14 @@
 {{#*inline "page"}}
-<header class="mb6-ns">
+<header class="pt4 pb4-ns">
   <div class="container flex flex-column flex-row-l justify-between-l">
     <div class="mw8-l">
       <h1>Rust</h1>
-      <h2 class="mt4 f2 f1-ns">
+      <h2 class="f2 f1-ns">
         The programming language that empowers <em>everyone</em> to become a
         systems programmer.
       </h2>
     </div>
-    <div class="mt4 mt0-l">
+    <div>
       <a class="button button-primary button-download ph4 mt0" href="/learn/get-started">
         Get started
       </a>

templates/nav.hbs

@@ -7,7 +7,7 @@
     <span class="pl4 db dn-l">{{!-- spacer --}}</span>
   </a>
 
-  <ul class="nav list w-100 w-auto-l flex flex-none flex-row flex-wrap justify-center justify-end-l items-center pv2 ph4-ns">
+  <ul class="nav list w-100 w-auto-l flex flex-none flex-row flex-wrap justify-center justify-end-l items-center pv2 ph4-ns pl0">
     <li class="flex-inline pv2 ph2 ph4-ns"><a href="/learn">Learn</a></li>
     <li class="flex-inline pv2 ph2 ph4-ns"><a href="/tools">Tools</a></li>
     <li class="flex-inline pv2 ph2 ph4-ns"><a href="/governance">Governance</a></li>

templates/panels/language-values.hbs

@@ -9,23 +9,23 @@
     <div class="flex flex-column flex-row-l pv4 pv0-l">
       <section class="flex flex-column mw8 measure-wide-l pv3 pt4-ns pr4-l">
         <h3 class="f2 f1-l">Performance</h3>
-        <p class="f3 lh-copy">
+        <p class="mb0 f3 lh-copy">
           Rust is blazingly fast and memory-efficient: with no runtime or
           garbage collector, it can power performance-critical services, run on
           embedded devices, and easily integrate with other languages.
         </p>
       </section>
       <section class="flex flex-column mw8 measure-wide-l pv3 pt4-ns ph3-l">
         <h3 class="f2 f1-l">Reliability</h3>
-        <p class="f3 lh-copy">
+        <p class="mb0 f3 lh-copy">
           Rust’s rich type system and ownership model guarantee memory-safety
           and thread-safety &mdash; and enable you to eliminate many other
           classes of bugs at compile-time.
         </p>
       </section>
       <section class="flex flex-column mw8 measure-wide-l pv3 pt4-ns pl4-l">
         <h3 class="f2 f1-l">Productivity</h3>
-        <p class="f3 lh-copy">
+        <p class="mb0 f3 lh-copy">
           Rust has great documentation, a friendly compiler with useful error
           messages, and top-notch tooling &mdash; an integrated package manager
           and build tool, a multi-editor language server, an auto-formatter, and