Add twitter row and dummy text for homepage features

content/about-hugo/_index.md

@@ -9,6 +9,6 @@ categories: []
 tags: []
 weight: 01
 draft: false
-aliases: []
+aliases: [/docs/]
 toc: false
 ---

content/getting-started/installing.md

@@ -10,7 +10,7 @@ authors: ["Michael Henderson"]
 tags: [install,fundamentals,pc,windows,linux,mac,osx,binary,tarball]
 weight: 30
 draft: false
-aliases: [/tutorials/installing-on-windows/,/tutorials/installing-on-mac/,/overview/installing/,/getting-started/install,/install/,/docs/]
+aliases: [/tutorials/installing-on-windows/,/tutorials/installing-on-mac/,/overview/installing/,/getting-started/install,/install/]
 toc: true
 ---
 

data/homepagefeatures.toml

@@ -0,0 +1,29 @@
+[[feature]]
+	name = "Unparalleled Speed"
+	description = "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Omnis dolor maiores officia officiis nemo voluptate hic necessitatibus debitis, vel ad ipsa temporibus aperiam architecto, molestiae, nulla minus corrupti iusto magni."
+	order = 1
+
+[[feature]]
+	name = "Markdown without Limits"
+	description = "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Omnis dolor maiores officia officiis nemo voluptate hic necessitatibus debitis, vel ad ipsa temporibus aperiam architecto, molestiae, nulla minus corrupti iusto magni."
+	order = 2
+
+[[feature]]
+	name = "Robust Content Management"
+	description = "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Omnis dolor maiores officia officiis nemo voluptate hic necessitatibus debitis, vel ad ipsa temporibus aperiam architecto, molestiae, nulla minus corrupti iusto magni."
+	order = 3
+
+[[feature]]
+	name = "True Universality"
+	description = "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Omnis dolor maiores officia officiis nemo voluptate hic necessitatibus debitis, vel ad ipsa temporibus aperiam architecto, molestiae, nulla minus corrupti iusto magni."
+	order = 4
+
+[[feature]]
+	name = "Feature 5"
+	description = "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Omnis dolor maiores officia officiis nemo voluptate hic necessitatibus debitis, vel ad ipsa temporibus aperiam architecto, molestiae, nulla minus corrupti iusto magni."
+	order = 5
+
+[[feature]]
+	name = "Feature 6"
+	description = "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Omnis dolor maiores officia officiis nemo voluptate hic necessitatibus debitis, vel ad ipsa temporibus aperiam architecto, molestiae, nulla minus corrupti iusto magni."
+	order = 6

data/homepagetweets.toml

@@ -1,207 +1,207 @@
-[[quotes]]
+[[tweet]]
 name = "Hans Beck"
 twitter_handle = "@EnrichedGamesHB"
-quote = "Diving deeper into @GoHugoIO . A lot of docs there, top work! But I've the impressed that #gohugo is far easier than its feels from the docs!"
+quote = "Diving deeper into <a href='https://twitter.com/GoHugoIO' target='_blank'>@GoHugoIO</a>. A lot of docs there, top work! But I've the impressed that <a href='https://twitter.com/hashtag/gohugo' target='_blank'>#gohugo</a> is far easier than its feels from the docs!"
 link = "https://twitter.com/EnrichedGamesHB/status/836854762440130560"
 date = 2017-03-01T00:00:00Z
 
-[[quotes]]
+[[tweet]]
 name = "Alan Richardson"
 twitter_handle = "@eviltester"
-quote = "I migrated the <a href='https://twitter.com/BlackOpsTesting'> @BlackOpsTesting </a> .com website from docpad to Hugo last weekend. http://gohugo.io/  Super Fast HTML Generation <a href='https://twitter.com/spf13'> @spf13 </a>"
+quote = "I migrated the <a href='https://twitter.com/BlackOpsTesting' target='_blank'> @BlackOpsTesting </a>.com website from docpad to Hugo last weekend. http://gohugo.io/ Super Fast HTML Generation <a href='https://twitter.com/spf13' target='_blank'> @spf13 </a>"
 link = "https://twitter.com/eviltester/status/553520335115808768"
 date = 2015-01-09T00:00:00Z
 
-[[quotes]]
+[[tweet]]
 name = "Janez Čadež‏"
 twitter_handle = "@jamziSLO"
-quote = "Building @garazaFRI website in #hugo. This static site generator is soooo damn fast!"
+quote = "Building <a href='https://twitter.com/garazaFRI' target='_blank'>@garazaFRI</a> website in <a href='https://twitter.com/hashtag/hugo' target='_blank'>#hugo</a>. This static site generator is soooo damn fast! <a href='https://twitter.com/hashtag/gohugo' target='_blank'>#gohugo</a> <a href='https://twitter.com/hashtag/golang' target='_blank'>#golang</a>"
 link = "https://twitter.com/jamziSLO/status/817720283977183234"
 date = 2017-01-07T00:00:00Z
 
-[[quotes]]
+[[tweet]]
 name = "Execute‏‏"
 twitter_handle = "@executerun"
-quote = "Hah, #gohugo. I was working with #gohugo on #linux but now I realised how easy is to set-up it on #windows. Just need to add binary to #path!"
+quote = "Hah, <a href='https://twitter.com/hashtag/gohugo' target='_blank'>#gohugo</a>. I was working with <a href='https://twitter.com/hashtag/gohugo' target='_blank'>#gohugo</a> on <a href='https://twitter.com/hashtag/linux' target='_blank'>#linux</a> but now I realised how easy is to set-up it on <a href='https://twitter.com/hashtag/windows' target='_blank'>#windows</a>. Just need to add binary to <a href='https://twitter.com/hashtag/path' target='_blank'>#path</a>!"
 link = "https://twitter.com/executerun/status/809753145270272005"
 date = 2016-12-16T00:00:00Z
 
