add About pages to the quicknav and
tweak new h1 styles and move training navbar down
so the page title can span the page width before wrapping

Change-Id: I517c29d8ee3a2d7347ae50ca47005b51c174fa1c
diff --git a/tools/droiddoc/templates-sdk/assets/css/default.css b/tools/droiddoc/templates-sdk/assets/css/default.css
index 9bfe3d5..cba6c6c 100644
--- a/tools/droiddoc/templates-sdk/assets/css/default.css
+++ b/tools/droiddoc/templates-sdk/assets/css/default.css
@@ -158,12 +158,6 @@
 .layout-content-row {
   display: inline-block;
   margin-bottom: 10px; }
-  .layout-content-row:after {
-    content: ".";
-    display: block;
-    height: 0;
-    clear: both;
-    visibility: hidden; }
   * html .layout-content-row {
     height: 1px; }
 
@@ -430,17 +424,19 @@
 /* content header */
 .content-header {
   height: 30px;
-  margin:20px 0 25px;
-  padding:0 0 10px;}
+  margin:36px 0 23px;  /* same as h1 */
+  padding:0 0 10px;}  /* same as h1 */
 .content-header.just-links {
   margin-bottom:0;
   padding-bottom:0;}
 
 .content-header h1 {
-  margin-top:16px; /* +20px from div.content header == 34px */
+  margin:0;
+  padding:0;
+  width: 700px;
 }
 .content-header > div:first-child {
-  height:55px; /* set fixed height for the header div to ensure the
+  height:1px; /* set fixed height for the header div to ensure the
                   next/prev links align with toc on training classes */
 }
 
@@ -1101,12 +1097,12 @@
 h1 {
     color:#333;
     font-size: 34px;
-    margin: 36px 0 12px;
+    margin: 36px 0 27px;
     padding:0 0 10px;
     font-weight:300;
 }
 h1, h2 {
-    line-height: 34px;
+    line-height: 30px;
 }
 h1.short {
   margin-right:320px;
@@ -1840,6 +1836,11 @@
   margin:0 0 0 20px;
 }
 
+.training-nav-top {
+  position:relative;
+  top:73px;
+}
+
 .training-nav-bottom {
   padding:0 0 20px;
 }
@@ -1848,12 +1849,12 @@
 #qv-wrapper {
   float:right;
   clear:right;
-  margin:0 0 0 30px; /* negative top-margin to counter the content-header bottom margin */
+  margin:6px 0 0 30px; /* negative top-margin to counter the content-header bottom margin */
   padding:0 0 30px;
 }
 
 #tb-wrapper {
-  margin:-29px 0 0 20px; /* negative top-margin to counter the content-header bottom margin */
+  margin:51px 0 0 20px; /* negative top-margin to counter the content-header bottom margin */
 }
 
 #tb,
@@ -4247,7 +4248,7 @@
 #quicknav {
  float:none;
  clear:both;
- margin-left:180px;
+ margin-left:0;
  margin-top:-30px;
  display:none;
  overflow:hidden;
@@ -4262,6 +4263,10 @@
   padding:0;
 }
 
+#quicknav ul li.about {
+  border-top:1px solid #9933CC;
+}
+
 #quicknav ul li.design {
   border-top:1px solid #33b5e5;
 }
diff --git a/tools/droiddoc/templates-sdk/components/masthead.cs b/tools/droiddoc/templates-sdk/components/masthead.cs
index 6c71193..8dc6ed9 100644
--- a/tools/droiddoc/templates-sdk/components/masthead.cs
+++ b/tools/droiddoc/templates-sdk/components/masthead.cs
@@ -51,8 +51,16 @@
 
 
         <!-- Expanded quicknav -->
-        <div id="quicknav" class="col-9">
+        <div id="quicknav" class="col-13">
           <ul>
+            <li class="about">
+              <ul>
+                <li><a href="<?cs var:toroot ?>about/index.html">About</a></li>
+                <li><a href="<?cs var:toroot ?>wear/index.html">Wear</a></li>
+                <li><a href="<?cs var:toroot ?>tv/index.html">TV</a></li>
+                <li><a href="<?cs var:toroot ?>auto/index.html">Auto</a></li>
+              </ul>
+            </li>
             <li class="design">
               <ul>
                 <li><a href="<?cs var:toroot ?>design/index.html">Get Started</a></li>
diff --git a/tools/droiddoc/templates-sdk/docpage.cs b/tools/droiddoc/templates-sdk/docpage.cs
index f6e1cac..97ad8f1 100644
--- a/tools/droiddoc/templates-sdk/docpage.cs
+++ b/tools/droiddoc/templates-sdk/docpage.cs
@@ -90,7 +90,7 @@
       </div>
     <?cs /if ?><?cs # end if training ?>
   </div>
-  <?cs /if ?>
+  <?cs /if ?><?cs # end if header.hide ?>
 
 <?cs elif:samplesProjectIndex ?>
   <div id="api-info-block">
@@ -103,7 +103,14 @@
   <h1 itemprop="name"><?cs var:projectDir ?></h1>
 
 <?cs else ?>
-
+  <?cs if:training ?>
+<?cs # horrible horrible hack to move TOC up when the next/prev links are not there ?>
+<style>
+  #tb-wrapper {
+    margin-top:6px;
+  }
+</style>
+  <?cs /if ?>
 
   <?cs if:(!fullpage && !header.hide) ?>
     <?cs if:page.landing ?><?cs # header logic for docs that are landing pages ?>