• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1page.title=Design
2page.viewport_width=970
3section.landing=true
4meta.tags="beautifulapps, design, ux, patterns, holo, appquality, landing"
5header.hide=1
6footer.hide=1
7@jd:body
8
9<style>
10#landing-graphic-container {
11  position: relative;
12}
13
14#text-overlay {
15  position: absolute;
16  left: 0;
17  top: 42px;
18  width: 266px;
19
20}
21#hero-image {
22  padding-left:68px;
23}
24</style>
25
26<div id="landing-graphic-container">
27  <div id="text-overlay">
28    <span itemprop="description">Welcome to <strong>Android Design</strong>, your place for
29    learning how to design exceptional Android apps.</span>
30    <br><br>
31    Want to know what <strong>Android 5.0</strong> has for designers? See <a href="{@docRoot}design/patterns/new.html">New in Android</a>.<br><br>
32    <a href="/design/get-started/creative-vision.html" class="landing-page-link">Creative Vision</a>
33  </div>
34  <a id="hero-image" href="/design/get-started/creative-vision.html">
35    <img src="{@docRoot}design/media/index_landing_page.png" width="760" height="600" alt=""
36         srcset="{@docRoot}design/media/index_landing_page_2x.png 2x"/>
37  </a>
38
39<div style="background: hsl(8, 70%, 54%); margin: 0; padding: 20px 20px 10px 20px;color: #fff; position: absolute;top: 255px;width: 179px;">
40<h2 style="color: #fff;margin:0 0 10px; font-size:18px" class="norule">Material Design</h2>
41<p>Android 5.0 introduces a design
42metaphor inspired by paper and ink that provides a reassuring sense of tactility.
43</p>
44<p><a class="white" href="{@docRoot}design/material/index.html">Learn more</a></p>
45</div>
46
47</div>
48
49