-[[quotes]]
+[[tweet]]
 name = "Baron Schwartz"
 twitter_handle = "@xaprb"
 quote = "Hugo is impressively capable. It's a static site generator by <a href='https://twitter.com/spf13'> @spf13 </a> written in <a href='https://twitter.com/hashtag/golang?src=hash'> #golang </a> . Just upgraded to latest release; very powerful.  "
 link = "https://twitter.com/xaprb/status/556894866488455169"
 date = 2015-01-18T00:00:00Z
 
-[[quotes]]
+[[tweet]]
 name = "Dave Cottlehuber"
 twitter_handle = "@dch__"
 quote = "I just fell in love with #hugo, a static site/blog engine written by @spf13 in #golang  + stellar docs"
 link = "https://twitter.com/dch__/status/460158115498176512"
 date = 2014-04-26T00:00:00Z
 
-[[quotes]]
+[[tweet]]
 name = "David Caunt"
 twitter_handle = "@dcaunt"
 quote = "I had a play with Hugo and it was good, uses Markdown files for content"
 link = "https://twitter.com/dcaunt/statuses/406466996277374976"
 date = 2013-11-29T00:00:00Z
 
-[[quotes]]
+[[tweet]]
 name = "David Gay"
 twitter_handle = "@oddshocks"
 quote = "Hugo is super-rad."
 link = "https://twitter.com/oddshocks/statuses/405083217893421056"
 date = 2013-11-25T00:00:00Z
 
-[[quotes]]
+[[tweet]]
 name = "Diti"
 twitter_handle = "@DitiPengi"
 quote = "The dev version of Hugo is AWESOME! &lt;3 I promise, I will try to learn go ASAP and help contribute to the project! Just too great!"
 link = "https://twitter.com/DitiPengi/status/472470974051676160"
 date = 2014-05-30T00:00:00Z
 
-[[quotes]]
+[[tweet]]
 name = "Douglas Stephen "
 twitter_handle = "@DougStephenJr"
 quote = "Even as a long-time Octopress fan, I’ve gotta admit that this project Hugo looks very very cool"
 link = "https://twitter.com/DougStephenJr/statuses/364512471660249088"
 date = 2013-08-05T00:00:00Z
 
-[[quotes]]
+[[tweet]]
 name = "Hugo Rodger-Brown"
 twitter_handle = "@hugorodgerbrown"
 quote = "Finally someone builds me my own static site generator"
 link = "https://twitter.com/hugorodgerbrown/statuses/364417910153818112"
 date = 2013-05-08T00:00:00Z
 
-[[quotes]]
+[[tweet]]
 name = "Hugo Roy"
 twitter_handle = "@hugoroyd"
 quote = "Finally the answer to the question my parents have been asking: What does Hugo do?"
 link = "https://twitter.com/hugoroyd/status/501704796727173120"
 date = 2014-08-19T00:00:00Z
 
-[[quotes]]
+[[tweet]]
 name = "Daniel Miessler"
 twitter_handle = "@DanielMiessler"
 quote = "Websites for named vulnerabilities should run on static site generator platforms like Hugo. Read-only + burst traffic = static."
 link = "https://twitter.com/DanielMiessler/status/704703841673957376"
 date = 2016-03-01T00:00:00Z
 
-[[quotes]]
+[[tweet]]
 name = "Javier Segura"
 twitter_handle = "@jsegura"
 quote = "Another site generated with Hugo here! I'm getting in love with it."
 link = "https://twitter.com/jsegura/status/465978434154659841"
 date = 2014-05-12T00:00:00Z
 
-[[quotes]]
+[[tweet]]
 name = "Jim Biancolo"
 twitter_handle = "@jimbiancolo"
 quote = "I’m loving the static site generator renaissance we are currently enjoying. Hugo is new, looks great, written in Go"
 link = "https://twitter.com/jimbiancolo/statuses/408678420348813314"
 date = 2013-05-12T00:00:00Z
 
-[[quotes]]
+[[tweet]]
 name = "Jip J. Dekker"
 twitter_handle = "@jipjdekker"
 quote = "Building a personal website in Hugo. Works like a charm. And written in @golang!"
 link = "https://twitter.com/jipjdekker/status/413783548735152131"
 date = 2013-12-19T00:00:00Z
 
-[[quotes]]
+[[tweet]]
 name = "Jose Gonzalvo"
 twitter_handle = "@jgonzalvo"
 quote = "Checking out Hugo; Loving it so far. Like Jekyll but not so blog-oriented and written in go"
 link = "https://twitter.com/jgonzalvo/statuses/408177855819173888"
 date = 2013-12-04T00:00:00Z
 
-[[quotes]]
+[[tweet]]
 name = "Josh Matz"
 twitter_handle = "@joshmatz"
 quote = "A static site generator without the long build times? Yes, please!"
 link = "https://twitter.com/joshmatz/statuses/364437436870696960"
 date = 2013-08-05T00:00:00Z
 
-[[quotes]]
+[[tweet]]
 name = "Kieran Healy"
 twitter_handle = "@kjhealy"
 quote = "OK, so in today's speed battle of static site generators, @spf13's hugo is kicking everyone's ass, by miles."
 link = "https://twitter.com/kjhealy/status/437349384809115648"
 date = 2014-02-22T00:00:00Z
 
-[[quotes]]
+[[tweet]]
 name = "Ludovic Chabant"
 twitter_handle = "@ludovicchabant"
 quote = "Good work on Hugo, I’m impressed with the speed!"
 link = "https://twitter.com/ludovicchabant/statuses/408806199602053120"
 date = 2013-12-06T00:00:00Z
 
-[[quotes]]
+[[tweet]]
 name = "Luke Holder"
 twitter_handle = "@lukeholder"
 quote = "this is AWESOME. a single little executable and so fast."
 link = "https://twitter.com/lukeholder/status/430352287936946176"
 date = 2014-02-03T00:00:00Z
 
