Merge pull request #117 from angular/mobile-fixes

Updates for mobile list styles and layout

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 })

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 })

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 })

public/resources/css/_state.scss

@@ -21,4 +21,4 @@
   bottom: 0px;
   right: 0px;
   z-index: $layer-1;
-}
+}

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,

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);