Revise page header styles

- more compact headers when announcements are showing
- when no announcement showing, top level docs sections
  (eg Concepts, Tasks, Reference) have a heading in the top nav
- when announcement is showing, rely on the breadcrumb trail plus
  page introduction text for each top level section
- switch from plain black docs header to match other sections

layouts/docs/baseof.html

@@ -8,7 +8,11 @@
     <header>
       {{ partial "navbar.html" . }}
       {{ partial "announcement.html" . }}
-      <div class="header-filler"></div>
+      {{ block "hero" . }}
+        <section class="header-hero filler">
+        </section>
+         {{ block "hero-more" . }}{{ end }}
+      {{ end }}
     </header>
     <div class="container-fluid td-outer">
       <div class="td-main">
@@ -41,8 +45,8 @@
           </div>
         </div>
       </div>
-      {{ partial "footer.html" . }}
     </div>
+    {{ partial "footer.html" . }}
     {{ partial "scripts.html" . }}
   </body>
 </html>

layouts/docs/docsportal_home.html

@@ -1,7 +1,4 @@
 {{ define "main" }}
-    {{ if not .Params.notitle }}
-	 <h1>{{ .Title }}</h1>
-    {{ end }}
     {{ template "docs-portal-content" . }}
 {{ end }}
 
@@ -19,4 +16,11 @@
     </div>
   </div>
 </section>
-{{ end }}
+{{ end }}
+{{ define "hero" }}
+    <section class="header-hero text-white pb-4 light-text ">
+    {{ if not .Params.notitle }}
+    <h1>{{ .Title }}</h1>
+    {{ end }}
+    </section>
+{{ end }}

layouts/docs/list.html

@@ -1,17 +1,43 @@
 {{ define "main" }}
-	<div class="td-content">
-		{{ $hasContent := false }}
-		{{ with .File }}
-			{{ if ne .Filename "" }}
-				{{ $hasContent =  (ge (len $.RawContent) 100) }}
-			{{ end }}
-		{{ end }}
-		{{ if $hasContent }}
-			{{ partial "docs/content-page" (dict "ctx" $ "page" $ ) }}
-		{{ else }}
-			<h1>{{ .Title }}</h1>
-			{{ with .Params.description }}<div class="lead">{{ . | markdownify }}</div>{{ end }}
-		{{ end }}
-		{{ partial "section-index.html" . }}
-	</div>
+{{- $child_of_first_section := false -}}
+{{- with .Parent -}}
+{{- if eq .CurrentSection .FirstSection -}}
+{{- $child_of_first_section = true -}}
+{{- end -}}
+{{- end -}}
+    <div class="td-content">
+        {{ $hasContent := false }}
+        {{ with .File }}
+            {{ if ne .Filename "" }}
+                {{ $hasContent =  (ge (len $.RawContent) 100) }}
+            {{ end }}
+        {{ end }}
+        {{ if $hasContent }}
+            {{- if $child_of_first_section -}}
+            {{ partial "docs/top-section-page" (dict "ctx" $ "page" $ ) }}
+            {{- else -}}
+            {{ partial "docs/content-page" (dict "ctx" $ "page" $ ) }}
+            {{- end -}}
+        {{ else }}
+            <h1>{{ .Title }}</h1>
+            {{ with .Params.description }}<div class="lead">{{ . | markdownify }}</div>{{ end }}
+        {{ end }}
+        {{ partial "section-index.html" . }}
+    </div>
+{{ end }}
+{{ define "hero" }}
+{{- $child_of_first_section := false -}}
+{{- with .Parent -}}
+{{- if eq .CurrentSection .FirstSection -}}
+{{- $child_of_first_section = true -}}
+{{- end -}}
+{{- end -}}
+{{- if $child_of_first_section -}}
+        <section class="header-hero text-white pb-4 light-text ">
+           <h1>{{ .Title }}</h1>
+        </section>
+{{- else -}}
+        <section class="header-hero filler">
+        </section>
+{{- end -}}
 {{ end }}

layouts/docs/single.html

@@ -1,4 +1,12 @@
 {{ define "main" }}
     <div class="td-content">
     {{ partial "docs/content-page" (dict "ctx" . "page" .) }}
+    </div>
+{{ end }}
+{{ define "hero-more" }}
+{{ if .IsHome }}
+{{ with site.GetPage "section" "docs/tutorials/kubernetes-basics" }}
+<a href="{{ .RelPermalink }}" id="quickstartButton" class="button">{{ .LinkTitle }}</a>
+{{ end }}
+{{ end }}
 {{ end }}