-[[quotes]]
+[[tweet]]
 name = "Markus Eliasson"
 twitter_handle = "@markuseliasson"
 quote = "Hugo is fast, dead simple to setup and well documented"
 link = "https://twitter.com/markuseliasson/status/501594865877008384"
 date = 2014-08-19T00:00:00Z
 
-[[quotes]]
+[[tweet]]
 name = "mercime"
 twitter_handle = "@mercime_one"
 quote = "Hugo: Makes the Web Fun Again"
 link = "https://twitter.com/mercime_one/status/500547145087205377"
 date = 2014-08-16T00:00:00Z
 
-[[quotes]]
+[[tweet]]
 name = "Michael Whatcott"
 twitter_handle = "@mdwhatcott"
 quote = "One more satisfied #Hugo blogger. Thanks @spf13 and friends!"
 link = "https://twitter.com/mdwhatcott/status/469980686531571712"
 date = 2014-05-23T00:00:00Z
 
-[[quotes]]
+[[tweet]]
 name = "Nathan Toups"
 twitter_handle = "@rojoroboto"
 quote = "I love Hugo! My site is generated with it now http://rjrbt.io"
 link = "https://twitter.com/rojoroboto/status/423439915620106242"
 date = 2014-01-15T00:00:00Z
 
-[[quotes]]
+[[tweet]]
 name = "Ruben Solvang"
 twitter_handle = "@messo85"
 quote = "#Hugo is the new @jekyllrb / @middlemanapp! Faster, easier and runs everywhere."
 link = "https://twitter.com/messo85/status/472825062027182081"
 date = 2014-05-31T00:00:00Z
 
-[[quotes]]
+[[tweet]]
 name = "Ryan Martinsen"
 twitter_handle = "@popthestack"
 quote = "Also, I re-launched my blog (it looks the same as before) using Hugo, a *fast* static engine. Very happy with it.  <a href='http://gohugo.io/'>gohugo.io</a>"
 link = "https://twitter.com/popthestack/status/549972754125307904"
 date = 2014-12-30T00:00:00Z
 
-[[quotes]]
+[[tweet]]
 name = "The Lone Cuber"
 twitter_handle = "@TheLoneCuber"
 quote = "Jekyll is dead to me these days though... long live Hugo! Hugo is *by far* the best in its field. Thanks for making it happen."
 link = "https://twitter.com/TheLoneCuber/status/495716684456398848"
 date = 2014-08-02T00:00:00Z
 
-[[quotes]]
+[[tweet]]
 name = "The Lone Cuber"
 twitter_handle = "@TheLoneCuber"
 quote = "Finally, a publishing platform that's a joy to use. #NoMoreBarriers"
 link = "https://twitter.com/TheLoneCuber/status/495731334711488512"
 date = 2014-08-02T00:00:00Z
 
-[[quotes]]
+[[tweet]]
 name = "WorkHTML"
 twitter_handle = "@workhtml"
 quote = "<a href='https://twitter.com/hashtag/Hugo?src=hash'> #Hugo </a> A very good alternative for <a href='https://twitter.com/hashtag/wordpress?src=hash'> #wordpress </a> !!! A fast and modern static website engine <a href='http://gohugo.io/'> gohugo.io </a>"

layouts/partials/homepage/homepage-content.html

@@ -26,15 +26,28 @@
         <hr class="hr">
         <p>Forget databases, security updates, and cofee breaks spent waiting for your site to rebuild.</p>
         <!-- <p>Focus on content. Focus on design.</p> -->
-        <p>Golang's speed combined with markdown's elegant simplicity mean Hugo's the first static site generator fast enough to keep up with your creativity.</p>
+        <p>Golang's speed combined with markdown's elegant simplicity mean Hugo is the first static site generator fast enough to keep up with your creativity.</p>
       </div>
     </div>
   </div>
-  <div class="home-row features">
+  <div class="home-row">
-    <h2>What Makes Hugo Special</h2>
+    <div class="home-row-content homepage-features">
+      <h2>What Makes Hugo Special?</h2>
+      {{ partial "homepage/homepage-features" . }}
+    </div>
   </div>
-  <div class="home-row references">
+  <div class="home-row">
-    <h2>See what others are saying about Hugo</h2>
+    <div class="home-row-content homepage-tweets">
-    {{ partial "homepage/homepage-tweets.html" . }}
+      <h2>See what others are saying about Hugo...</h2>
+      {{ partial "homepage/homepage-tweets.html" . }}
+    </div>
+  </div>
+  <div class="home-row">
+    <div class="home-row-content homepage-open-source">
+      <div class="icon-github-wrapper">
+        <i class="icon-github"></i>
+      </div>
+      <p>Hugo is <a href="https://github.com/spf13/hugo/">open source</a> and completely free.</p>
+    </div>
   </div>
 </main>

layouts/partials/homepage/homepage-features.html

@@ -0,0 +1,8 @@
+{{ range sort $.Site.Data.homepagefeatures.feature "order" }}
+<div class="feature">
+		<h3>{{.name}}</h3>
+		<div class="feature-content">
+			{{.description}}
+		</div>
+</div>
+{{ end }}

layouts/partials/homepage/homepage-header.html

@@ -1,7 +1,7 @@
 <nav id="homepage-nav">
   <ul class="animated">
   	<li>
-    	<a href="/getting-started/">Docs</a>
+    	<a href="/about-hugo/">Docs</a>
     </li>
     <li>
     	<a href="https://discuss.gohugo.io" target="_blank">Forum</a>

layouts/partials/homepage/homepage-tweets.html

@@ -1,10 +1,11 @@
-{{ range last 8 (sort $.Site.Data.references.quotes "date" )  }}
+{{ range first 6 (sort $.Site.Data.homepagetweets.tweet "date" "desc" )  }}
-<div class="item">
+<div class="homepage-tweet">
+	<i class="icon-twitter"></i>
 	<blockquote>
 		<p>
      {{.quote | safeHTML}}
 		</p>
