Donate to e Foundation | Murena handsets with /e/OS | Own a part of Murena! Learn more

Commit 857d5809 authored by Dirk Dougherty's avatar Dirk Dougherty Committed by Android (Google) Code Review
Browse files

Merge "Doc change: Design guidelines update." into klp-dev

parents ec11e8dd 0b734038
Loading
Loading
Loading
Loading
+2 −8
Original line number Diff line number Diff line
@@ -54,14 +54,8 @@ page.tags="progressbar","download","network"
        <p>In this example, an activity circle (in Holo Light) is used in the Gmail application when a message is being loaded because it's not possible to determine how long it will take to download the email.</p>
        <p>When displaying an activity circle, do not include text to communicate what the app is doing. The moving circle alone provides sufficient feedback about the delay, and does so in an understated way that minimizes the impact.</p>
        <p>
        <div class="layout-content-col span-3" style="margin-left:0">
          <div class="do-dont-label bad">Don't</div>
          <img src="{@docRoot}design/media/progress_activity_dont.png">
        </div>
      
        <div class="layout-content-col span-3">
          <div class="do-dont-label good">Do</div>
          <img src="{@docRoot}design/media/progress_activity_do.png">
        <div style="margin-left:0;margin-top:1em;">
          <img src="{@docRoot}design/media/progress_activity_do_dont.png">
        </div>
        </p>
      </li>
+2 −2
Original line number Diff line number Diff line
@@ -8,7 +8,7 @@ scrolling speed is proportional to the speed of the gesture.</p>

<p>Appears during scrolling to indicate what portion of the content is currently in view.</p>

<div class="framed-galaxynexus-land-span-13">
<div class="framed-nexus5-land-span-13">
  <video class="play-on-hover" autoplay>
    <source src="{@docRoot}design/media/scroll_indicator.mp4" type="video/mp4">
    <source src="{@docRoot}design/media/scroll_indicator.webm" type="video/webm">
@@ -26,7 +26,7 @@ to quickly navigate to the items that begin with a particular letter. With index
indicator appears even when the user isn't scrolling. Touching or dragging it causes the current
letter to pop up in a prominent way.</p>

<div class="framed-galaxynexus-land-span-13">
<div class="framed-nexus5-land-span-13">
  <video class="play-on-hover" autoplay>
    <source src="{@docRoot}design/media/scroll_index.mp4" type="video/mp4">
    <source src="{@docRoot}design/media/scroll_index.webm" type="video/webm">
+1 −12
Original line number Diff line number Diff line
@@ -35,7 +35,7 @@ to the next/previous view, swipe left or right.</p>
    </video>
    <div class="figure-caption">
      Scrolling tabs in the Play Store app.
      <div class="video-instructions">&nbsp;</div>
      <div class="video-instructions-image">&nbsp;</div>
    </div>

  </div>
@@ -55,14 +55,3 @@ to the next/previous view, swipe left or right.</p>
<div class="figure-caption">
  Tabs in the Google Play Movies app.
</div>



<h2 id="stacked">Stacked Tabs</h2>


<p>If view navigation is essential to your app, you can break out tabs into a separate action bar. This
permits fast view switching even on narrower screens.</p>

<img src="{@docRoot}design/media/tabs_stacked.png">
+2 −0
Original line number Diff line number Diff line
@@ -19,6 +19,7 @@
      <li><a href="<?cs var:toroot ?>design/style/typography.html">Typography</a></li>
      <li><a href="<?cs var:toroot ?>design/style/color.html">Color</a></li>
      <li><a href="<?cs var:toroot ?>design/style/iconography.html">Iconography</a></li>
      <li><a href="<?cs var:toroot ?>design/style/branding.html">Your Branding</a></li>
      <li><a href="<?cs var:toroot ?>design/style/writing.html">Writing Style</a></li>
    </ul>
  </li>
@@ -34,6 +35,7 @@
      <li><a href="<?cs var:toroot ?>design/patterns/navigation-drawer.html">Navigation Drawer</a></li>
      <li><a href="<?cs var:toroot ?>design/patterns/multi-pane-layouts.html">Multi-pane Layouts</a></li>
      <li><a href="<?cs var:toroot ?>design/patterns/swipe-views.html">Swipe Views</a></li>
      <li><a href="<?cs var:toroot ?>design/patterns/fullscreen.html">Full Screen</a></li>
      <li><a href="<?cs var:toroot ?>design/patterns/selection.html">Selection</a></li>
      <li><a href="<?cs var:toroot ?>design/patterns/confirming-acknowledging.html">Confirming &amp; Acknowledging</a></li>
      <li><a href="<?cs var:toroot ?>design/patterns/notifications.html">Notifications</a></li>
+2 −2
Original line number Diff line number Diff line
@@ -102,9 +102,9 @@ requirements of UI and high-resolution screens.</p>

<p>
  <a class="download-button"  onClick="_gaq.push(['_trackEvent', 'Design', 'Download', 'Roboto ZIP']);"
    href="{@docRoot}downloads/design/roboto-1.100141.zip">Roboto</a>
    href="{@docRoot}downloads/design/roboto-1.2.zip">Roboto</a>
  <a class="download-button"  onClick="_gaq.push(['_trackEvent', 'Design', 'Download', 'Roboto Specemin Book']);"
    href="{@docRoot}downloads/design/Roboto_Specimen_Book_20111129.pdf">Specimen Book</a>
    href="{@docRoot}downloads/design/Roboto_Specimen_Book_20131031.pdf">Specimen Book</a>
</p>

  </div>
Loading