From d135d1bf7e76c4a31ce7f469982c18016fcd51f6 Mon Sep 17 00:00:00 2001
From: Alex Wolfe <thewolfe@gmail.com>
Date: Sun, 17 May 2015 11:34:24 -0700
Subject: [PATCH] Updates for mobile list styles and layout

---
 public/docs/dart/latest/guide/index.jade |  4 ++--
 public/docs/js/latest/api/index.jade     | 19 +++++++++----------
 public/docs/js/latest/guide/index.jade   |  4 ++--
 public/resources/css/_state.scss         |  2 +-
 public/resources/css/base/_type.scss     |  5 +++++
 public/resources/css/layout/_layout.scss | 10 ++++++++++
 6 files changed, 29 insertions(+), 15 deletions(-)

diff --git a/public/docs/dart/latest/guide/index.jade b/public/docs/dart/latest/guide/index.jade
index 66aa7bf4dd..1fe63c7ec3 100644
--- a/public/docs/dart/latest/guide/index.jade
+++ b/public/docs/dart/latest/guide/index.jade
@@ -1,10 +1,10 @@
 number = 1;
-ul
+ul.is-plain.l-offset-page-header
   for page, slug in public.docs[current.path[1]][current.path[2]].guide._data
 
     if slug != '_listtype' && slug != 'index'
       url = "/docs/" + current.path[1] + "/" + current.path[2] + "/" + current.path[3] + "/" + slug + ".html"
       num = number++
 
-      li.c8
+      li
         != partial("../../../../_includes/_hover-card", { icon: "icon-number", number: num, name: page.title, url: url })
diff --git a/public/docs/js/latest/api/index.jade b/public/docs/js/latest/api/index.jade
index 222d706b25..56e1893a3f 100644
--- a/public/docs/js/latest/api/index.jade
+++ b/public/docs/js/latest/api/index.jade
@@ -1,19 +1,18 @@
-.l-main-section
+.callout.is-helpful.l-offset-page-header
+  header Developer Preview
 
-  .callout.is-helpful
-    header Developer Preview
-    p.
-      The Angular 2.0 API is currently in active development and not production ready.
-      This page showcases a preview of proposed methods to help further the discussion
-      in the development community. If you're building a production app today, please
-      <a href="https://docs.angularjs.org/api">use Angular 1.X</a>.
+  p.
+    The Angular 2.0 API is currently in active development and not production ready.
+    This page showcases a preview of proposed methods to help further the discussion
+    in the development community. If you're building a production app today, please
+    <a href="https://docs.angularjs.org/api">use Angular 1.X</a>.
 
-ul
+ul.is-plain.l-offset-page-header
   for page, slug in public.docs[current.path[1]][current.path[2]].api
     if slug != 'index' && slug != '_contents' && slug != '_data'
 
       url = "/docs/" + current.path[1] + "/" + current.path[2] + "/" + current.path[3] + "/" + slug
       title = public.docs[current.path[1]][current.path[2]][current.path[3]][slug]._data["index"]["title"]
 
-      li.c8
+      li
         != partial("../../../../_includes/_hover-card", {name: title, url: url })
diff --git a/public/docs/js/latest/guide/index.jade b/public/docs/js/latest/guide/index.jade
index 66aa7bf4dd..1fe63c7ec3 100644
--- a/public/docs/js/latest/guide/index.jade
+++ b/public/docs/js/latest/guide/index.jade
@@ -1,10 +1,10 @@
 number = 1;
-ul
+ul.is-plain.l-offset-page-header
   for page, slug in public.docs[current.path[1]][current.path[2]].guide._data
 
     if slug != '_listtype' && slug != 'index'
       url = "/docs/" + current.path[1] + "/" + current.path[2] + "/" + current.path[3] + "/" + slug + ".html"
       num = number++
 
-      li.c8
+      li
         != partial("../../../../_includes/_hover-card", { icon: "icon-number", number: num, name: page.title, url: url })
diff --git a/public/resources/css/_state.scss b/public/resources/css/_state.scss
index 0e1f1c71b3..f73cd6d573 100644
--- a/public/resources/css/_state.scss
+++ b/public/resources/css/_state.scss
@@ -21,4 +21,4 @@
   bottom: 0px;
   right: 0px;
   z-index: $layer-1;
-}
+}
\ No newline at end of file
diff --git a/public/resources/css/base/_type.scss b/public/resources/css/base/_type.scss
index 58798b999a..f92bd6ca5c 100644
--- a/public/resources/css/base/_type.scss
+++ b/public/resources/css/base/_type.scss
@@ -105,6 +105,11 @@ table th,
   font-weight: 400;
   opacity: .87;
   line-height: 28px;
+
+  &.is-plain {
+    list-style-type: none;
+    padding: 0px;
+  }
 }
 
 .l-sub-section p,
diff --git a/public/resources/css/layout/_layout.scss b/public/resources/css/layout/_layout.scss
index 9edd2fe87a..318808bbb0 100644
--- a/public/resources/css/layout/_layout.scss
+++ b/public/resources/css/layout/_layout.scss
@@ -67,6 +67,16 @@
   }
 }
 
+.l-offset-page-header {
+  margin-left: $unit * 6 !important;
+
+  @media handheld and (max-width: $phone-breakpoint),
+  screen and (max-device-width: $phone-breakpoint),
+  screen and (max-width: $tablet-breakpoint) {
+    margin: 0px !important;
+  }
+}
+
 .l-content {
   padding: ($unit * 8) ($unit * 12);