-		<cite>&#9472; {{ .name }} ({{ .twitter_handle }}) <a href="{{ .link }}">
+		<cite class="homepage-tweet-attribution">&#9472; {{ .name }} ({{ .twitter_handle }}) <a href="{{ .link }}" target="_blank">
             {{ dateFormat "January 2, 2006" .date }}
         </a></cite>
 	</blockquote>

layouts/partials/site-footer.html

@@ -2,7 +2,7 @@
 <footer id="site-footer" class="site-footer{{if .Params.toc}} withtoc{{end}}{{if .IsHome}} homepage {{end}}">
   <div class="footer-content">
     <div class="footer-info">
-      <span>By <a href="http://spf13.com" target="_blank">spf13</a> and friends.</span>
+      <span>By <a href="http://spf13.com" target="_blank">spf13</a> and <a href="https://github.com/spf13/hugo/contributors" target="_blank">friends</a>.</span>
       <img src="{{ "images/hugo-logo/made-with-hugo-dark.png" | relURL}}" alt="Made with Hugo Logo">
     </div>
     <div class="footer-list">

pipeline/scss/pages/_homepage.scss

@@ -1,4 +1,5 @@
 #homepage-nav {
+  transition: box-shadow .2s ease-in-out;
   display: flex;
   align-items: center;
   justify-content: center;
@@ -9,31 +10,35 @@
   z-index: 50;
   min-height: 50px;
   max-height: 50px;
-  // @include card(1);
   background-color: $hugo-white;
-  ul.animated {
+  &.shadow {
-    margin-top: 0px;
+    transition: box-shadow .2s ease-in-out;
-    margin-bottom: 0px;
+    @include card(1);
-    max-width: 400px;
+  }
-    min-width: 240px;
+}
-    text-align: center;
+
+ul.animated {
+  margin-top: 0px;
+  margin-bottom: 0px;
+  max-width: 400px;
+  min-width: 240px;
+  text-align: center;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  @include MQ(M) {
+    min-width: 320px;
+  }
+  margin: {
+    left: auto;
+    right: auto;
+  }
+  li {
     display: flex;
-    justify-content: space-between;
+    a {
-    align-items: center;
+      color: $hugo-gray;
-    @include MQ(M) {
+      &:hover {
-      min-width: 320px;
+        color: $hugo-pink;
-    }
-    margin: {
-      left: auto;
-      right: auto;
-    }
-    li {
-      display: flex;
-      a {
-        color: $hugo-gray;
-        &:hover {
-          color: $hugo-pink;
-        }
       }
     }
   }
@@ -105,7 +110,13 @@
     align-items: center;
   }
   &:nth-child(2) {
-    background-color: $hugo-gray-ultra-light;
+    background-color: darken($hugo-gray-ultra-light, 3%);
+  }
+  &:nth-child(3) {
+    background-color: $hugo-white;
+  }
+  &:nth-child(4) {
+    background-color: $hugo-blue;
   }
 }
 
@@ -118,6 +129,12 @@
   margin-top: 4rem;
   margin-bottom: 4rem;
   width: 90%;
+  h2 {
+    text-align: left;
+    width: 100%;
+    text-align: center;
+    margin-bottom: 1em;
+  }
   @include MQ(XL) {
     justify-content: space-around;
   }
@@ -126,6 +143,33 @@
   }
 }
 
+.homepage-features {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-around;
+  width: 85%;
+  .feature {
+    margin-bottom: 2em;
+    max-width: $L * .31;
+    h3 {
+      margin-bottom: 0px;
+      padding-bottom: 0px;
+      font-weight: 500;
+      border-bottom: 1px solid white;
+      font-size: 1.1em;
+    }
+    .feature-content {
+      color: lighten($base-font-color, 30%);
+      font-weight: 200;
+      line-height: 1.3;
+      font-size: .9em;
+      p {
+        color: lighten($base-font-color, 30%);
+      }
+    }
+  }
+}
+
 .half {
   width: 90%;
   margin-left: auto;
@@ -271,3 +315,51 @@ svg {
     animation-timing-function: ease-out;
   }
 }
+
+.homepage-tweets {
+  // color: $hugo-white;
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-around;
+  h2 {
+    color: $hugo-white;
+  }
+  @include MQ(M) {
+    max-width: 640px;
+  }
+  @include MQ(L) {
+    max-width: $L;
+  }
+}
+
+.homepage-tweet {
+  max-width: 300px;
+  background-color: $hugo-white;
+  margin-bottom: 20px;
+  border-radius: 4px;
+  position: relative;
+  i.icon-twitter {
+    position: absolute;
+    top: 10px;
+    right: 10px;
+    color: #1DA1F2;
+  }
+}
+
+.homepage-tweet-attribution {
+  font-style: normal;
+  width: 100%;
+  display: block;
+  font-size: .8em;
+  text-align: right;
+}
+
+.homepage-open-source {
+  .icon-github-wrapper {
+    width:100%;
+    text-align:center;
+  }
+  i.icon-github {
+    font-size: 62px;
+  }
+}

pipeline/scss/style.scss

@@ -20,9 +20,7 @@
 @import 'components/anchors';
 @import 'components/images';
 @import 'components/admonitions';
-// @import 'vendor/highlightjs-OLD';
 @import 'vendor/highlightjs';
-// @import 'components/code-OLD';
 @import 'components/code';
 @import 'components/icons';
 @import 'components/tags';
@@ -40,7 +38,7 @@
 
 //vendor
 @import 'vendor/featherlight';
-@import 'vendor/animate';
+@import 'vendor/animatecss-truncated';
 
 //major layout parts/chrome
 @import 'layout/site-header';

pipeline/scss/vendor/_animatecss-truncated.scss

