Files
build/tools/droiddoc/templates/assets/android-developer-core.css
Scott Main 398814fa75 am 5eb58327: AI 149839: make the home page\'s announcement block expandable... primarily, this is to handle various lengths of text due to translations, but also allows us to be more flexible WRT the content for the top section.
Merge commit '5eb5832751cad87021b9f1ad77f1c26952030884' into donut

* commit '5eb5832751cad87021b9f1ad77f1c26952030884':
  AI 149839: make the home page's announcement block expandable...
2009-06-14 20:45:16 -07:00

938 lines
13 KiB
CSS

/* file: android-developer-core.css
author: smain
date: september 2008
info: core developer styles (developer.android.com)
*/
/* RESET STYLES */
html,body,div,h1,h2,h3,h4,h5,h6,p,img,
dl,dt,dd,ol,ul,li,table,caption,tbody,
tfoot,thead,tr,th,td,form,fieldset,
embed,object,applet {
margin: 0;
padding: 0;
border: 0;
}
/* BASICS */
html, body {
overflow:hidden; /* keeps scrollbar off IE */
background-color:#fff;
}
body {
font-family:arial,sans-serif;
color:#000;
font-size:13px;
color:#333;
background-image:url(images/bg_fade.jpg);
background-repeat:repeat-x;
}
a, a code {
color:#006699;
}
a:active,
a:active code {
color:#f00;
}
a:visited,
a:visited code {
color:#006699;
}
input, select,
textarea, option {
font-family:inherit;
font-size:inherit;
}
p {
padding:0;
margin:0 0 1em;
}
code, pre {
color:#007000;
font-family:monospace;
line-height:1em;
}
var {
color:#007000;
font-style:italic;
}
pre {
border:1px solid #ccc;
background-color:#fafafa;
padding:10px;
margin:0 0 1em 1em;
overflow:auto;
}
h1,h2,h3,h4,h5 {
margin:1em 0;
padding:0;
}
p,ul,ol,dl,dd,dt,li {
line-height:1.3em;
}
ul,ol {
margin:0 0 .8em;
padding:0 0 0 2em;
}
li {
padding:0 0 .5em;
}
dl {
margin:0 0 1em 0;
padding:0;
}
dt {
margin:0;
padding:0;
}
dd {
margin:0 0 1em;
padding:0 0 0 2em;
}
li p {
margin:.5em 0 0;
}
dd p {
margin:1em 0 0;
}
li pre, li table, li img {
margin:.5em 0 0 1em;
}
dd pre, dd table, dd img {
margin:1em 0 0 1em;
}
li ul,
li ol {
margin:.5em 0 0 0;
padding: 0 0 0 2em;
}
dl li {
padding:.5em 0 0 0;
}
dl dl,
ol dl,
ul dl {
margin:0 0 1em;
padding:0;
}
table {
font-size:1em;
margin:0 0 1em;
padding:0;
border-collapse:collapse;
border-width:0;
empty-cells:show;
}
td,th {
border:1px solid #ccc;
padding:6px 12px;
text-align:left;
vertical-align:top;
background-color:inherit;
}
th {
background-color:#dee8f1;
}
hr.blue {
background-color:#DDF0F2;
border:none;
height:5px;
margin:20px 0 10px;
}
/* LAYOUT */
#body-content {
margin:0;
position:relative;
width:100%;
}
#header {
height: 114px;
position:relative;
z-index:100;
min-width:576px;
padding:0 10px;
border-bottom:3px solid #94b922;
}
#headerLeft{
padding: 25px 0 0;
}
#headerRight {
position:absolute;
right:0;
top:0;
text-align:right;
}
/* Tabs in the header */
#header ul {
list-style: none;
margin: 7px 0 0;
padding: 0;
height: 29px;
}
#header li {
float: left;
margin: 0px 2px 0px 0px;
padding:0;
}
#header li a {
text-decoration: none;
display: block;
background-image: url(images/bg_images_sprite.png);
background-position: 0 -58px;
background-repeat: no-repeat;
color: #666;
font-size: 13px;
font-weight: bold;
width: 94px;
height: 29px;
text-align: center;
margin: 0px;
}
#header li a:hover {
background-image: url(images/bg_images_sprite.png);
background-position: 0 -29px;
background-repeat: no-repeat;
}
#header li a span {
position:relative;
top:7px;
}
/* TAB HIGHLIGHTING */
.home #home-link a,
.publish #publish-link a,
.guide #guide-link a,
.reference #reference-link a,
.sdk #sdk-link a,
.community #community-link a,
.about #about-link a {
background-image: url(images/bg_images_sprite.png);
background-position: 0 0;
background-repeat: no-repeat;
color: #fff;
font-weight: bold;
cursor:default;
}
.home #home-link a:hover,
.publish #publish-link a:hover,
.guide #guide-link a:hover,
.reference #reference-link a:hover,
.sdk #sdk-link a:hover,
.community #community-link a:hover,
.about #about-link a:hover {
background-image: url(images/bg_images_sprite.png);
background-position: 0 0;
}
#headerLinks {
margin:10px 10px 0 0;
height:13px;
font-size: 11px;
vertical-align: top;
}
#headerLinks a {
color: #7FA9B5;
}
#language {
margin:0 10px;
}
#search {
height:45px;
margin:15px 10px 0 0;
}
/* main */
#mainBodyFluid {
margin: 20px 10px;
color:#333;
}
#mainBodyFixed {
margin: 20px 10px;
color: #333;
width:930px;
position:relative;
}
#mainBodyFixed h3,
#mainBodyFluid h3 {
color:#336666;
font-size:1.25em;
margin: 0em 0em 0em 0em;
padding-bottom:.5em;
}
#mainBodyFixed h2,
#mainBodyFluid h2 {
color:#336666;
font-size:1.25em;
margin: 0;
padding-bottom:.5em;
}
#mainBodyFixed h1,
#mainBodyFluid h1 {
color:#435A6E;
font-size:1.7em;
margin: 1em 0;
}
#mainBodyFixed .green,
#mainBodyFluid .green,
#jd-content .green {
color:#7BB026;
background-color:none;
}
#mainBodyLeft {
float: left;
width: 600px;
margin-right: 20px;
color: #333;
position:relative;
}
div.indent {
margin-left: 40px;
margin-right: 70px;
}
#mainBodyLeft p {
color: #333;
font-size: 13px;
}
#mainBodyLeft p.blue {
color: #669999;
}
#mainBodyLeft #communityDiv {
float: left;
background-image:url(images/bg_community_leftDiv.jpg);
background-repeat: no-repeat;
width: 581px;
height: 347px;
padding: 20px 0px 0px 20px;
}
#mainBodyRight {
float: left;
width: 300px;
color: #333;
}
#mainBodyRight p {
padding-right: 50px;
color: #333;
}
#mainBodyRight table {
width: 100%;
}
#mainBodyRight td {
border:0px solid #666;
padding:0px 5px;
text-align:left;
}
#mainBodyRight .blueBorderBox {
border:5px solid #ddf0f2;
padding:18px 18px 18px 18px;
text-align:left;
}
#mainBodyFixed .seperator {
background-image:url(images/hr_gray_side.jpg);
background-repeat:no-repeat;
width: 100%;
float: left;
clear: both;
}
#mainBodyBottom {
float: left;
width: 100%;
clear:both;
color: #333;
}
#mainBodyBottom .seperator {
background-image:url(images/hr_gray_main.jpg);
background-repeat:no-repeat;
width: 100%;
float: left;
clear: both;
}
/* Footer */
#footer {
float: left;
width:90%;
margin: 20px;
color: #aaa;
font-size: 11px;
}
#footer a {
color: #aaa;
font-size: 11px;
}
#footer a:hover {
text-decoration: underline;
color:#aaa;
}
#footerlinks {
margin-top:2px;
}
#footerlinks a,
#footerlinks a:visited {
color:#006699;
}
#homeBottom td {
border:0px solid #666;
padding: 8px 18px 8px 18px;
}
#homeBottom table {
width: 100%;
}
#homeBottom {
padding: 0px 0px 0px 0px;
float: left;
width: 585px;
height: 165px;
background-image:url(images/home/bg_home_bottom.jpg);
background-repeat: no-repeat;
}
.groupTable {
width: 100%;
}
.groupTable th {
padding: 10px;
color: #ffffff;
background-color: #6D8293;
border: 2px solid #fff;
}
.groupTable td {
padding: 10px;
color: #333333;
background-color: #d9d9d9;
border: 2px solid #fff;
}
.groupTable .evenRow td {
background-color: #ededed;
}
span.BigBlue {
color:#336666;
font-size:1.25em;
margin: 0em 0em 0em 0em;
padding-bottom:.5em;
font-weight: bold;
}
span.emBlue {
color: #336666;
font-style:italic;
}
.pageTable {
width: 95%;
border: none;
}
.pageTable img {
vertical-align: bottom;
}
.pageTable td {
border: none;
}
.pageTable td.leftNav {
width: 100px;
}
.greenBox {
margin: 10px 30px 10px 30px;
padding: 10px 20px 10px 20px;
background-color: #EBF3DB;
width: 75%;
}
.blueBox {
margin: 10px 30px 10px 30px;
padding: 10px 20px 10px 20px;
background-color: #DDF0F2;
width: 75%;
}
.blueHR {
margin: 10px 30px 10px 30px;
height: 5px;
background-color: #DDF0F2;
width: 75%;
}
/* SEARCH FILTER */
#search_autocomplete {
color:#aaa;
}
#search-button {
display:inline;
}
#search_filtered_div {
position:absolute;
margin-top:-1px;
z-index:101;
border:1px solid #BCCDF0;
background-color:#fff;
}
#search_filtered {
min-width:100%;
}
#search_filtered td{
background-color:#fff;
border-bottom: 1px solid #669999;
line-height:1.5em;
}
#search_filtered .jd-selected {
background-color: #94b922;
cursor:pointer;
}
#search_filtered .jd-selected,
#search_filtered .jd-selected a {
color:#fff;
}
.no-display {
display: none;
}
.jd-autocomplete {
font-family: Arial, sans-serif;
padding-left: 6px;
padding-right: 6px;
padding-top: 1px;
padding-bottom: 1px;
font-size: .8em;
border: none;
margin: 0;
line-height: 1.05em;
}
.show-row {
display: table-row;
}
.hide-row {
display: hidden;
}
/* SEARCH */
/* restrict global search form width */
#searchForm {
width:350px;
}
#searchTxt {
width:200px;
}
/* disable twiddle and size selectors for left column */
#leftSearchControl div {
width: 100%;
}
#leftSearchControl .gsc-twiddle {
background-image : none;
}
#leftSearchControl td, #searchForm td {
border: 0px solid #000;
}
#leftSearchControl .gsc-resultsHeader .gsc-title {
padding-left : 0px;
font-weight : bold;
font-size : 13px;
color:#006699;
display : none;
}
#leftSearchControl .gsc-resultsHeader div.gsc-results-selector {
display : none;
}
#leftSearchControl .gsc-resultsRoot {
padding-top : 6px;
}
#leftSearchControl div.gs-visibleUrl-long {
display : block;
color:#006699;
}
.gsc-webResult div.gs-visibleUrl-short,
table.gsc-branding,
.gsc-clear-button {
display : none;
}
.gsc-cursor-box .gsc-cursor div.gsc-cursor-page,
.gsc-cursor-box .gsc-trailing-more-results a.gsc-trailing-more-results,
#leftSearchControl a,
#leftSearchControl a b {
color:#006699;
}
.gsc-resultsHeader {
display: none;
}
/* Disable built in search forms */
.gsc-control form.gsc-search-box {
display : none;
}
table.gsc-search-box {
margin:6px 0 0 0;
border-collapse:collapse;
}
td.gsc-input {
padding:0 2px;
width:100%;
vertical-align:middle;
}
input.gsc-input {
border:1px solid #BCCDF0;
width:99%;
padding-left:2px;
font-size:.95em;
}
td.gsc-search-button {
text-align: right;
padding:0;
vertical-align:top;
}
#search-button {
margin:0 0 0 2px;
font-size:11px;
height:1.8em;
}
/* search result tabs */
#doc-content .gsc-control {
position:relative;
}
#doc-content .gsc-tabsArea {
position:relative;
white-space:nowrap;
}
#doc-content .gsc-tabHeader {
padding: 3px 6px;
position:relative;
}
#doc-content .gsc-tabHeader.gsc-tabhActive {
border-top: 2px solid #94B922;
}
#doc-content h2#searchTitle {
padding:0;
}
#doc-content .gsc-resultsbox-visible {
padding:1em 0 0 6px;
}
/* CAROUSEL */
#homeMiddle {
padding: 0px 0px 0px 0px;
float: left;
width: 584px;
height: 580px;
position:relative;
}
#topAnnouncement {
background:url(images/home/bg_home_announcement.png) no-repeat 0 0;
}
#homeTitle {
padding:15px 15px 0;
height:30px;
}
#homeTitle h2 {
padding:0;
}
#announcement-block {
padding:0 15px 0;
overflow:hidden;
background: url(images/hr_gray_side.jpg) no-repeat 15px 0;
zoom:1;
}
#announcement-block>* {
padding:15px 0 0;
}
#announcement-block img {
float:left;
margin:0 30px 0 0;
}
#announcement {
float:left;
margin:0;
}
#carousel {
background:url(images/home/bg_home_carousel.png) no-repeat 0 0;
position:relative;
height:400px;
}
#carouselMain {
padding: 25px 21px 0;
height:185px;
background-position:top;
overflow:hidden;
position:relative;
}
#carouselMain img {
margin:0;
}
#homeMiddle p {
margin:0;
padding-bottom: 1em;
}
.clearer { clear:both; }
#arrow-left, #arrow-right {
float:left;
width:42px;
height:42px;
background-image:url(images/home/carousel_buttons_sprite.png);
background-repeat:no-repeat;
}
#arrow-left {
margin:35px 3px 0 10px;
}
#arrow-right {
margin:35px 10px 0 0;
}
.arrow-left-off,
#arrow-left.arrow-left-off:hover {
background-position:0 0;
}
.arrow-right-off,
#arrow-right.arrow-right-off:hover {
background-position:-42px 0;
}
#arrow-left:hover {
background-position:0 -42px;
}
#arrow-right:hover {
background-position:-42px -42px;
}
.arrow-left-on {
background-position:0 0;
}
.arrow-right-on {
background-position:-42px 0;
}
.arrow-right-off,
.arrow-left-off {
cursor:default;
}
.app-list-container {
margin:37px 20px 0;
_margin-top:33px;
position:relative;
width:100%;
}
div#list-clip {
height:110px;
width:438px;
overflow:hidden;
position:relative;
float:left;
}
div#app-list {
left:0;
z-index:1;
position:absolute;
margin:11px 0 0;
_margin-top:13px;
width:1000%;
}
#app-list a {
display:block;
float:left;
height:90px;
width:90px;
margin:0 24px 0;
padding:3px;
background:#99cccc;
-webkit-border-radius:7px;
-moz-border-radius:7px;
border-radius:7px;
text-decoration:none;
text-align:center;
font-size:11px;
line-height:11px;
}
#app-list a span {
position:relative;
top:-4px;
}
#app-list img {
width:90px;
height:70px;
margin:0;
}
#app-list a.selected,
#app-list a:active.selected,
#app-list a:hover.selected {
background:#A4C639;
color:#fff;
cursor:default;
text-decoration:none;
}
#app-list a:hover,
#app-list a:active {
background:#ff9900;
}
#app-list a:hover span,
#app-list a:active span {
text-decoration:underline;
}
#droid-name {
padding-top:.5em;
color:#666;
padding-bottom:.25em;
}
/*carousel bulletin layouts*/
/*460px width*/
/*185px height*/
.img-left {
float:left;
width:230px;
height:165px;
overflow:hidden;
padding:8px 0 8px 8px;
}
.desc-right {
float:left;
width:270px;
padding:10px;
}
.img-right {
float:right;
width:220px;
height:165px;
overflow:hidden;
padding:8px 8px 8px 0;
}
.desc-left {
float:right;
width:280px;
padding:10px;
text-align:right;
}
.img-top {
height:80px;
text-align:center;
}
.desc-bottom {
height:100px;
margin:10px;
}