From 05ce97b4a0a08045f8bf6065ec04cdc770addef3 Mon Sep 17 00:00:00 2001
From: Tim Hinrichs <tim@styra.com>
Date: Fri, 30 Aug 2019 08:37:50 -0700
Subject: [PATCH] docs: Add links to homepage

Previously, there were no links from the homepage to any of the
more detailed docs about use cases and even mention of use cases
was below the fold.

This change adds links to use cases at the very top of the page,
along with pointers to core docs and the OPA summit.

Signed-off-by: Tim Hinrichs <tim@styra.com>
---
 .../website/layouts/partials/home/banner.html | 47 ++++++++++++++++---
 docs/website/static/css/home.css              | 26 ++++++----
 2 files changed, 57 insertions(+), 16 deletions(-)

diff --git a/docs/website/layouts/partials/home/banner.html b/docs/website/layouts/partials/home/banner.html
index 2081961f84..8cdb4ed4f7 100644
--- a/docs/website/layouts/partials/home/banner.html
+++ b/docs/website/layouts/partials/home/banner.html
@@ -3,7 +3,14 @@
 {{ $tagline     := site.Params.tagline }}
 {{ $socialMenu  := site.Menus.social }}
 {{ $docs        := "/docs/latest/" }}
-{{ $getStarted  := "/docs/latest/get-started/" }}
+{{ $introduction  := "/docs/latest/" }}
+{{ $tutorial  := "/docs/latest/get-started/" }}
+{{ $policyLanguage  := "/docs/latest/policy-language/" }}
+{{ $kubernetes  := "/docs/latest/kubernetes-introduction/" }}
+{{ $microservices  := "/docs/latest/http-api-authorization/" }}
+{{ $kafka  := "/docs/latest/kafka-authorization/" }}
+{{ $terraform  := "/docs/latest/terraform/" }}
+{{ $opaSummit  := "https://www.papercall.io/opa-summit" }}
 <header role="banner">
   <nav class="nav--banner" role="navigation">
     <ul class="nav--menu">
@@ -20,7 +27,7 @@
       </li>
 
       <li class="nav--menu-item nav--docs">
-        <a href="{{ $getStarted }}" rel="help">
+        <a href="{{ $tutorial }}" rel="help">
           Tutorials
         </a>
       </li>
@@ -63,13 +70,39 @@
       </p>
 
       <p class="headline--nav">
-        <a id="headline--get-started" href="{{ $getStarted }}" rel="help">
-          Get started
+        <span class="headline--navtitle">Core Docs</span>  
+        <a id="headline--get-started" class="headline--link" href="{{ $introduction }}" rel="help">
+          Introduction
         </a>
+        <a class="headline--link" href="{{ $tutorial }}" rel="help">
+          Tutorial
+        </a>
+        <a class="headline--link" href="{{ $policyLanguage }}" rel="help">
+          Policy Language
+        </a>
+      </p>
+      <p class="headline--nav">
+          <span class="headline--navtitle">Use Cases</span> 
+          <a class="headline--link" href="{{ $kubernetes }}" rel="help">
+            Kubernetes
+          </a>
+          <a class="headline--link" href="{{ $microservices }}" rel="help">
+            Microservice APIs
+          </a>
+          <a class="headline--link" href="{{ $kafka }}" rel="help">
+            Kafka
+          </a>
+          <a class="headline--link" href="{{ $terraform }}" rel="help">
+              Terraform
+          </a>
+      </p>
+      <p class="headline--nav">
+          <span class="headline--navtitle">Events</span> 
+          <a class="headline--link" href="{{ $opaSummit }}" rel="help">
+            OPA Summit
+          </a>
+      </p>
 
-        <a id="headline--learn-more" href="{{ $docs }}" rel="help">
-          Learn more
-        </a>
       </p>
     </div>
 
diff --git a/docs/website/static/css/home.css b/docs/website/static/css/home.css
index 483d91dd19..52925d9c18 100644
--- a/docs/website/static/css/home.css
+++ b/docs/website/static/css/home.css
@@ -77,12 +77,11 @@ p {
   margin-bottom: 1.3em;
 }
 
-ul, {
+ul {
   list-style: none;
 }
 
-#headline--get-started,
-#headline--learn-more {
+.headline--link {
   border: solid 2px #008391;
   border-radius: 6px;
   display: inline-block;
@@ -92,16 +91,25 @@ ul, {
   text-align: center;
   text-decoration: none;
   width: 180px;
-}
-
-#headline--get-started {
+  /* background-color: #fff;
+  color: #008391; */
   background-color: #008391;
   color: #fff;
 }
 
-#headline--learn-more {
-  background-color: #fff;
-  color: #008391;
+.headline--navtitle {
+  width: 100px;
+  float: left;
+  text-align: left;
+  vertical-align: middle;
+  line-height: 44px;
+  color: rgba(0, 0, 0, .54);
+  /* font-size: 1.25em; */
+
+}
+#headline--get-started {
+  background-color: #008391;
+  color: #fff;
 }
 
 footer {