@@ -0,0 +1,132 @@
+//Select animate.css classes used for homepage...
+.animated {
+  -webkit-animation-duration: 1s;
+  animation-duration: 1s;
+  -webkit-animation-fill-mode: both;
+  animation-fill-mode: both
+}
+
+.animated.infinite {
+  -webkit-animation-iteration-count: infinite;
+  animation-iteration-count: infinite
+}
+
+.animated.hinge {
+  -webkit-animation-duration: 2s;
+  animation-duration: 2s
+}
+
+animated.bounceIn,
+.animated.bounceOut,
+.animated.flipOutX,
+.animated.flipOutY {
+  -webkit-animation-duration: .75s;
+  animation-duration: .75s
+}
+
+
+@-webkit-keyframes bounceIn {
+  0%,
+  20%,
+  40%,
+  60%,
+  80%,
+  to {
+    -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
+    animation-timing-function: cubic-bezier(.215, .61, .355, 1)
+  }
+  0% {
+    opacity: 0;
+    -webkit-transform: scale3d(.3, .3, .3);
+    transform: scale3d(.3, .3, .3)
+  }
+  20% {
+    -webkit-transform: scale3d(1.1, 1.1, 1.1);
+    transform: scale3d(1.1, 1.1, 1.1)
+  }
+  40% {
+    -webkit-transform: scale3d(.9, .9, .9);
+    transform: scale3d(.9, .9, .9)
+  }
+  60% {
+    opacity: 1;
+    -webkit-transform: scale3d(1.03, 1.03, 1.03);
+    transform: scale3d(1.03, 1.03, 1.03)
+  }
+  80% {
+    -webkit-transform: scale3d(.97, .97, .97);
+    transform: scale3d(.97, .97, .97)
+  }
+  to {
+    opacity: 1;
+    -webkit-transform: scaleX(1);
+    transform: scaleX(1)
+  }
+}
+
+@keyframes bounceIn {
+  0%,
+  20%,
+  40%,
+  60%,
+  80%,
+  to {
+    -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
+    animation-timing-function: cubic-bezier(.215, .61, .355, 1)
+  }
+  0% {
+    opacity: 0;
+    -webkit-transform: scale3d(.3, .3, .3);
+    transform: scale3d(.3, .3, .3)
+  }
+  20% {
+    -webkit-transform: scale3d(1.1, 1.1, 1.1);
+    transform: scale3d(1.1, 1.1, 1.1)
+  }
+  40% {
+    -webkit-transform: scale3d(.9, .9, .9);
+    transform: scale3d(.9, .9, .9)
+  }
+  60% {
+    opacity: 1;
+    -webkit-transform: scale3d(1.03, 1.03, 1.03);
+    transform: scale3d(1.03, 1.03, 1.03)
+  }
+  80% {
+    -webkit-transform: scale3d(.97, .97, .97);
+    transform: scale3d(.97, .97, .97)
+  }
+  to {
+    opacity: 1;
+    -webkit-transform: scaleX(1);
+    transform: scaleX(1)
+  }
+}
+
+.bounceIn {
+  -webkit-animation-name: bounceIn;
+  animation-name: bounceIn
+}
+
+@-webkit-keyframes fadeIn {
+  0% {
+    opacity: 0
+  }
+  to {
+    opacity: 1
+  }
+}
+
+@keyframes fadeIn {
+  0% {
+    opacity: 0
+  }
+  to {
+    opacity: 1
+  }
+}
+
+.fadeIn {
+  -webkit-animation-name: fadeIn;
+  animation-name: fadeIn
+}

static/css/style.min.css

@@ -1,7 +1 @@
-.container-fluid,.container{margin-right:auto;margin-left:auto}.container-fluid{padding-right:2rem;padding-left:2rem}.row{box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex:0 1 auto;flex:0 1 auto;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-right:-0.5rem;margin-left:-0.5rem}.row.reverse{-ms-flex-direction:row-reverse;flex-direction:row-reverse}.col.reverse{-ms-flex-direction:column-reverse;flex-direction:column-reverse}.col-xs,.col-xs-1,.col-xs-2,.col-xs-3,.col-xs-4,.col-xs-5,.col-xs-6,.col-xs-7,.col-xs-8,.col-xs-9,.col-xs-10,.col-xs-11,.col-xs-12,.col-xs-offset-0,.col-xs-offset-1,.col-xs-offset-2,.col-xs-offset-3,.col-xs-offset-4,.col-xs-offset-5,.col-xs-offset-6,.col-xs-offset-7,.col-xs-offset-8,.col-xs-offset-9,.col-xs-offset-10,.col-xs-offset-11,.col-xs-offset-12{box-sizing:border-box;-ms-flex:0 0 auto;flex:0 0 auto;padding-right:0.5rem;padding-left:0.5rem}.col-xs{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-ms-flex-preferred-size:0;flex-basis:0;max-width:100%}.col-xs-1{-ms-flex-preferred-size:8.33333333%;flex-basis:8.33333333%;max-width:8.33333333%}.col-xs-2{-ms-flex-preferred-size:16.66666667%;flex-basis:16.66666667%;max-width:16.66666667%}.col-xs-3{-ms-flex-preferred-size:25%;flex-basis:25%;max-width:25%}.col-xs-4{-ms-flex-preferred-size:33.33333333%;flex-basis:33.33333333%;max-width:33.33333333%}.col-xs-5{-ms-flex-preferred-size:41.66666667%;flex-basis:41.66666667%;max-width:41.66666667%}.col-xs-6{-ms-flex-preferred-size:50%;flex-basis:50%;max-width:50%}.col-xs-7{-ms-flex-preferred-size:58.33333333%;flex-basis:58.33333333%;max-width:58.33333333%}.col-xs-8{-ms-flex-preferred-size:66.66666667%;flex-basis:66.66666667%;max-width:66.66666667%}.col-xs-9{-ms-flex-preferred-size:75%;flex-basis:75%;max-width:75%}.col-xs-10{-ms-flex-preferred-size:83.33333333%;flex-basis:83.33333333%;max-width:83.33333333%}.col-xs-11{-ms-flex-preferred-size:91.66666667%;flex-basis:91.66666667%;max-width:91.66666667%}.col-xs-12{-ms-flex-preferred-size:100%;flex-basis:100%;max-width:100%}.col-xs-offset-0{margin-left:0}.col-xs-offset-1{margin-left:8.33333333%}.col-xs-offset-2{margin-left:16.66666667%}.col-xs-offset-3{margin-left:25%}.col-xs-offset-4{margin-left:33.33333333%}.col-xs-offset-5{margin-left:41.66666667%}.col-xs-offset-6{margin-left:50%}.col-xs-offset-7{margin-left:58.33333333%}.col-xs-offset-8{margin-left:66.66666667%}.col-xs-offset-9{margin-left:75%}.col-xs-offset-10{margin-left:83.33333333%}.col-xs-offset-11{margin-left:91.66666667%}.start-xs{-ms-flex-pack:start;justify-content:flex-start;text-align:start}.center-xs{-ms-flex-pack:center;justify-content:center;text-align:center}.end-xs{-ms-flex-pack:end;justify-content:flex-end;text-align:end}.top-xs{-ms-flex-align:start;align-items:flex-start}.middle-xs{-ms-flex-align:center;align-items:center}.bottom-xs{-ms-flex-align:end;align-items:flex-end}.around-xs{-ms-flex-pack:distribute;justify-content:space-around}.between-xs{-ms-flex-pack:justify;justify-content:space-between}.first-xs{-ms-flex-order:-1;order:-1}.last-xs{-ms-flex-order:1;order:1}@media only screen and (min-width: 48em){.container{width:49rem}.col-sm,.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm-offset-0,.col-sm-offset-1,.col-sm-offset-2,.col-sm-offset-3,.col-sm-offset-4,.col-sm-offset-5,.col-sm-offset-6,.col-sm-offset-7,.col-sm-offset-8,.col-sm-offset-9,.col-sm-offset-10,.col-sm-offset-11,.col-sm-offset-12{box-sizing:border-box;-ms-flex:0 0 auto;flex:0 0 auto;padding-right:0.5rem;padding-left:0.5rem}.col-sm{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-ms-flex-preferred-size:0;flex-basis:0;max-width:100%}.col-sm-1{-ms-flex-preferred-size:8.33333333%;flex-basis:8.33333333%;max-width:8.33333333%}.col-sm-2{-ms-flex-preferred-size:16.66666667%;flex-basis:16.66666667%;max-width:16.66666667%}.col-sm-3{-ms-flex-preferred-size:25%;flex-basis:25%;max-width:25%}.col-sm-4{-ms-flex-preferred-size:33.33333333%;flex-basis:33.33333333%;max-width:33.33333333%}.col-sm-5{-ms-flex-preferred-size:41.66666667%;flex-basis:41.66666667%;max-width:41.66666667%}.col-sm-6{-ms-flex-preferred-size:50%;flex-basis:50%;max-width:50%}.col-sm-7{-ms-flex-preferred-size:58.33333333%;flex-basis:58.33333333%;max-width:58.33333333%}.col-sm-8{-ms-flex-preferred-size:66.66666667%;flex-basis:66.66666667%;max-width:66.66666667%}.col-sm-9{-ms-flex-preferred-size:75%;flex-basis:75%;max-width:75%}.col-sm-10{-ms-flex-preferred-size:83.33333333%;flex-basis:83.33333333%;max-width:83.33333333%}.col-sm-11{-ms-flex-preferred-size:91.66666667%;flex-basis:91.66666667%;max-width:91.66666667%}.col-sm-12{-ms-flex-preferred-size:100%;flex-basis:100%;max-width:100%}.col-sm-offset-0{margin-left:0}.col-sm-offset-1{margin-left:8.33333333%}.col-sm-offset-2{margin-left:16.66666667%}.col-sm-offset-3{margin-left:25%}.col-sm-offset-4{margin-left:33.33333333%}.col-sm-offset-5{margin-left:41.66666667%}.col-sm-offset-6{marLine truncated
+.container-fluid,.container{margin-right:auto;margin-left:auto}.container-fluid{padding-right:2rem;padding-left:2rem}.row{box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex:0 1 auto;flex:0 1 auto;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-right:-0.5rem;margin-left:-0.5rem}.row.reverse{-ms-flex-direction:row-reverse;flex-direction:row-reverse}.col.reverse{-ms-flex-direction:column-reverse;flex-direction:column-reverse}.col-xs,.col-xs-1,.col-xs-2,.col-xs-3,.col-xs-4,.col-xs-5,.col-xs-6,.col-xs-7,.col-xs-8,.col-xs-9,.col-xs-10,.col-xs-11,.col-xs-12,.col-xs-offset-0,.col-xs-offset-1,.col-xs-offset-2,.col-xs-offset-3,.col-xs-offset-4,.col-xs-offset-5,.col-xs-offset-6,.col-xs-offset-7,.col-xs-offset-8,.col-xs-offset-9,.col-xs-offset-10,.col-xs-offset-11,.col-xs-offset-12{box-sizing:border-box;-ms-flex:0 0 auto;flex:0 0 auto;padding-right:0.5rem;padding-left:0.5rem}.col-xs{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-ms-flex-preferred-size:0;flex-basis:0;max-width:100%}.col-xs-1{-ms-flex-preferred-size:8.33333333%;flex-basis:8.33333333%;max-width:8.33333333%}.col-xs-2{-ms-flex-preferred-size:16.66666667%;flex-basis:16.66666667%;max-width:16.66666667%}.col-xs-3{-ms-flex-preferred-size:25%;flex-basis:25%;max-width:25%}.col-xs-4{-ms-flex-preferred-size:33.33333333%;flex-basis:33.33333333%;max-width:33.33333333%}.col-xs-5{-ms-flex-preferred-size:41.66666667%;flex-basis:41.66666667%;max-width:41.66666667%}.col-xs-6{-ms-flex-preferred-size:50%;flex-basis:50%;max-width:50%}.col-xs-7{-ms-flex-preferred-size:58.33333333%;flex-basis:58.33333333%;max-width:58.33333333%}.col-xs-8{-ms-flex-preferred-size:66.66666667%;flex-basis:66.66666667%;max-width:66.66666667%}.col-xs-9{-ms-flex-preferred-size:75%;flex-basis:75%;max-width:75%}.col-xs-10{-ms-flex-preferred-size:83.33333333%;flex-basis:83.33333333%;max-width:83.33333333%}.col-xs-11{-ms-flex-preferred-size:91.66666667%;flex-basis:91.66666667%;max-width:91.66666667%}.col-xs-12{-ms-flex-preferred-size:100%;flex-basis:100%;max-width:100%}.col-xs-offset-0{margin-left:0}.col-xs-offset-1{margin-left:8.33333333%}.col-xs-offset-2{margin-left:16.66666667%}.col-xs-offset-3{margin-left:25%}.col-xs-offset-4{margin-left:33.33333333%}.col-xs-offset-5{margin-left:41.66666667%}.col-xs-offset-6{margin-left:50%}.col-xs-offset-7{margin-left:58.33333333%}.col-xs-offset-8{margin-left:66.66666667%}.col-xs-offset-9{margin-left:75%}.col-xs-offset-10{margin-left:83.33333333%}.col-xs-offset-11{margin-left:91.66666667%}.start-xs{-ms-flex-pack:start;justify-content:flex-start;text-align:start}.center-xs{-ms-flex-pack:center;justify-content:center;text-align:center}.end-xs{-ms-flex-pack:end;justify-content:flex-end;text-align:end}.top-xs{-ms-flex-align:start;align-items:flex-start}.middle-xs{-ms-flex-align:center;align-items:center}.bottom-xs{-ms-flex-align:end;align-items:flex-end}.around-xs{-ms-flex-pack:distribute;justify-content:space-around}.between-xs{-ms-flex-pack:justify;justify-content:space-between}.first-xs{-ms-flex-order:-1;order:-1}.last-xs{-ms-flex-order:1;order:1}@media only screen and (min-width: 48em){.container{width:49rem}.col-sm,.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm-offset-0,.col-sm-offset-1,.col-sm-offset-2,.col-sm-offset-3,.col-sm-offset-4,.col-sm-offset-5,.col-sm-offset-6,.col-sm-offset-7,.col-sm-offset-8,.col-sm-offset-9,.col-sm-offset-10,.col-sm-offset-11,.col-sm-offset-12{box-sizing:border-box;-ms-flex:0 0 auto;flex:0 0 auto;padding-right:0.5rem;padding-left:0.5rem}.col-sm{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-ms-flex-preferred-size:0;flex-basis:0;max-width:100%}.col-sm-1{-ms-flex-preferred-size:8.33333333%;flex-basis:8.33333333%;max-width:8.33333333%}.col-sm-2{-ms-flex-preferred-size:16.66666667%;flex-basis:16.66666667%;max-width:16.66666667%}.col-sm-3{-ms-flex-preferred-size:25%;flex-basis:25%;max-width:25%}.col-sm-4{-ms-flex-preferred-size:33.33333333%;flex-basis:33.33333333%;max-width:33.33333333%}.col-sm-5{-ms-flex-preferred-size:41.66666667%;flex-basis:41.66666667%;max-width:41.66666667%}.col-sm-6{-ms-flex-preferred-size:50%;flex-basis:50%;max-width:50%}.col-sm-7{-ms-flex-preferred-size:58.33333333%;flex-basis:58.33333333%;max-width:58.33333333%}.col-sm-8{-ms-flex-preferred-size:66.66666667%;flex-basis:66.66666667%;max-width:66.66666667%}.col-sm-9{-ms-flex-preferred-size:75%;flex-basis:75%;max-width:75%}.col-sm-10{-ms-flex-preferred-size:83.33333333%;flex-basis:83.33333333%;max-width:83.33333333%}.col-sm-11{-ms-flex-preferred-size:91.66666667%;flex-basis:91.66666667%;max-width:91.66666667%}.col-sm-12{-ms-flex-preferred-size:100%;flex-basis:100%;max-width:100%}.col-sm-offset-0{margin-left:0}.col-sm-offset-1{margin-left:8.33333333%}.col-sm-offset-2{margin-left:16.66666667%}.col-sm-offset-3{margin-left:25%}.col-sm-offset-4{margin-left:33.33333333%}.col-sm-offset-5{margin-left:41.66666667%}.col-sm-offset-6{marLine truncated
- * animate.css -http://daneden.me/animate
- * Version - 3.5.1
- * Licensed under the MIT license - http://opensource.org/licenses/MIT
- *
- * Copyright (c) 2016 Daniel Eden
- */.animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.animated.infinite{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}.animated.hinge{-webkit-animation-duration:2s;animation-duration:2s}.animated.bounceIn,.animated.bounceOut,.animated.flipOutX,.animated.flipOutY{-webkit-animation-duration:.75s;animation-duration:.75s}@-webkit-keyframes bounce{0%,20%,53%,80%,to{-webkit-animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1);animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1);-webkit-transform:translateZ(0);transform:translateZ(0)}40%,43%{-webkit-transform:translate3d(0, -30px, 0);transform:translate3d(0, -30px, 0)}40%,43%,70%{-webkit-animation-timing-function:cubic-bezier(0.755, 0.05, 0.855, 0.06);animation-timing-function:cubic-bezier(0.755, 0.05, 0.855, 0.06)}70%{-webkit-transform:translate3d(0, -15px, 0);transform:translate3d(0, -15px, 0)}90%{-webkit-transform:translate3d(0, -4px, 0);transform:translate3d(0, -4px, 0)}}@keyframes bounce{0%,20%,53%,80%,to{-webkit-animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1);animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1);-webkit-transform:translateZ(0);transform:translateZ(0)}40%,43%{-webkit-transform:translate3d(0, -30px, 0);transform:translate3d(0, -30px, 0)}40%,43%,70%{-webkit-animation-timing-function:cubic-bezier(0.755, 0.05, 0.855, 0.06);animation-timing-function:cubic-bezier(0.755, 0.05, 0.855, 0.06)}70%{-webkit-transform:translate3d(0, -15px, 0);transform:translate3d(0, -15px, 0)}90%{-webkit-transform:translate3d(0, -4px, 0);transform:translate3d(0, -4px, 0)}}.bounce{-webkit-animation-name:bounce;animation-name:bounce;-webkit-transform-origin:center bottom;transform-origin:center bottom}@-webkit-keyframes flash{0%,50%,to{opacity:1}25%,75%{opacity:0}}@keyframes flash{0%,50%,to{opacity:1}25%,75%{opacity:0}}.flash{-webkit-animation-name:flash;animation-name:flash}@-webkit-keyframes pulse{0%{-webkit-transform:scaleX(1);transform:scaleX(1)}50%{-webkit-transform:scale3d(1.05, 1.05, 1.05);transform:scale3d(1.05, 1.05, 1.05)}to{-webkit-transform:scaleX(1);transform:scaleX(1)}}@keyframes pulse{0%{-webkit-transform:scaleX(1);transform:scaleX(1)}50%{-webkit-transform:scale3d(1.05, 1.05, 1.05);transform:scale3d(1.05, 1.05, 1.05)}to{-webkit-transform:scaleX(1);transform:scaleX(1)}}.pulse{-webkit-animation-name:pulse;animation-name:pulse}@-webkit-keyframes rubberBand{0%{-webkit-transform:scaleX(1);transform:scaleX(1)}30%{-webkit-transform:scale3d(1.25, 0.75, 1);transform:scale3d(1.25, 0.75, 1)}40%{-webkit-transform:scale3d(0.75, 1.25, 1);transform:scale3d(0.75, 1.25, 1)}50%{-webkit-transform:scale3d(1.15, 0.85, 1);transform:scale3d(1.15, 0.85, 1)}65%{-webkit-transform:scale3d(0.95, 1.05, 1);transform:scale3d(0.95, 1.05, 1)}75%{-webkit-transform:scale3d(1.05, 0.95, 1);transform:scale3d(1.05, 0.95, 1)}to{-webkit-transform:scaleX(1);transform:scaleX(1)}}@keyframes rubberBand{0%{-webkit-transform:scaleX(1);transform:scaleX(1)}30%{-webkit-transform:scale3d(1.25, 0.75, 1);transform:scale3d(1.25, 0.75, 1)}40%{-webkit-transform:scale3d(0.75, 1.25, 1);transform:scale3d(0.75, 1.25, 1)}50%{-webkit-transform:scale3d(1.15, 0.85, 1);transform:scale3d(1.15, 0.85, 1)}65%{-webkit-transform:scale3d(0.95, 1.05, 1);transform:scale3d(0.95, 1.05, 1)}75%{-webkit-transform:scale3d(1.05, 0.95, 1);transform:scale3d(1.05, 0.95, 1)}to{-webkit-transform:scaleX(1);transform:scaleX(1)}}.rubberBand{-webkit-animation-name:rubberBand;animation-name:rubberBand}@-webkit-keyframes shake{0%,to{-webkit-transform:translateZ(0);transform:translateZ(0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(-10px, 0, 0);transform:translate3d(-10px, 0, 0)}20%,40%,60%,80%{-webkit-transform:translate3d(10px, 0, 0);transform:translate3d(10px, 0, 0)}}@keyframes shake{0%,to{-webkit-transform:translateZ(0);transform:translateZ(0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(-10px, 0, 0);transform:translate3d(-10px, 0, 0)}20%,40%,60%,80%{-webkit-transform:translate3d(10px, 0, 0);transform:translate3d(10px, 0, 0)}}.shake{-webkit-animation-name:shake;animation-name:shake}@-webkit-keyframes headShake{0%{-webkit-transform:translateX(0);transform:translateX(0)}6.5%{-webkit-transform:translateX(-6px) rotateY(-9deg);transform:translateX(-6px) rotateY(-9deg)}18.5%{-webkit-transform:translateX(5px) rotateY(7deg);transform:translateX(5px) rotateY(7deg)}31.5%{-webkit-transform:translateX(-3px) rotateY(-5deg);transform:translateX(-3px) rotateY(-5deg)}43.5%{-webkit-transform:translateX(2px) rotateY(3deg);transform:translateX(2px) rotateY(3deg)}50%{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes headShake{0%{-webkit-transform:translateX(0);transform:translateX(0)}6.5%{-webkit-transform:translateX(-6px) rotateY(-9deg);transform:translateX(-6px) rotateY(-9deg)}18.5%{-webkit-transform:translateX(5px) rotateY(7deg);transform:translateX(5px) rotateY(7deg)}31.5%{-webkit-transform:trLine truncated

static/js/homepage.js

@@ -7,6 +7,7 @@ $(document).ready(function() {
     offset2 = offset1 * 2,
     scrolled1 = false,
     scrolled2 = false,
+    atTop = true,
     terminal = $('.homepage-terminal'),
     firstFade = $('.first-fade'),
     gopher = $('#gopher'),
@@ -14,6 +15,13 @@ $(document).ready(function() {
     badge = $('.gopher-badge');
   $(window).scroll(function() {
     let scroll = $(this).scrollTop();
+    if (scroll > 20 && atTop == true) {
+      $('#homepage-nav').addClass('shadow');
+      atTop = false;
+    }else if (scroll < 20) {
+      $('#homepage-nav').removeClass('shadow');
+      atTop = true;
+    }
     if (scroll > offset1 && scrolled1 == false) {
       firstFade.addClass('fadeIn');
       scrolled1 = true;