From 29e934367b927fb13417bee77008600ad5a39dcc Mon Sep 17 00:00:00 2001 From: Dirk Dougherty Date: Tue, 5 May 2015 18:17:13 -0700 Subject: [PATCH] Swap templates-sdk and templates-sdk-dev files to enable redesign builds by default. Change-Id: I9eabbbcd823fb29bd2209172c458cb9dad5f24d2 --- .../templates-sdk-dev/assets/css/default.css | 5941 +++++++--------- .../assets/css/fullscreen.css | 194 +- .../images/resource-card-default-android.jpg | Bin 12042 -> 15565 bytes .../styles/notice-designers-material.png | Bin .../styles/notice-designers-material@2x.png | Bin .../templates-sdk-dev/assets/js/docs.js | 734 +- tools/droiddoc/templates-sdk-dev/class.cs | 20 +- .../templates-sdk-dev/components/masthead.cs | 408 +- .../templates-sdk-dev/customizations.cs | 127 +- .../droiddoc/templates-sdk-dev/designpage.cs | 12 +- tools/droiddoc/templates-sdk-dev/docpage.cs | 46 +- tools/droiddoc/templates-sdk-dev/footer.cs | 168 +- tools/droiddoc/templates-sdk-dev/head_tag.cs | 5 +- .../templates-sdk-dev/nosidenavpage.cs | 1 - tools/droiddoc/templates-sdk-dev/sample.cs | 8 +- .../droiddoc/templates-sdk-dev/sampleindex.cs | 8 +- tools/droiddoc/templates-sdk-dev/trailer.cs | 1 - .../templates-sdk/assets/css/default.css | 5943 ++++++++++------- .../templates-sdk/assets/css/fullscreen.css | 194 +- .../assets/images/android_logo.png | Bin .../assets/images/android_logo@2x.png | Bin .../images/resource-card-default-android.jpg | Bin 15565 -> 12042 bytes .../assets/images/sprite-2x.png | Bin .../assets/images/sprite.png | Bin .../droiddoc/templates-sdk/assets/js/docs.js | 734 +- tools/droiddoc/templates-sdk/class.cs | 20 +- .../templates-sdk/components/masthead.cs | 408 +- .../droiddoc/templates-sdk/customizations.cs | 127 +- tools/droiddoc/templates-sdk/designpage.cs | 12 +- tools/droiddoc/templates-sdk/docpage.cs | 46 +- tools/droiddoc/templates-sdk/footer.cs | 168 +- tools/droiddoc/templates-sdk/head_tag.cs | 5 +- tools/droiddoc/templates-sdk/nosidenavpage.cs | 1 + tools/droiddoc/templates-sdk/sample.cs | 8 +- tools/droiddoc/templates-sdk/sampleindex.cs | 8 +- tools/droiddoc/templates-sdk/trailer.cs | 1 + 36 files changed, 7674 insertions(+), 7674 deletions(-) rename tools/droiddoc/{templates-sdk => templates-sdk-dev}/assets/images/styles/notice-designers-material.png (100%) rename tools/droiddoc/{templates-sdk => templates-sdk-dev}/assets/images/styles/notice-designers-material@2x.png (100%) rename tools/droiddoc/{templates-sdk-dev => templates-sdk}/assets/images/android_logo.png (100%) rename tools/droiddoc/{templates-sdk-dev => templates-sdk}/assets/images/android_logo@2x.png (100%) rename tools/droiddoc/{templates-sdk-dev => templates-sdk}/assets/images/sprite-2x.png (100%) rename tools/droiddoc/{templates-sdk-dev => templates-sdk}/assets/images/sprite.png (100%) diff --git a/tools/droiddoc/templates-sdk-dev/assets/css/default.css b/tools/droiddoc/templates-sdk-dev/assets/css/default.css index a105834de..cc4dce711 100644 --- a/tools/droiddoc/templates-sdk-dev/assets/css/default.css +++ b/tools/droiddoc/templates-sdk-dev/assets/css/default.css @@ -17,31 +17,18 @@ html, body { height: 100%; margin: 0; padding: 0; - background-color: #fff; + background-color:#F9F9F9; -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; /* prevent subpixel antialiasing, which thickens the text */ /* text-rendering: optimizeLegibility; */ /* turned off ligatures due to bug 5945455 */ } body { - color: #515151; - color: rgba(0, 0, 0, .68); - font: 14px/24px Roboto, sans-serif; + color: #222; + font: 14px/19px Roboto, sans-serif; font-weight: 400; letter-spacing:.1; - min-width: 940px; - padding:0 20px; } - -body.responsive { - min-width: 0; -} - -@media (max-width: 719px) { - body.responsive { - padding: 0 10px; - } -} + padding:0 10px; } #page-container { width: 940px; @@ -111,252 +98,44 @@ body.responsive { #devdoc-nav.fixed { position: fixed; margin:0; - top: 84px; /* sticky-header height + 20px gutter */ + top: 65px; /* sticky-header height + 20px gutter */ } -@media (max-width: 719px) { - .responsive #devdoc-nav { - /* hide it temporarily, so responsive content can be tested. */ - /* Need to implement a more future proof solution for responsive navigation */ - display: none; - } +#devdoc-nav span.small { + font-size:12px; + font-weight:normal; } #content { width: 760px; float: left; } - -/***** PREVIOUSLY style.css ******************/ -/* This should be close to the top, so it is easier to override. */ -[dir='rtl'] { - direction: rtl; -} -html { - line-height: 20px; -} -pre, table, input, textarea, code { - font-size: 1em; -} -address, abbr, cite { - font-style: normal; -} -[dir='rtl'] th { - text-align: right; -} -html[lang^=ja] blockquote, html[lang^=ja] q, html[lang^=ko] blockquote, html[lang^=ko] q, -html[lang^=zh] blockquote, html[lang^=zh] q { - font-style: normal; -} -q { - font-style: italic; -} -fieldset, iframe, img { - border: 0; -} -img { - border: none; - -ms-interpolation-mode: bicubic; - max-width: 100%; - vertical-align: middle; -} -video { - max-width: 100%; - object-fit: cover; -} -q { - quotes: none; -} -sup, sub { - font-size: 11px; - line-height: 0; -} - -table, fieldset { - margin: 0; -} -/* Biggest type */ -.display-1 { - font-size: 56px; - line-height: 68px; -} -@media (max-width: 719px) { - .display-1 { - font-size: 44px; - line-height: 56px; - } -} -h1, h2, h3 { - color: #212121; - color: rgba(0, 0, 0, .87); -} -h1 { - font-size: 44px; - line-height: 56px; - margin: 24px 0 12px; - font-weight: 300; -} -h1.short { - margin-right:320px; -} -@media (max-width: 719px) { - h1 { - font-size: 36px; - line-height: 48px; - } -} -h2 { - font-size: 28px; - line-height: 32px; - margin: 24px 0 16px; - font-weight: 400; -} -h3 { - font-size: 24px; - line-height: 32px; - font-weight: 400; - margin: 16px 0; -} -h4 { - font-size: 18px; - line-height: 24px; - margin: 12px 0; - font-weight: 500; -} -h5, h6 { - font-size: 16px; - line-height: 24px; - margin: 8px 0; -} -hr { /* applied to the bottom of h2 elements */ - height: 1px; - margin: 7px 0 12px; - border: 0; - background: #e5e5e5; -} -p, pre, table, form { - margin: 0 0 12px; -} -small { - font-size: 11.5px; - color: #000; -} -ul, ol { - margin: 0 0 15px 20px; - padding: 0; -} -[dir='rtl'] ul, [dir='rtl'] ol { - margin: 10px 30px 10px 10px; -} -ul ul, ul ol, ol ul, ol ol { - margin-bottom: 0; - margin-top: 0; -} -li { - margin: 0 0 12px; -} -dt { - margin: 24px 0 12px; -} -dd { - margin:0 0 10px 40px; -} -dd p, -dd pre, -dd ul, -dd ol, -dd dl { - margin-top:10px; -} -li p, -li pre, -li ul, -li ol, -li dl { - margin-top: 6px; - margin-bottom: 6px; -} -dl dd dl:first-child { - margin-top: 0; -} -pre strong, pre b, a strong, a b, a code { - color: inherit; -} -pre, code { - color: #060; - font: 13px/18px 'Courier New', monospace; - -webkit-font-smoothing: subpixel-antialiased; - -moz-osx-font-smoothing: auto; -} - -legend { - display: none; -} -a:link, a:visited, .link-color { - color: #0ae; - text-decoration: none; -} -a:focus, a:hover, a:active { - color: #0ae; - text-decoration: none; -} -a.white { - color: #fff; - text-decoration:underline; -} -a.white:hover, a.white:active { - color: #ccc !important; -} -strong, b { - font-weight: bold; -} -table { - border-collapse: collapse; - border-spacing: 0; - border:0; - margin: .5em 1em 1em 0; - width:100%; /* consistent table widths; within IE's quirks */ - background-color:#f7f7f7; -} -th, td { - padding: 4px 12px; - vertical-align: top; - text-align: left; -} -td { - background-color:inherit; - border:solid 1px #DDD; -} -td *:last-child { - margin-bottom:0; -} -th { - background-color: #999; - color: #fff; - border:solid 1px #DDD; - font-weight: normal; -} -tr:first-of-type th:first-of-type:empty { - visibility: hidden; -} - a:hover, acronym:hover { - color: #7aa1b0; } + color: #7aa1b0 !important; } a:focus, a:active { - color: #33b5e5; } + color: #33b5e5 !important; } a.external-link { background:url('../images/styles/open_new_page.png') no-repeat 100% 50%; padding-right:16px; } +img { + border: none; } #jd-content img { margin-bottom:15px; } +ul { + margin: 0; + padding: 0; } + +strong { + font-weight: 500; } + em { font-style: italic; } @@ -376,7 +155,6 @@ video.with-shadow { /* disclosures mixin */ /* content layout */ -/* This grid is deprecated in favor of .cols and .col-X */ .layout-content-row { display: inline-block; margin-bottom: 10px; } @@ -486,12 +264,12 @@ video.with-shadow { /* sublinks */ } #nav li { list-style-type: none; - font-size: 12px; + font-size: 14px; margin:0; padding:0; - line-height: 18px; } + line-height: 15px; } #nav a { - color: #505050; + color: #555555; text-decoration: none; word-wrap:break-word; } #nav .nav-section-header { @@ -510,8 +288,9 @@ video.with-shadow { /* section header links */ #nav > li > div > a { display: block; - font-weight: 700; - padding: 13px 0 12px 10px; } + color: #333333; + font-weight: 500; + padding: 10px 0 10px 10px; } #nav .nav-section-header:after { content: ''; background: transparent url(../images/styles/disclosure_down.png) no-repeat scroll 50% 50%; @@ -519,7 +298,7 @@ video.with-shadow { height: 34px; display: block; position: absolute; - top: 6px; + top: 0; right: 0; } #nav .nav-section-header.empty { padding:0; } @@ -533,24 +312,22 @@ video.with-shadow { #nav .nav-section li a { /* first gen child (2nd level li) */ display:block; - font-weight: 700; + font-weight: normal; text-transform: none; - padding: 13px 5px 13px 10px; + padding: 7px 5px 7px 10px; } #nav .nav-section li li a { /* second gen child (3rd level li) */ - font-weight: 400; - padding: 7px 5px 7px 10px; + padding: 5px 5px 5px 10px; } #nav li.expanded .nav-section-header { - background: #f0f0f0; } - #nav li.expanded .nav-section-header.empty { - background: none; } + background:#e9e9e9; + background: rgba(0, 0, 0, 0.05); } #nav li.expanded li .nav-section-header { - background: none; } + background: transparent; } #nav li.expanded li ul { /* 3rd level ul */ - padding:6px 0 1px 20px; + padding:0 0 0 10px; } #nav li.expanded > .nav-section-header:after { content: ''; @@ -617,12 +394,16 @@ video.with-shadow { padding-bottom:0; } #nav li.expanded ul > li { - background:#f7f7f7; } + background:#efefef; + background: rgba(0, 0, 0, 0.03); } #nav li.expanded ul > li li { background:inherit; } #nav li ul.tree-list-children ul { display:block; } +#nav.samples-nav li li li { + font-size:13px; +} #nav.samples-nav li li li a { padding-top:3px; padding-bottom:3px; @@ -642,19 +423,25 @@ video.with-shadow { /* content header */ .content-header { - position: relative; -} -.content-header:before, -.content-header:after { - content: ''; - display: table; - /* Clear heading margins, to make absolutely positioned nav a bit more predictable. */ -} + height: 30px; + margin:36px 0 23px; /* same as h1 */ + padding:0 0 10px;} /* same as h1 */ .content-header.just-links { margin-bottom:0; padding-bottom:0;} +.content-header h1 { + margin:0; + padding:0; + width: 700px; +} +.content-header > div:first-child { + height:1px; /* set fixed height for the header div to ensure the + next/prev links align with toc on training classes */ +} + .content-footer { + border-top: 1px solid #ccc; margin-top: 10px; padding-top:10px; width:100%; } @@ -666,7 +453,7 @@ video.with-shadow { margin-right:0; } .content-footer.wrap { - max-width:940px; + width:940px; } .content-footer .plus-container { margin:5px 0 0; @@ -680,10 +467,7 @@ a.back-link { } .content-header .paging-links { - position: absolute; - right: 0; - top: 8px; - width: 220px; + margin-top:-25px; } .paging-links { position: relative; @@ -692,7 +476,9 @@ a.back-link { position: absolute; } .paging-links a, .training-nav-top a { - text-decoration: none; } + color: #555555; + text-decoration: none; + text-transform: uppercase; } .paging-links .prev-page-link:before, .training-nav-top .prev-page-link:before, a.back-link:before { @@ -731,25 +517,20 @@ a.back-link { } .training-nav-top a { - border-bottom:0; - box-sizing: border-box; - color: inherit; display:block; float:left; - padding:10px 0; - line-height:30px; + width:122px; + height:28px; + padding: 8px; + line-height:28px; text-align:center; - width: 50%; - } - - .training-nav-top a.prev-page-link { - padding-left: 15px; - text-align: left; + border:1px solid #DADADA; + border-bottom:0; } .training-nav-top a.next-page-link { - padding-right: 15px; - text-align: right; + border-left:0; + width:123px; } .paging-links a.disabled, @@ -776,50 +557,31 @@ a.back-link { /* list of classes on course landing page */ ol.class-list { - counter-reset: class; - list-style: none; - margin: 60px 0 0; + list-style:none; + margin-left:0; } ol.class-list>li { - box-shadow: 0px 2px 5px 0 rgba(0, 0, 0, 0.26); - margin: 0 0 20px; - overflow: hidden; + margin:0 0 15px; + padding:5px 0 0; + overflow:hidden; + border-top:1px solid #ccc; } - ol.class-list .title { - background: #00bcd4; - color: #fff; - display: block; - font-size: 20px; - font-weight: 500; - height: 32px; - margin: 0; - padding: 52px 16px 12px; - position: relative; + ol.class-list li a.title { + font-size:16px; + margin:0; + clear:left; + display:block; + height:32px; + padding:0 4px; } - ol.class-list .title:before { - border-bottom: 1px solid white; - box-sizing: border-box; - /* Disable the numbers for now, since vert few classes need to be taken in order. */ - /* content: counter(class); */ - counter-increment: class; - height: 40px; - left: 0; - padding: 10px 1px 0 5px; - position: absolute; - top: 0; - text-align: right; - min-width: 30px; - } - ol.class-list .title h2 { - color: currentColor; - font-size: inherit; - font-weight: inherit; + ol.class-list li a.title h2 { + color:inherit; margin:0 0 10px; display:block; float:left; width:675px; } - ol.class-list .title span { + ol.class-list li a.title span { display:none; float:left; font-size:18px; @@ -828,71 +590,40 @@ a.back-link { width: 10px; height: 32px; } + ol.class-list li a.title:hover { + background:#ddd; + color:#258AAF !important; + } + ol.class-list li a.title:hover span { + display:block; + } - ol.class-list .description { - box-sizing: border-box; + #jd-content + ol.class-list li img { + float:left; + clear:left; + width:64px; + margin:0 20px 0 0; + } + ol.class-list li p.description { float:left; display:block; + width:250px; margin:0; - padding: 16px 10px 16px 16px; - width: 50%; } - ol.class-list .description.article { + ol.class-list li p.description.article { width: 550px; } ol.class-list ol { - box-sizing: border-box; - float: left; - list-style: none; - margin: 0; - padding: 16px 16px 16px 10px; - width: 50%; + float:left; + width:320px; + margin:0 0 0 30px; + list-style:none; + margin:0 0 0 20px; } - ol.class-list .lessons li { - margin: 0 0 6px; - line-height: 16px; - } - - /* Class colors */ - ol.class-list li:nth-child(10n+1) .title { - background: #00bcd4; - } - ol.class-list li:nth-child(10n+2) .title { - background: #4db6ac; - } - ol.class-list li:nth-child(10n+3) .title { - background: #66bb6a; - } - ol.class-list li:nth-child(10n+4) .title { - background: #7cb342; - } - ol.class-list li:nth-child(10n+5) .title { - background: #afb42b; - } - ol.class-list li:nth-child(10n+6) .title { - background: #ffb300; - } - ol.class-list li:nth-child(10n+7) .title { - background: #ff7043; - } - ol.class-list li:nth-child(10n+8) .title { - background: #ec407a; - } - ol.class-list li:nth-child(10n+9) .title { - background: #ab47bc; - } - ol.class-list li:nth-child(10n+10) .title { - background: #7e57c2; - } - - @media (max-width: 719px) { - .responsive ol.class-list ol, - .responsive ol.class-list .description { - float: none; - margin: 16px; - padding: 0; - width: auto; - } + ol.class-list div.lessons li { + margin:0 0 6px; + line-height:16px; } @@ -1340,6 +1071,233 @@ scroll top left; + + + + + + + + + + + + + + + +/***** PREVIOUSLY style.css ******************/ + + + + + +@media screen, projection, print { +[dir='rtl'] { + direction: rtl; +} +html { + line-height: 20px; +} +pre, table, input, textarea, code { + font-size: 1em; +} +address, abbr, cite { + font-style: normal; +} +[dir='rtl'] th { + text-align: right; +} +html[lang^=ja] blockquote, html[lang^=ja] q, html[lang^=ko] blockquote, html[lang^=ko] q, +html[lang^=zh] blockquote, html[lang^=zh] q { + font-style: normal; +} +q { + font-style: italic; +} +fieldset, iframe, img { + border: 0; +} +img { + -ms-interpolation-mode: bicubic; + vertical-align: middle; + max-width: 100%; +} +q { + quotes: none; +} +sup, sub { + font-size: 11px; + line-height: 0; +} +} + +@media screen, projection { + +table, fieldset { + margin: 0; +} +h1 { + color:#333; + font-size: 34px; + margin: 36px 0 27px; + padding:0 0 10px; + font-weight:300; +} +h1, h2 { + line-height: 30px; +} +h1.short { + margin-right:320px; +} +h1.short { + margin-right:320px; +} +h1.super { + font-size: 37px; +} +h2 { + color:#333; + font-size: 26px; + margin: 32px 0 20px; + padding:0; + font-weight:300; +} +h3 { + color:#333; + font-size: 21px; + font-weight:400; + margin:21px 0 14px 0; +} +h3, h4 { + line-height: 21px; +} +h4 { + font-size: 18px; + margin: 12px 0; + font-weight:500; +} +h5 { + font-size: 14px; +} +h5, h6 { + margin: 5px 0; +} +h6 { + font-size: 12px; +} +hr { /* applied to the bottom of h2 elements */ + height: 1px; + margin: 3px 0 12px; + border: 0; + background: #ccc; +} +p, pre, table, form { + margin: 0 0 15px; +} +small { + font-size: 11.5px; + color: #000; +} +ul, ol { + margin: 0 0 15px 18px; + padding: 0; +} +[dir='rtl'] ul, [dir='rtl'] ol { + margin: 10px 30px 10px 10px; +} +ul ul, ul ol, ol ul, ol ol { + margin-bottom: 0; + margin-top: 0; +} +li { + margin:0 0 5px; +} +dd { + margin:0 0 10px 30px; +} +dd p, +dd pre, +dd ul, +dd ol, +dd dl { + margin-top:10px; +} +li p, +li pre, +li ul, +li ol, +li dl { + margin-top:5px; + margin-bottom:5px; +} +dl dd dl:first-child { + margin-top:0; +} +pre strong, pre b, a strong, a b, a code { + color: inherit; +} +pre, code { + color: #060; + font: 13px/1.5 monospace; +} +code { + font-weight:bold; + font: 13px/14px monospace; +} + +legend { + display: none; +} +a:link, a:visited, .link-color { + color: #258aaf; + text-decoration: none; +} +a:focus, a:hover, a:active { + color: #33B5E5; + text-decoration: none; +} +a.white { + color: #fff; + text-decoration:underline; +} +a.white:hover, a.white:active { + color: #ccc !important; +} +strong, b { + font-weight:bold; + color: #222; +} +table { + border-collapse: collapse; + border-spacing: 0; + border:0; + margin: .5em 1em 1em 0; + width:100%; /* consistent table widths; within IE's quirks */ + background-color:#f7f7f7; +} +th, td { + padding: 4px 12px; + vertical-align: top; + text-align: left; +} +td { + background-color:inherit; + border:solid 1px #DDD; +} +td *:last-child { + margin-bottom:0; +} +th { + background-color: #999; + color: #fff; + border:solid 1px #DDD; + font-weight: normal; +} +tr:first-of-type th:first-of-type:empty { + visibility: hidden; +} + /* -------------------------------------------------------------------------- Footer */ @@ -1509,11 +1467,236 @@ color-stop(50%, #acbc00), color-stop(50%, #bdde00), color-stop(100%, #bdde00)); .atv { color: #060; } } +/* ============================================================================= + Columns + ========================================================================== */ + +@media screen, projection, print { +.full { + padding: 2.5em 0; + border-top: solid 1px #ddd; + border-bottom: solid 1px #ddd; + background: #f7f7f7; +} +.wrap { + margin: 0 auto; + width: 940px; + clear: both; +} +.cols { + height: 1%; + margin: 0 -1.533742331288343558282%; + width: 103.06748466257669%} +*+html .cols { + margin-bottom: 20px; +} +.cols:after { + clear: both; + content: ' '; + display: block; + height: 0; + visibility: hidden; +} +.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, +.col-13, .col-14, .col-15, .col-16 { + display: inline; + float: left; + margin-left: 10px; + margin-right: 10px; +} +/* +* html .col-1, * html .col-2, * html .col-3, * html .col-4, * html .col-5, * html .col-6, * html +.col-7, * html .col-8, * html .col-9, * html .col-10, * html .col-11, * html .col-12 { + margin: 0; + padding: 0 1.4% 20px; +} +[dir='rtl'] .col-1, [dir='rtl'] .col-2, [dir='rtl'] .col-3, [dir='rtl'] .col-4, [dir='rtl'] .col-5, +[dir='rtl'] .col-6, [dir='rtl'] .col-7, [dir='rtl'] .col-8, [dir='rtl'] .col-9, [dir='rtl'] .col-10, +[dir='rtl'] .col-11, [dir='rtl'] .col-12 { + float: right; +} +*/ +.col-1 { width: 40px } +.col-2 { width: 100px } +.col-3 { width: 160px } +.col-4 { width: 220px } +.col-5 { width: 280px } +.col-6 { width: 340px } +.col-7 { width: 400px } +.col-8 { width: 460px } +.col-9 { width: 520px } +.col-10 { width: 580px } +.col-11 { width: 640px } +.col-12 { width: 700px } +.col-13 { width: 760px } +.col-14 { width: 820px } +.col-15 { width: 880px } +.col-16 { width: 940px } +} + +.col-right { + margin-right:0px; +} + +@media screen and (max-width:772px) { +.col-5, .col-6, .col-7 { + clear: both; + width: 97.0238096%} +} + /* ============================================================================= Layout ========================================================================== */ @media screen, projection, print { +/* -------------------------------------------------------------------------- +Header, Login, Nav-X, Search +*/ +#header { + margin: 0; + padding: 0; +} +#header:before, #header:after { + content: ""; + display: table; + clear: both +} +.logo, .nav-x { + float: left; +} +.nav-x { + margin-top: -2px; + list-style-type: none; +} +.nav-x a { + color: #333; + font-size: 16px; +} +.about a.selected { + color: #9933CC; +} +.design a.selected { + color: #33b5e5; +} +.develop a.selected { + color: #F80; +} +.distribute a.selected { + color: #9C0; +} + + + +.nav-x li { + display: inline; + margin-right: 45px; +} +.search { + float: right; + position: relative; + width: 220px +} +.search .bottom, .search .left, .search .right { + position: absolute; + background-color: #a3a3a3; +} +.search .bottom { + width: 220px; + height: 1px; + top: 24px; + left: 0 +} +.search .left, .search .right { + height: 5px; + width: 1px +} +.search .left { top: 19px; left: 0 } +.search .right { top: 19px; right: 0 } +.search form { + float: left; + margin-top: 2px; + width: inherit; +} +.search .close, +#player-frame .close { + position: absolute; + right: 8px; + bottom: 4px; + width: 16px; + height: 16px; + margin: 0; + text-indent: -1000em; + background: url(../images/close.png) no-repeat 0 0; + z-index:9999; +} +.search .close:hover, .search .close:focus, +#player-frame .close:hover, #player-frame .close:focus { + background-position: -16px 0; + cursor:pointer; +} +#player-frame .close { + top: 6px; +} +.search form input { + color: #999; + font-size: 1em; + width: inherit; + border: none; + margin: 0; + padding:0 0 0 6px; + z-index: 1500; + background-color: transparent +} +.search:hover .bottom, .search:hover .left, .search:hover .right { + background-color: #33b5e5; +} +.search:hover .icon { + background-position: -8px 0 +} +.search form input:focus { + color: #222; + font-weight: bold; + outline:0; +} +/* Search Dropdown */ +.search-dropdown { + padding: 15px; + width: 192px; + border: solid 1px #c5c5c5; + background: #fff; + position: absolute; + top: 35px; + left: 0; + -moz-box-shadow: 0 0 10px rgba(0,0,0,0.2); + -webkit-box-shadow: 0 0 10px rgba(0,0,0,0.2); + box-shadow: 0 0 10px rgba(0,0,0,0.2) +} +.search-dropdown ul, .search-dropdown ul li { + list-style-type: none; + margin: 0; + padding: 0 +} +.search-dropdown ul li { + clear: both +} +.search-dropdown img { + float: left; + margin: 0 10px 10px 0 +} +.search-dropdown h6 { + color: #222; + margin: 0; + line-height: normal +} +.search-dropdown .desc { + color: #999; + font-size: 11.5px; + line-height: normal; + margin: 0; +} +.search-dropdown li a:hover h6, .search-dropdown li a:hover .desc { + color: #33b5e5 +} /* -------------------------------------------------------------------------- Buttons */ @@ -1628,7 +1811,7 @@ endColorstr='#ffffff',GradientType=0 ); /* IE6-8 */ -webkit-box-shadow: inset 0px 0px 5px 2px rgba(0, 0, 0, .05); -moz-box-shadow: inset 0px 0px 5px 2px rgba(0, 0, 0, .05); box-shadow: inset 0px 0px 5px 2px rgba(0, 0, 0, .05); - color: #0ae !important; + color: #258AAF !important; } .button.big { font-size:20px; @@ -1697,37 +1880,18 @@ EndColorStr='#ececec'); width:291px; } -.training-nav-top { - border:1px solid #e5e5e5; - border-width: 1px 1px 0; - bottom: -56px; - box-sizing: border-box; - position: absolute; - right: 0; - width: 280px; -} - -@media (max-width: 719px) { - .responsive .training-nav-top { - left: 0; - width: auto; - } - - .responsive #tb-wrapper { - clear: none; - float: none; - margin-left: 0; - } - - .responsive #tb { - float: none; - width: auto; - } -} - +.training-nav-top, .training-nav-bottom { float:right; margin:0 0 0 20px; +} + +.training-nav-top { + position:relative; + top:73px; +} + +.training-nav-bottom { padding:0 0 20px; } @@ -1740,37 +1904,33 @@ EndColorStr='#ececec'); } #tb-wrapper { - margin:56px 0 0 20px; /* negative top-margin to counter the content-header bottom margin */ + margin:51px 0 0 20px; /* negative top-margin to counter the content-header bottom margin */ } #tb, #qv { - border: 1px solid #e5e5e5; - box-sizing: border-box; - float: right; - padding: 5px 0; - width: 240px; + font-size:13px; + line-height:18px; + width:238px; + border:1px solid #ccc; + float:right; } #tb { - width:280px; + width:278px; } #tb h2, #qv h2 { - border-top: 1px solid #e5e5e5; - color: inherit; - font-size: 16px; - line-height: 24px; - margin: 15px 0 4px; - padding: 10px 15px 0; + margin:10px 15px; + padding:0; + text-transform:uppercase; + border-bottom:1px solid gainsboro; } -#tb h2:first-child, -#qv h2:first-child { - border-top: 0; - padding-top: 0; - margin-top: 10px; +#tb *, +#qv * { + font-size:inherit; } #tb .download-box, @@ -1782,6 +1942,7 @@ EndColorStr='#ececec'); #qv .download-box .filename { font-size:11px; margin:4px 4px 10px; + color:#666; } @@ -1798,9 +1959,9 @@ EndColorStr='#ececec'); width:226px; font-size:13px; line-height:18px; - border-left:3px solid #a9e27d; + border-left:4px solid #99CC00; float:right; - padding:0 0 0 20px; + padding:0 0 0 10px; margin:0 0 1em 20px; } @@ -1824,15 +1985,7 @@ EndColorStr='#ececec'); #tb ol, #tb ul, #qv ul { - list-style-type: none; - margin:0 15px 10px 15px; -} - -#tb li, -#qv li { - margin: 4px 0; - padding: 0 0 0 16px; - position: relative; + margin:0 15px 10px 35px; } #tb p { @@ -1852,7 +2005,11 @@ EndColorStr='#ececec'); #qv ul ul, .sidebox ol ol, .sidebox ul ul { - margin: 8px 0; + margin-bottom:0; +} + +#qv ol ol { + margin:3px 0 3px 15px; } .sidebox p, @@ -1988,6 +2145,7 @@ form .form-error input[type='text'], form .form-error textarea { border-radius: 2px; margin: 10px 0; padding: 20px; + color: #666; position: relative; background: #f9f9f9; } @@ -2285,7 +2443,7 @@ a:visited, border-bottom: 1px solid #CCC; background:#e9e9e9; background: rgba(0, 0, 0, 0.05); /* matches #nav li.expanded */ - line-height: 19px; /* Fix regression after page line-height is bumped to 24px */ + } #api-nav-title { padding:0 5px; @@ -2637,7 +2795,7 @@ a#butterbar-message:hover { } /* -------------------------------------------------------------------------- -Misc and article typography +Misc */ @@ -2684,46 +2842,27 @@ pre.classic { p.img-caption { margin: -10px 0 20px; - font-size: 13px; -} - -div.figure-center { - margin: 32px auto 24px; - max-width: 100%; + font-size:13px; + color:#666; } div.figure, div.figure-right { - clear: right; - float: right; - margin: 10px 0 0 0; - padding: 0 0 0 20px; - max-width: 50%; + float:right; + clear:right; + margin:10px 0 0 0; + padding:0 0 0 20px; /* width must be defined w/ an inline style matching the image width */ } div.figure-left { - clear: left; - float: left; - margin: 10px 0 0 0; - padding: 0 20px 0 0; - max-width: 50%; + float:left; + clear:left; + margin:10px 0 0 0; + padding:0 20px 0 0; /* width must be defined w/ an inline style matching the image width */ } -@media (max-width: 719px) { - /* Collapse on mobile. */ - .responsive div.figure, - .responsive div.figure-right, - .responsive div.figure-left { - float: none; - clear: none; - padding: 0; - margin: 32px auto 24px; - max-width: 100%; - } -} - img.frame { border:1px solid #DDD; padding:4px; @@ -2732,31 +2871,38 @@ img.frame { p.table-caption { margin: 0 0 4px 0; font-size:13px; + color:#666; } p.code-caption { margin-bottom: 4px; font: 12px/1.5 monospace; + color:#666; +} + +div.note, +div.caution, +div.warning { + margin: 0 0 15px; } p.note, div.note, p.caution, div.caution, p.warning, div.warning { - padding: 0 0 0 20px; - border-left: 3px solid; - margin: 16px 0; + padding: 0 0 0 10px; + border-left: 4px solid; } p.note, div.note { - border-color: #66c2ff; + border-color: #258AAF; } p.caution, div.caution { - border-color: #f81; + border-color: #FF8800; } p.warning, div.warning { - border-color: #f55; + border-color: #ff4443; } div.note.design { @@ -2819,7 +2965,8 @@ div.design-announce p { a.notice-developers-video, a.notice-developers, a.notice-designers-video, -a.notice-designers { +a.notice-designers, +a.notice-designers-material { float:right; clear:right; width:238px; @@ -2830,13 +2977,15 @@ a.notice-designers { a.notice-developers-video.wide, a.notice-developers.wide, a.notice-designers-video.wide, -a.notice-designers.wide { +a.notice-designers.wide, +a.notice-designers-material.wide { width:278px; } a.notice-developers-video div, a.notice-developers div, a.notice-designers-video div, -a.notice-designers div { +a.notice-designers div, +a.notice-designers-material div { min-height:40px; background:url('../images/styles/notice-developers@2x.png') no-repeat 10px 10px; background-size:40px 40px; @@ -2854,16 +3003,22 @@ a.notice-developers-video div { background:url('../images/styles/notice-developers-video@2x.png') no-repeat 10px 10px; background-size:40px 40px; } +a.notice-designers-material div { + background:url('../images/styles/notice-designers-material@2x.png') no-repeat 10px 10px; + background-size:40px 40px; +} a.notice-developers-video:hover, a.notice-developers:hover, a.notice-designers-video:hover, -a.notice-designers:hover { +a.notice-designers:hover, +a.notice-designers-material:hover { background:#eee; } a.notice-developers-video h3, a.notice-developers h3, a.notice-designers-video h3, -a.notice-designers h3 { +a.notice-designers h3, +a.notice-designers-material h3 { font-size:13px; line-height:18px; font-weight:bold; @@ -2874,14 +3029,16 @@ a.notice-designers h3 { a.notice-developers-video p, a.notice-developers p, a.notice-designers-video p, -a.notice-designers p { +a.notice-designers p, +a.notice-designers-material p { margin:0; line-height:14px; } a.notice-developers-video.left, a.notice-developers.left, a.notice-designers-video.left, -a.notice-designers.left { +a.notice-designers.left, +a.notice-designers-material.left { margin-left:0; float:left; } @@ -3308,15 +3465,6 @@ Page-Specific Styles } */ -/* First paragraph of a content pages is a bit larger - - note the very specific selector. */ -.jd-descr > p:first-child, -.jd-descr > #tb-wrapper + p, -.jd-descr > #qv-wrapper + p { - font-size: 16px; - margin-bottom: 16px; -} - /* page-top-right container for reference pages (holds links to summary tables) */ #api-info-block { @@ -3528,7 +3676,6 @@ h5.jd-tagtitle { font-style:italic; } - /* Inline api level indicator for methods */ div.api-level { font-size:.8em; @@ -3549,6 +3696,27 @@ table.jd-tagtable th { } + + + + + + + + + + + + + + + + + + + + + /* SEARCH FILTER */ .menu-container { @@ -3558,39 +3726,53 @@ table.jd-tagtable th { font-weight:normal; } -.search_filtered_wrapper { - position: absolute; - right: 18px; - top: 64px; +.search_filtered_wrapper.reference { + width: 193px; + float: right; +} +.search_filtered_wrapper.docs { + width:875px; + float: left; + position:absolute; + top:26px; + right:66px; } .suggest-card { - float:right; position:relative; width:170px; min-height:90px; padding:5px; border: solid 1px #C5C5C5; background: white; + top: 15px; margin-right:-5px; -moz-box-shadow: 0 0 10px rgba(0,0,0,0.2); -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); } .suggest-card.reference { - z-index: 998; - width: auto; + position:absolute; + z-index:999; + min-width:171px; /* +padding and border makes this match input width */ + min-height:93px; /* add 3px because this has 1 not 4px top border */ + width:auto; + top:41px; + margin:0; } .suggest-card.develop { z-index:997; border-top: solid 4px #F80; + float:right; } .suggest-card.design { z-index:996; border-top: solid 4px #33b5e5; + float:right; } .suggest-card.distribute { z-index:995; border-top: solid 4px #9C0; + float:right; } .child-card { width:100%; @@ -3670,6 +3852,8 @@ ul.search_filtered { + + /* SEARCH RESULTS */ @@ -3791,7 +3975,7 @@ td.gsc-search-button { #searchResults h2#searchTitle { padding:0; - margin:30px 0 5px; + margin:5px 0; border:none; } @@ -3840,7 +4024,7 @@ td.gsc-search-button { #searchResults .gsc-tabHeader.gsc-tabhInactive, #searchResults .gsc-cursor-page { text-decoration:none; - color:#0ae; + color:#258AAF; border: solid 1px #DADADA; } @@ -3854,7 +4038,7 @@ td.gsc-search-button { background-image: -ms-linear-gradient(top, #F9F9F9, #ECECEC); background-image: -o-linear-gradient(top, #F9F9F9, #ECECEC); background-image: linear-gradient(top, #F9F9F9, #ECECEC); - filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#f9f9f9', + filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#f9f9f9', EndColorStr='#ececec'); color: #33B5E5; } @@ -3879,8 +4063,58 @@ EndColorStr='#ececec'); + /************ STICKY NAV BAR ******************/ +#header-wrapper { + background: #f9f9f9; + margin: 0 -10px 0 -10px; + padding: 31px 10px 0px 10px; + position: relative; +} +#header-wrapper #nav-x div.wrap { + max-width: 940px; + height: 38px; +} +#header-wrapper #nav-x ul.nav-x li { + margin-right: 31px !important; + margin-top: 5px; + margin-bottom: 0px; + height: 30px; +} +#header-wrapper #nav-x > div.wrap ul.nav-x li.active { + color: #669900; + border-bottom: 3px solid #669900; +} +#header-wrapper #nav-x > div.wrap ul.nav-x li.active a { + color: #669900; +} +#header-wrapper #nav-x > div.wrap ul.nav-x a { + font-size: 14.5px; +} +#header-wrapper .developer-console-btn { + float: right; + background: #fefefe; + border-radius: 4px; + padding: 8px 14px; + box-shadow: 1px 1px 0px #7a7a7a; + font-size: 14px; + margin-top: -6px; + cursor: pointer; + color: #464646; + margin-right: 20px; +} +/* not currently used */ +#header-wrapper .shadow { + width: 1034px; + height: 4px; + position: absolute; + left: 50%; + margin-left: -517px; + bottom: -4px; + background-image: url(../images/header-shadow.png); +} + #context { clear: both; padding-top: 14px; @@ -3924,8 +4158,78 @@ EndColorStr='#ececec'); display: none; } +/* Sticky Nav overrides */ +.sticky-menu { + position: fixed; + width: 940px; + height: 0px; + z-index: 51; + top: 12px; +} +#sticky-header { + display: none; + padding: 0 10px; + position: fixed; + background: #f9f9f9; + top: 0px; + left: 0px; + right: 0px; + height: 45px; + box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.1); + border-bottom: 1px solid #a5c43a; + z-index: 50; +} +#sticky-header.design { + border-bottom: 1px solid #33b5e5; +} +#sticky-header.develop { + border-bottom: 1px solid #F80; +} +#sticky-header.distribute { + border-bottom: 1px solid #9C0; +} +#sticky-header.about { + border-bottom: 1px solid #9933CC; +} +#sticky-header > div { + overflow: hidden; + *zoom: 1; + width: 940px; + margin: 0 auto; + clear: both; + padding-top: 9px; +} +#sticky-header > div .logo { + float: left; + width: 26px; + height: 25px; + background: url(../images/dac_logo.png); + background-image: -webkit-image-set(url(../images/dac_logo.png) 1x, url(../images/dac_logo@2x.png) 2x); + z-index: 52; + position: relative; +} +#sticky-header > div .top { + float: left; + width: 38px; + height: 38px; + position: relative; + background: url(../images/styles/gototop.png); + z-index: 52; +} +#sticky-header > div .breadcrumb { + float: left; + padding: 0 0 0 10px; + border-left: 1px solid #d2d2d2; + line-height: 24px; + font-size: 14px; + position: relative; + top: 0px; + z-index: 52; +} + /* offset the tags to account for sticky nav */ -body.reference a[name] { +body.reference a[name], +div.renderscript a[name] { visibility: hidden; display: block; position: relative; @@ -3933,6 +4237,76 @@ body.reference a[name] { } +} + + + + + + + +/*********** PREVIOUSLY dac-styles.css ***************/ + + +#header { + border-bottom:0; +} + +#header .wrap { + max-width:940px; + height:41px; + border-bottom:1px solid; + border-color: #ccc; + position:relative; +} + +.about #header .wrap { + border-color: #9933CC; +} + +.design #header .wrap { + border-color: #33b5e5; +} + +.develop #header .wrap { + border-color: #F80; +} + +.distribute #header .wrap { + border-color: #9C0; +} + +.logo a { + float:left; +} + +#header .logo { + margin-top: -6px; + margin-left: 0px; + margin-bottom:0px; + width: 160px; + padding-right:10px; +} + + +#header-wrap .logo.landing-logo { + width:220px; + margin:0; + padding:0; + margin-bottom:22px; +} +#header-wrap .logo.landing-logo img { + padding:0 0 0 10px; +} + +.search { + height:25px; + margin-top: -3px; + margin-bottom: 0px; +} + + + /* Quicknav */ .btn-quicknav { width:20px; @@ -3970,6 +4344,17 @@ body.reference a[name] { display:block; } +.nav-x li { + display:block; + float:left; + margin-right:45px; + -webkit-transition: all 0.25s linear; + -moz-transition: all 0.25s linear; + -ms-transition: all 0.25s linear; + -o-transition: all 0.25s linear; + transition: all 0.25s linear; +} + #header-wrap.quicknav .nav-x li { min-width:160px; margin-right:20px; @@ -4055,6 +4440,105 @@ body.reference a[name] { } +/* SEARCH AND MORE */ +.search { + position: absolute; + width: 50px; + height:28px; + display: block; + margin-top:-3px; + margin-bottom:7px; + overflow:hidden; + z-index:100; + right:54px; + -webkit-transition: width 0.4s ease; + -moz-transition: width 0.4s ease; + -o-transition: width 0.4s ease; + transition: width 0.4s ease; +} + +.search #search-btn { + width:50px; + height:28px; + background:url(../images/icon_search.png) no-repeat; + float:left; +} + +.search-inner { + width:245px; +} + +.search:hover, .search.active { + width:245px; +} + +.search .bottom, .search .left, .search .right { + position: absolute; + background-color: #a2a2a2 +} + +.search .bottom { + width: 214px; + height: 1px; + top: 24px; + left: 0 +} + +.search .left, .search .right { + height: 5px; + width: 1px +} + +.search .left { + top: 22px; + left: 56px; + background-color:#CCC; +} + +.search .right { + top: 22px; + left: 238px; + background-color:#CCC; +} + +.search form { + margin-top: 2px; + width: 162px; + float:left; +} + +.search form input { + color: #2f2f2f; + font-size: 0.95em; + width: 178px; + border: none; + margin-left: 6px; + z-index: 1500; + position: relative; + background-color: transparent; + border-bottom:1px solid #CCC; + padding:0 0 0 4px; + outline:none; + height:24px; +} + +.search:hover form input { + border-bottom:1px solid #33B5E5; +} + +.search:hover .bottom, .search:hover .left, .search:hover .right { + background-color: #33b5e5; +} + +.search:hover #search-btn { + background-position: 0 -28px +} + +.search form input:focus { + color: #222; + font-weight: bold +} + .moremenu { float: right; position: relative; @@ -4207,9 +4691,9 @@ body.reference a[name] { height:12px; text-indent:-8000px; list-style:none; - margin: 0 3px; + margin: 0 2px; border-radius:6px; - background-color:#ddd; + background-color:#ccc; cursor:pointer; -webkit-transition:color .5s ease-in; -moz-transition:color .5s ease-in; @@ -4217,13 +4701,13 @@ body.reference a[name] { transition:color .5s ease-in; } .slideshow-container .pagination ul li:hover { - background-color:#bbb; + background-color:#999; } .slideshow-container .pagination ul li.active { - background-color:#6ab344; + background-color:#33b5e5; } .slideshow-container .pagination ul li.active:hover { - background-color:#6ab344; + background-color:#33b5e5; } .slideshow-container ul li { display:inline; @@ -4243,14 +4727,27 @@ a.download-sdk { padding-bottom:0px; } +#nav-x { + padding-top: 13px; +} + +#nav-x .wrap { + min-height:32px; +} + +#nav-x .wrap, #searchResults.wrap { max-width:940px; - border-bottom:1px solid #e5e5e5; + border-bottom:1px solid #CCC; } #searchResults.wrap #leftSearchControl { min-height:700px } +.nav-x { + margin-left:0; + margin-bottom:0; +} @@ -4320,7 +4817,7 @@ a.download-sdk { } .jspDrag { - background: #ccc; + background: #bbb; position: relative; top: 0; left: 0; @@ -4563,7 +5060,7 @@ a.download-sdk { display:none; margin: -1px auto 0; position: relative; - max-width: 940px; + width: 940px; height: 0px; } #player-frame { @@ -4575,22 +5072,6 @@ a.download-sdk { height: 330px; position: relative; } -#player-frame .close { - position: absolute; - right: 8px; - bottom: 4px; - width: 16px; - height: 16px; - margin: 0; - text-indent: -1000em; - top: 6px; - background: url(../images/close.png) no-repeat 0 0; - z-index:9999; -} -#player-frame .close:hover, #player-frame .close:focus { - background-position: -16px 0; - cursor:pointer; -} @@ -4645,7 +5126,7 @@ a.download-sdk { } .landing-docs .normal-links a { - color:#0ae !important; + color:#258aaf !important; } .plusone { @@ -4769,6 +5250,9 @@ a.download-sdk { .home-sections ul li.last { margin-right: 0px; } +.fullpage #footer { + margin-top: -40px; +} /************ DISTRIBUTE PAGES ******************/ @@ -4810,10 +5294,1228 @@ a.download-sdk { } .figure img, .border-img { - box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.37); margin-bottom: 15px; } +/************ RESOURCE CARDS ******************/ + +/* Resource cards, 12, 13, 16-col */ + +/* Basic card-styling with shadow */ +.resource-card { + border-radius: 1px; + box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.12); + background: #fefefe; +} + +/* Styling for background image including tinting and section icons in stacks */ +.card-bg { + display: block; + position: absolute; + vertical-align: top; + width: 100%; + left: 0; + top: 0; + background-size: cover; + background-repeat: no-repeat; + background-position: center; + background-image: url(../images/resource-card-default-android.jpg); +} +.card-bg:after { + content: ""; + display: block; + height: 100%; + width: 100%; + opacity: 1; + background: rgba(0, 0, 0, 0.2); + -webkit-transition: opacity 0.5s; + -moz-transition: opacity 0.5s; + -o-transition: opacity 0.5s; + transition: opacity 0.5s; +} +.static .card-bg:after { + display:none; +} +.card-bg .card-section-icon { + position: absolute; + top: 50%; + width: 100%; + margin-top: -35px; + text-align: center; + padding-top: 65px; + z-index: 100; +} +.card-bg .card-section-icon .icon { + position: absolute; + left: 50%; + margin-left: -28px; + top: 0px; + width: 56px; + height: 56px; + background-repeat: no-repeat; + background-position: 50% 50%; + background-image: url(../images/stack-icon.png); +} +.card-bg .card-section-icon .section { + text-transform: uppercase; + color: white; + font-size: 14px; +} + +.card-info { + position: absolute; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; + top: 0; + right: 0; + bottom: 0; + left: 0; + overflow: hidden; + background: #fefefe; + padding: 4px 12px 6px 12px; +} +.card-info .section { + text-transform: uppercase; + color: #898989; + font-size: 12px; + margin-bottom: 1px; +} +.card-info .title { + color: #363636; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + padding-bottom: 5px; + margin-bottom: -2px; + font-size: 16px; +} +.card-info .description { + overflow: hidden; +} +.card-info .description .text { + color: #464646; + font: 13px/15px Roboto Condensed; + overflow: hidden; + width:100%; +} +.card-info .description .util { + position: absolute; + right: 5px; + bottom: 70px; /*-2px;*/ + opacity: 0; + -webkit-transition: opacity 0.5s; + -moz-transition: opacity 0.5s; + -o-transition: opacity 0.5s; + transition: opacity 0.5s; +} +.card-info.empty-desc .title { + white-space: normal; + overflow: visible; +} +.card-info.empty-desc .description { + display: none; +} +/* Truncate card summaries at bounding box and + * and apply ellipsis at lower right */ +.ellipsis { + overflow: hidden; + float:right; + line-height: 15px; + width:100%; +} +.resource-card-6x6 .card-info .description .teddddddxt { + float:left; + position:relative; + margin-left:0; +} +.ellipsis:before { + content:""; + float: left; + width: 5px; + height:100%; +} +.ellipsis > *:first-child.text { + float: right; + width: 100% !important; + margin-left: -5px; +} +.ellipsis:after { + content: "\02026"; + height:17px; + padding-bottom:4px; + + box-sizing: content-box; + -webkit-box-sizing: content-box; + -moz-box-sizing: content-box; + + float: right; position: relative; + top: -16px; left: 100%; + width: 4em; margin-left: -4em; + padding-right: 5px; + + background: -webkit-gradient(linear, left top, right top, + from(rgba(255, 255, 255, 0)), to(white), color-stop(65%, white)); + background: -moz-linear-gradient(to right, rgba(255, 255, 255, 0), white 65%, white); + background: -o-linear-gradient(to right, rgba(255, 255, 255, 0), white 65%, white); + background: -ms-linear-gradient(to right, rgba(255, 255, 255, 0), white 65%, white); + background: linear-gradient(to right, rgba(255, 255, 255, 0), white 65%, white); +} +.ellipsis:after { + font-style: normal; color: #aaa; + font-size:13px; + text-align: right; +} + +/* Flow Layout */ +.resource-flow-layout { + display: inline-block; +} +.resource-flow-layout .resource-card, .resource-flow-layout .resource-card-stack { + float: left; + position: relative; +} +.resource-flow-layout .resource-card-stack > .resource-card { + margin-right: 0px !important; +} +.resource-flow-layout:after { + content: "."; + display: block; + height: 0; + position:relative; + clear: both; + visibility: hidden; +} +.resource-card:hover { + cursor: pointer; +} +.static .resource-card:hover { + cursor: auto; +} +.resource-card:hover .card-bg:after { + opacity: 0; +} +/* disabled to make way for fade/ellipsis truncation, + and the plusone moves up. +.resource-card:hover .card-info .description .text { + padding-right: 70px; +} */ +.resource-card:hover .card-info .description .util { + opacity: 1; +} + +/* Carousel Layout */ +/* Carousel styles for landing page */ +.resource-carousel-layout { + margin: 20px 0 20px 0; + position: relative; + overflow: hidden; +} +.resource-carousel-layout .slideshow-prev, .resource-carousel-layout .slideshow-next { + display: none; +} +.resource-carousel-layout .pagination { + bottom: 0px; +} +.resource-carousel-layout .frame li { + position: relative; +} +.resource-carousel-layout .frame li .card-bg { + height: 300px; +} +.resource-carousel-layout .frame li .card-info { + padding: 7px 15px 0px 15px; + top: 300px; +} +.resource-carousel-layout .frame li .card-info .section { + font-size: 13px; + margin-bottom: 7px; +} +.resource-carousel-layout .frame li .card-info .title { + font-size: 25px; + margin-bottom: 2px; +} +.resource-carousel-layout .frame li .card-info .description { + font-family: 15px/16px Roboto Condensed, sans-serif; +} +.resource-carousel-layout .frame li .card-info .description .text { + height: 40px; +} +.resource-carousel-layout .frame li .card-info .description .util { + bottom:97px; + right:4px; +} + +/* Stack Layout */ +.resource-stack-layout { + display: inline-block; +} +.resource-stack-layout .resource-card-stack { + float: left; + position: relative; +} +.resource-stack-layout .resource-card { + margin-bottom: 20px; + display: block; + position: relative; +} +.resource-stack-layout .section-card-menu > .card-info .section, .resource-stack-layout .section-card > .card-info .title { + /*text-transform: uppercase;*/ + color: #898989; + font-size: 17px; + line-height: 24px; + margin-bottom: 6px; +} +.resource-stack-layout .section-card { + height: 284px; +} +.resource-stack-layout .section-card > .card-bg { + height: 192px; +} +.resource-stack-layout .section-card > .card-info { + padding: 4px 12px 6px 12px; + top: 192px; +} +.resource-stack-layout .section-card > .card-info .section { + display: none; +} +.resource-stack-layout .section-card > .card-info .title { + font-size: 17px; + border-bottom: 1px solid #959595; + padding-bottom: 0px; +} +.resource-stack-layout .section-card > .card-info .description { + font-size: 13px; + line-height: 15px; +} +.resource-stack-layout .section-card > .card-info .description .text { + height: 30px; +} +.resource-stack-layout .related-card { + height: 90px; +} +.resource-stack-layout .related-card > .card-bg { + left: 0; + top: 0; + width: 90px; + height: 100%; + position: absolute; + display: block; +} +.resource-stack-layout .related-card > .card-info { + left: 90px; + padding: 4px 12px 4px 12px; +} +.resource-stack-layout .related-card > .card-info .section { + font-size: 12px; + margin-bottom: 1px; + display: none; +} +.resource-stack-layout .related-card > .card-info .title { + font-size: 16px; + margin-bottom: -2px; + white-space: normal; + overflow: visible; + text-overflow: ellipsis; +} +.resource-stack-layout .related-card > .card-info .title:after { + content: url(../images/link-out.png); + display: block; +} +.resource-stack-layout .related-card > .card-info .description { + display: none; +} +.resource-stack-layout .section-card-menu { + /* Flexible height */ + display: block; + height: auto; + width: auto; +} +.resource-stack-layout .section-card-menu .card-bg { + height: 155px; + /* Flexible height */ + position: relative; + display: inline-block; + vertical-align: top; +} +.resource-stack-layout .section-card-menu .card-info { + padding: 4px 12px 0px 12px; + /* Flexible height */ + position: relative; + left: auto; + top: auto; + right: auto; + bottom: auto; +} +.resource-stack-layout .section-card-menu .card-info ul { + list-style: none; + margin: 0; +} +.resource-stack-layout .section-card-menu .card-info ul li { + list-style: none; + margin: 0; + padding: 15px 0; + border-top-width: 1px; + border-top-style: solid; + border-top-color: #959595; +} +.resource-stack-layout .section-card-menu .card-info ul li a, .resource-stack-layout .section-card-menu .card-info ul li a:focus, .resource-stack-layout .section-card-menu .card-info ul li a:link, .resource-stack-layout .section-card-menu .card-info ul li a:visited, .resource-stack-layout .section-card-menu .card-info ul li a:active, .resource-stack-layout .section-card-menu .card-info ul li a:hover { + color: #363636 !important; +} +.resource-stack-layout .section-card-menu .card-info ul li:first-child { + border-top: none; +} +.resource-stack-layout .section-card-menu .card-info ul li:hover .title:after { + opacity: 1; + -webkit-transition: opacity 0.5s; + -moz-transition: opacity 0.5s; + -o-transition: opacity 0.5s; + transition: opacity 0.5s; +} +.resource-stack-layout .section-card-menu .card-info ul li:hover .description { + max-height: 30px; + opacity: 1; + -webkit-transition: max-height 0.5s, opacity 1s; + -moz-transition: max-height 0.5s, opacity 1s; + -o-transition: max-height 0.5s, opacity 1s; + transition: max-height 0.5s, opacity 1s; +} +.resource-stack-layout .section-card-menu .card-info .title { + font-size: 16px; + margin-bottom: -2px; + position: relative; +} +.resource-stack-layout .section-card-menu .card-info .title:after { + background: url(../images/stack-arrow-right.png); + content: ''; + opacity: 0; + -webkit-transition: opacity 0.25s; + -moz-transition: opacity 0.25s; + -o-transition: opacity 0.25s; + transition: opacity 0.25s; + position: absolute; + right: 0px; + top: 3px; + width: 10px; + height: 15px; +} +.resource-stack-layout .section-card-menu .card-info .title.more { + text-transform: uppercase; + color: #898989; + display: inline-block; +} +.resource-stack-layout .section-card-menu .card-info .title.more:after { + background: url(../images/stack-arrow-right.png); + content: ''; + display: block; + position: absolute; + right: -20px; + top: 3px; + width: 10px; + height: 15px; +} +.resource-stack-layout .section-card-menu .card-info .description { + max-height: 0px; + opacity: 0; + overflow: hidden; + font-size: 13px; + line-height: 15px; + /* Hover off */ + -webkit-transition: max-height 0.5s, opacity 0.5s; + -moz-transition: max-height 0.5s, opacity 0.5s; + -o-transition: max-height 0.5s, opacity 0.5s; + transition: max-height 0.5s, opacity 0.5s; +} +.resource-stack-layout .section-card-menu .card-info .description .text { + height: 30px; +} +.resource-stack-layout:after { + content: "."; + display: block; + height: 0; + clear: both; + visibility: hidden; +} + +/* Generate the flow layout styles for a 3-column 16-col span */ +.resource-flow-layout.col-16 { + margin: 0 -14px 0 0; + width: 954px; +} +.resource-flow-layout.col-16 .resource-card, .resource-flow-layout.col-16 .resource-card-stack { + margin: 0 14px 20px 0; +} +.resource-flow-layout.col-16 .resource-card-row-stack-last { + margin-bottom: 0px !important; +} +.resource-flow-layout.col-16 .resource-card-col-stack-last { + margin-bottom: 0px !important; +} +.resource-flow-layout.col-16 .resource-card-3x6 { + width: 145px; + height: 284px; +} +.resource-flow-layout.col-16 .resource-card-3x12 { + width: 145px; + height: 588px; +} +.resource-flow-layout.col-16 .resource-card-3x18 { + width: 145px; + height: 892px; +} +.resource-flow-layout.col-16 .resource-card-6x6 { + width: 304px; + height: 284px; +} +.resource-flow-layout.col-16 .resource-card-6x12 { + width: 304px; + height: 588px; +} +.resource-flow-layout.col-16 .resource-card-6x18 { + width: 304px; + height: 892px; +} +.resource-flow-layout.col-16 .resource-card-9x6 { + width: 463px; + height: 284px; +} +.resource-flow-layout.col-16 .resource-card-9x12 { + width: 463px; + height: 588px; +} +.resource-flow-layout.col-16 .resource-card-9x18 { + width: 463px; + height: 892px; +} +.resource-flow-layout.col-16 .resource-card-12x6 { + width: 622px; + height: 284px; +} +.resource-flow-layout.col-16 .resource-card-12x12 { + width: 622px; + height: 588px; +} +.resource-flow-layout.col-16 .resource-card-12x18 { + width: 622px; + height: 892px; +} +.resource-flow-layout.col-16 .resource-card-15x6 { + width: 781px; + height: 284px; +} +.resource-flow-layout.col-16 .resource-card-15x12 { + width: 781px; + height: 588px; +} +.resource-flow-layout.col-16 .resource-card-15x18 { + width: 781px; + height: 892px; +} +.resource-flow-layout.col-16 .resource-card-18x6 { + width: 940px; + height: 284px; +} +.resource-flow-layout.col-16 .resource-card-18x12 { + width: 940px; + height: 420px; +} +.resource-flow-layout.col-16 .resource-card-18x18 { + width: 940px; + height: 892px; +} +.resource-flow-layout.col-16 .resource-card-3x2 { + width: 145px; + height: 95px; +} +.resource-flow-layout.col-16 .resource-card-3x2x3 { + width: 145px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-16 .resource-card-3x3 { + width: 145px; + height: 142px; +} +.resource-flow-layout.col-16 .resource-card-3x3x2 { + width: 145px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-16 .resource-card-6x2 { + width: 304px; + height: 95px; +} +.resource-flow-layout.col-16 .resource-card-6x2x3 { + width: 304px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-16 .resource-card-6x3 { + width: 304px; + height: 142px; +} +.resource-flow-layout.col-16 .resource-card-6x3x2 { + width: 304px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-16 .resource-card-9x2 { + width: 463px; + height: 95px; +} +.resource-flow-layout.col-16 .resource-card-9x2x3 { + width: 463px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-16 .resource-card-9x3 { + width: 463px; + height: 142px; +} +.resource-flow-layout.col-16 .resource-card-9x3x2 { + width: 463px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-16 .resource-card-12x2 { + width: 622px; + height: 95px; +} +.resource-flow-layout.col-16 .resource-card-12x2x3 { + width: 622px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-16 .resource-card-12x3 { + width: 622px; + height: 142px; +} +.resource-flow-layout.col-16 .resource-card-12x3x2 { + width: 622px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-16 .resource-card-15x2 { + width: 781px; + height: 95px; +} +.resource-flow-layout.col-16 .resource-card-15x2x3 { + width: 781px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-16 .resource-card-15x3 { + width: 781px; + height: 142px; +} +.resource-flow-layout.col-16 .resource-card-15x3x2 { + width: 781px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-16 .resource-card-18x2 { + width: 940px; + height: 95px; +} +.resource-flow-layout.col-16 .resource-card-18x2x3 { + width: 940px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-16 .resource-card-18x3 { + width: 940px; + height: 142px; +} +.resource-flow-layout.col-16 .resource-card-18x3x2 { + width: 940px; + height: 138px; + margin-bottom: 8px; +} + +/* Generate the flow layout styles for a 3-column 16-col span */ +.resource-flow-layout.col-12 { + margin: 0 -14px 0 0; + width: 714px; +} + +.resource-flow-layout.col-12 .resource-card, .resource-flow-layout.col-12 .resource-card-stack { + margin: 0 14px 20px 0; +} +.resource-flow-layout.col-12 .resource-card-row-stack-last { + margin-bottom: 0px !important; +} +.resource-flow-layout.col-12 .resource-card-col-stack-last { + margin-bottom: 0px !important; +} +.resource-flow-layout.col-12 .resource-card-3x6 { + width: 105px; + height: 284px; +} +.resource-flow-layout.col-12 .resource-card-3x12 { + width: 105px; + height: 588px; +} +.resource-flow-layout.col-12 .resource-card-3x18 { + width: 105px; + height: 892px; +} +.resource-flow-layout.col-12 .resource-card-6x6 { + width: 224px; + height: 284px; +} +.resource-flow-layout.col-12 .resource-card-6x12 { + width: 224px; + height: 588px; +} +.resource-flow-layout.col-12 .resource-card-6x18 { + width: 224px; + height: 892px; +} +.resource-flow-layout.col-12 .resource-card-9x6 { + width: 343px; + height: 284px; +} +.resource-flow-layout.col-12 .resource-card-9x12 { + width: 343px; + height: 588px; +} +.resource-flow-layout.col-12 .resource-card-9x18 { + width: 343px; + height: 892px; +} +.resource-flow-layout.col-12 .resource-card-12x6 { + width: 462px; + height: 284px; +} +.resource-flow-layout.col-12 .resource-card-12x12 { + width: 462px; + height: 588px; +} +.resource-flow-layout.col-12 .resource-card-12x18 { + width: 462px; + height: 892px; +} +.resource-flow-layout.col-12 .resource-card-15x6 { + width: 581px; + height: 284px; +} +.resource-flow-layout.col-12 .resource-card-15x12 { + width: 581px; + height: 588px; +} +.resource-flow-layout.col-12 .resource-card-15x18 { + width: 581px; + height: 892px; +} +.resource-flow-layout.col-12 .resource-card-18x6 { + width: 700px; + height: 284px; +} +.resource-flow-layout.col-12 .resource-card-18x12 { + width: 700px; + height: 420px; +} +.resource-flow-layout.col-12 .resource-card-18x18 { + width: 700px; + height: 892px; +} +.resource-flow-layout.col-12 .resource-card-3x2 { + width: 105px; + height: 95px; +} +.resource-flow-layout.col-12 .resource-card-3x2x3 { + width: 105px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-12 .resource-card-3x3 { + width: 105px; + height: 142px; +} +.resource-flow-layout.col-12 .resource-card-3x3x2 { + width: 105px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-12 .resource-card-6x2 { + width: 224px; + height: 95px; +} +.resource-flow-layout.col-12 .resource-card-6x2x3 { + width: 224px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-12 .resource-card-6x3 { + width: 224px; + height: 142px; +} +.resource-flow-layout.col-12 .resource-card-6x3x2 { + width: 224px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-12 .resource-card-9x2 { + width: 343px; + height: 95px; +} +.resource-flow-layout.col-12 .resource-card-9x2x3 { + width: 343px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-12 .resource-card-9x3 { + width: 343px; + height: 142px; +} +.resource-flow-layout.col-12 .resource-card-9x3x2 { + width: 343px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-12 .resource-card-12x2 { + width: 462px; + height: 95px; +} +.resource-flow-layout.col-12 .resource-card-12x2x3 { + width: 462px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-12 .resource-card-12x3 { + width: 462px; + height: 142px; +} +.resource-flow-layout.col-12 .resource-card-12x3x2 { + width: 462px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-12 .resource-card-15x2 { + width: 581px; + height: 95px; +} +.resource-flow-layout.col-12 .resource-card-15x2x3 { + width: 581px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-12 .resource-card-15x3 { + width: 581px; + height: 142px; +} +.resource-flow-layout.col-12 .resource-card-15x3x2 { + width: 581px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-12 .resource-card-18x2 { + width: 700px; + height: 95px; +} +.resource-flow-layout.col-12 .resource-card-18x2x3 { + width: 700px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-12 .resource-card-18x3 { + width: 700px; + height: 142px; +} +.resource-flow-layout.col-12 .resource-card-18x3x2 { + width: 700px; + height: 138px; + margin-bottom: 8px; +} + +/* Generate the flow layout styles for a 3-column 13-col span */ + +.resource-flow-layout.col-13 { + margin: 0 -14px 0 0; + width: 774px; +} +.resource-flow-layout.col-13 .resource-card, .resource-flow-layout.col-13 .resource-card-stack { + margin: 0 14px 20px 0; +} +.resource-flow-layout.col-13 .resource-card-row-stack-last { + margin-bottom: 0px !important; +} +.resource-flow-layout.col-13 .resource-card-col-stack-last { + margin-bottom: 0px !important; +} +.resource-flow-layout.col-13 .resource-card-3x6 { + width: 115px; + height: 284px; +} +.resource-flow-layout.col-13 .resource-card-3x12 { + width: 115px; + height: 588px; +} +.resource-flow-layout.col-13 .resource-card-3x18 { + width: 115px; + height: 892px; +} +.resource-flow-layout.col-13 .resource-card-6x6 { + width: 244px; + height: 284px; +} +.resource-flow-layout.col-13 .resource-card-6x12 { + width: 244px; + height: 588px; +} +.resource-flow-layout.col-13 .resource-card-6x18 { + width: 244px; + height: 892px; +} +.resource-flow-layout.col-13 .resource-card-9x6 { + width: 373px; + height: 284px; +} +.resource-flow-layout.col-13 .resource-card-9x12 { + width: 373px; + height: 588px; +} +.resource-flow-layout.col-13 .resource-card-9x18 { + width: 373px; + height: 892px; +} +.resource-flow-layout.col-13 .resource-card-12x6 { + width: 502px; + height: 284px; +} +.resource-flow-layout.col-13 .resource-card-12x12 { + width: 502px; + height: 588px; +} +.resource-flow-layout.col-13 .resource-card-12x18 { + width: 502px; + height: 892px; +} +.resource-flow-layout.col-13 .resource-card-15x6 { + width: 631px; + height: 284px; +} +.resource-flow-layout.col-13 .resource-card-15x12 { + width: 631px; + height: 588px; +} +.resource-flow-layout.col-13 .resource-card-15x18 { + width: 631px; + height: 892px; +} +.resource-flow-layout.col-13 .resource-card-18x6 { + width: 760px; + height: 284px; +} +.resource-flow-layout.col-13 .resource-card-18x12 { + width: 760px; + height: 420px; +} +.resource-flow-layout.col-13 .resource-card-18x18 { + width: 760px; + height: 892px; +} +.resource-flow-layout.col-13 .resource-card-3x2 { + width: 115px; + height: 95px; +} +.resource-flow-layout.col-13 .resource-card-3x2x3 { + width: 115px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-13 .resource-card-3x3 { + width: 115px; + height: 142px; +} +.resource-flow-layout.col-13 .resource-card-3x3x2 { + width: 115px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-13 .resource-card-6x2 { + width: 244px; + height: 95px; +} +.resource-flow-layout.col-13 .resource-card-6x2x3 { + width: 244px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-13 .resource-card-6x3 { + width: 244px; + height: 142px; +} +.resource-flow-layout.col-13 .resource-card-6x3x2 { + width: 244px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-13 .resource-card-9x2 { + width: 373px; + height: 95px; +} +.resource-flow-layout.col-13 .resource-card-9x2x3 { + width: 373px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-13 .resource-card-9x3 { + width: 373px; + height: 142px; +} +.resource-flow-layout.col-13 .resource-card-9x3x2 { + width: 373px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-13 .resource-card-12x2 { + width: 502px; + height: 95px; +} +.resource-flow-layout.col-13 .resource-card-12x2x3 { + width: 502px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-13 .resource-card-12x3 { + width: 502px; + height: 142px; +} +.resource-flow-layout.col-13 .resource-card-12x3x2 { + width: 502px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-13 .resource-card-15x2 { + width: 631px; + height: 95px; +} +.resource-flow-layout.col-13 .resource-card-15x2x3 { + width: 631px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-13 .resource-card-15x3 { + width: 631px; + height: 142px; +} +.resource-flow-layout.col-13 .resource-card-15x3x2 { + width: 631px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-13 .resource-card-18x2 { + width: 760px; + height: 95px; +} +.resource-flow-layout.col-13 .resource-card-18x2x3 { + width: 760px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-13 .resource-card-18x3 { + width: 760px; + height: 142px; +} +.resource-flow-layout.col-13 .resource-card-18x3x2 { + width: 760px; + height: 138px; + margin-bottom: 8px; +} + +/* + The following are styles for cards in the flowlayout above, styled by the number of rows they span +*/ +/* Single row items, might be simpler to just apply a class */ +.resource-card-3x6 > .card-bg, .resource-card-6x6 > .card-bg, .resource-card-9x6 > .card-bg, .resource-card-12x6 > .card-bg, .resource-card-15x6 > .card-bg, .resource-card-18x6 > .card-bg { + height: 192px; +} +.resource-card-3x6 > .card-info, .resource-card-6x6 > .card-info, .resource-card-9x6 > .card-info, .resource-card-12x6 > .card-info, .resource-card-15x6 > .card-info, .resource-card-18x6 > .card-info { + padding: 4px 12px 6px 12px; + top: 192px; +} +.resource-card-3x6 > .card-info .section, .resource-card-6x6 > .card-info .section, .resource-card-9x6 > .card-info .section, .resource-card-12x6 > .card-info .section, .resource-card-15x6 > .card-info .section, .resource-card-18x6 > .card-info .section { + font-size: 12px; + margin-bottom: 1px; +} +.resource-card-3x6 > .card-info .title, .resource-card-6x6 > .card-info .title, .resource-card-9x6 > .card-info .title, .resource-card-12x6 > .card-info .title, .resource-card-15x6 > .card-info .title, .resource-card-18x6 > .card-info .title { + font-size: 16px; + margin-bottom: -2px; +} +.resource-card-3x6 > .card-info .description, .resource-card-6x6 > .card-info .description, .resource-card-9x6 > .card-info .description, .resource-card-12x6 > .card-info .description, .resource-card-15x6 > .card-info .description, .resource-card-18x6 > .card-info .description { + font-size: 13px; + line-height: 15px; +} +.resource-card-3x6 > .card-info .description .text, .resource-card-6x6 > .card-info .description .text, .resource-card-9x6 > .card-info .description .text, .resource-card-12x6 > .card-info .description .text, .resource-card-15x6 > .card-info .description .text, .resource-card-18x6 > .card-info .description .text { + height: 30px; +} + +/* Double row items */ +.resource-card-3x12 > .card-bg, .resource-card-6x12 > .card-bg, .resource-card-9x12 > .card-bg, .resource-card-12x12 > .card-bg, .resource-card-15x12 > .card-bg, .resource-card-18x12 > .card-bg { + height: 320px; +} +.resource-card-3x12 > .card-info, .resource-card-6x12 > .card-info, .resource-card-9x12 > .card-info, .resource-card-12x12 > .card-info, .resource-card-15x12 > .card-info, .resource-card-18x12 > .card-info { + padding: 4px 12px 6px 12px; + top: 320px; +} +.resource-card-3x12 > .card-info .section, .resource-card-6x12 > .card-info .section, .resource-card-9x12 > .card-info .section, .resource-card-12x12 > .card-info .section, .resource-card-15x12 > .card-info .section, .resource-card-18x12 > .card-info .section { + font-size: 12px; + margin-bottom: 1px; +} +.resource-card-3x12 > .card-info .title, .resource-card-6x12 > .card-info .title, .resource-card-9x12 > .card-info .title, .resource-card-12x12 > .card-info .title, .resource-card-15x12 > .card-info .title, .resource-card-18x12 > .card-info .title { + font-size: 16px; + margin-bottom: -2px; + white-space: normal; +} +.resource-card-3x12 > .card-info .description, .resource-card-6x12 > .card-info .description, .resource-card-9x12 > .card-info .description, .resource-card-12x12 > .card-info .description, .resource-card-15x12 > .card-info .description, .resource-card-18x12 > .card-info .description { + font-size: 13px; + line-height: 15px; +} + +/* 1/3 row items */ +.resource-card-3x2 > .card-bg, .resource-card-6x2 > .card-bg, .resource-card-9x2 > .card-bg, .resource-card-12x2 > .card-bg, .resource-card-15x2 > .card-bg, .resource-card-18x2 > .card-bg { + left: 0; + top: 0; + width: 90px; + height: 100%; + position: absolute; + display: block; +} +.resource-card-3x2 > .card-info, .resource-card-6x2 > .card-info, .resource-card-9x2 > .card-info, .resource-card-12x2 > .card-info, .resource-card-15x2 > .card-info, .resource-card-18x2 > .card-info { + left: 90px; + padding: 4px 12px 4px 12px; + height: 80px; + overflow: hidden; +} +.resource-card-3x2 > .card-info .section, .resource-card-6x2 > .card-info .section, .resource-card-6x3 > .card-info .section, .resource-card-9x2 > .card-info .section, .resource-card-12x2 > .card-info .section, .resource-card-15x2 > .card-info .section, .resource-card-18x2 > .card-info .section { + font-size: 12px; + margin-bottom: 1px; + /* display: none; */ +} +.resource-card-3x2 > .card-info .title, .resource-card-6x2 > .card-info .title, .resource-card-9x2 > .card-info .title, .resource-card-12x2 > .card-info .title, .resource-card-15x2 > .card-info .title, .resource-card-18x2 > .card-info .title { + font-size: 16px; + margin-bottom: -2px; + white-space: normal; + overflow: visible; + text-overflow: ellipsis; +} +.resource-card-3x2 > .card-info .title:after, .resource-card-6x2 > .card-info .title:after, .resource-card-9x2 > .card-info .title:after, .resource-card-12x2 > .card-info .title:after, .resource-card-15x2 > .card-info .title:after, .resource-card-18x2 > .card-info .title:after { + /* content: url(../images/link-out.png); */ + display: block; +} +.resource-card-3x2 > .card-info .description, .resource-card-6x2 > .card-info .description, .resource-card-9x2 > .card-info .description, .resource-card-12x2 > .card-info .description, .resource-card-15x2 > .card-info .description, .resource-card-18x2 > .card-info .description { + display: none; +} + + +/* Override to show the description instead of the content section */ +.no-section .resource-card-3x2 > .card-info .section, +.no-section .resource-card-6x2 > .card-info .section { + display: none; +} +.no-section .resource-card-3x2 > .card-info .description, +.no-section .resource-card-6x2 > .card-info .description { + display: block; +} + +/* 1/2 row items */ +.resource-card-3x3 > .card-bg, .resource-card-6x3 > .card-bg, .resource-card-9x3 > .card-bg, .resource-card-12x3 > .card-bg, .resource-card-15x3 > .card-bg, .resource-card-18x3 > .card-bg { + left: 0; + top: 0; + width: 90px; + height: 100%; + position: absolute; + display: block; +} +.resource-card-3x3 > .card-info, .resource-card-6x3 > .card-info, .resource-card-9x3 > .card-info, .resource-card-12x3 > .card-info, .resource-card-15x3 > .card-info, .resource-card-18x3 > .card-info { + left: 90px; + padding: 4px 12px 0px 12px; +} +.resource-card-3x3 > .card-info .section, .resource-card-6x3 > .card-info .section, .resource-card-9x3 > .card-info .section, .resource-card-12x3 > .card-info .section, .resource-card-15x3 > .card-info .section, .resource-card-18x3 > .card-info .section { + font-size: 12px; + margin-bottom: 1px; + display: none; +} +.resource-card-3x3 > .card-info .title, .resource-card-6x3 > .card-info .title, .resource-card-9x3 > .card-info .title, .resource-card-12x3 > .card-info .title, .resource-card-15x3 > .card-info .title, .resource-card-18x3 > .card-info .title { + font-size: 16px; + margin-bottom: -2px; + white-space: normal; + overflow: visible; +} +.resource-card-3x3 > .card-info .description .text, .resource-card-6x3 > .card-info .description .text, .resource-card-9x3 > .card-info .description .text, .resource-card-12x3 > .card-info .description .text, .resource-card-15x3 > .card-info .description .text, .resource-card-18x3 > .card-info .description .text { + font-size: 12px; + line-height: 15px; + padding-right: 0px !important; + height: 80px; +} +.resource-card-3x3 > .card-info .description .util, .resource-card-6x3 > .card-info .description .util, .resource-card-9x3 > .card-info .description .util, .resource-card-12x3 > .card-info .description .util, .resource-card-15x3 > .card-info .description .util, .resource-card-18x3 > .card-info .description .util { + display: none; +} +/* placement of plusone */ +.resource-card-6x12 > .card-info .description .util, .resource-card-9x12 > .card-info .description .util, .resource-card-12x12 > .card-info .description .util, .resource-card-15x12 > .card-info .description .util { + bottom:2px; +} +.resource-card-18x12 > .card-info .description .util { + bottom:2px; +} +/* Overrides for col-16 6x6 cards linking to local content on landing pages. + Suppresses "section" and puts the title above a hairline rule. */ +.landing .card-info .section, .resource-flow-layout.col-16.landing .resource-card-9x6 .card-info .section { + display:none; +} +.landing .card-info .title { + color: #898989; + font-size: 17px; + line-height: 24px; + margin-bottom: 6px; + border-bottom: 1px solid #959595; + padding-bottom: 0px; +} +.landing .card-info .description { + font-size: 13px; + line-height: 15px; +} +.landing .card-info .description .text { +height:30px; +} +.landing .resource-card-6x6 > .card-info .description .util, .landing .resource-card-9x6 > .card-info .description .util { + bottom:2px; +} +/* + Generate a resource stack layout for a 3 column widget spanning 16 grid cols +*/ +.resource-stack-layout.col-16 { + margin: 0 -14px 0 0; + width: 954px; +} +.resource-stack-layout.col-16 .resource-card-stack { + margin: 0 14px 0 0; + width: 304px; +} + +/* Example of card menu tinting */ +.resource-widget[data-section=distribute\/tools] .section-card-menu +.card-bg:after { + background: rgba(126, 55, 148, 0.4) !important; +} +.resource-widget[data-section=distribute\/tools] .section-card-menu +.card-section-icon .icon { + background-color: #7e3794 !important; +} +.resource-widget[data-section=distribute\/tools] .section-card-menu +.card-info ul li { + border-top-color: #7e3794 !important; +} + +/* tinting for stacks */ + +div.jd-descr > .resource-widget[data-section=distribute\/tools] +.section-card-menu .card-info ul li { + border-top-color: #7e3794 !important; +} + + /** * UTILITIES @@ -4840,13 +6542,11 @@ a.download-sdk { */ .landing-h1 { - color: #44555d; - font-weight: 300; - font-size: 56px; - line-height: 80px; + font-weight: 100; + font-size: 60px; + line-height: 78px; text-align: center; letter-spacing: -1px; - margin-bottom: 6px; } .landing-pre-h1 { @@ -4857,11 +6557,11 @@ a.download-sdk { text-align: center; letter-spacing: -1px; text-transform: uppercase; + } .landing-h1.hero { text-align: left; - color: #fff; } .landing-h2 { @@ -4872,10 +6572,10 @@ a.download-sdk { } .landing-subhead { - color: #78868d; + color: #999999; font-size: 20px; - font-weight: 300; - line-height: 32px; + line-height: 28px; + font-weight:300; text-align: center; } .landing-subhead.hero { @@ -4912,21 +6612,23 @@ a.download-sdk { * LAYOUT */ +#body-content, +.fullpage, +#jd-content, +.jd-descr, +.landing-body-content { + height: 100%; +} + .landing-section { - background: #eceff1; - clear: both; - padding: 80px 20px 80px; - margin: 0 -20px; + padding: 80px 10px 80px; + width: 100%; + margin-left: -10px; text-rendering: optimizeLegibility; } -@media (max-width: 719px) { - .responsive .landing-section { - margin-left: -10px; - margin-right: -10px; - padding-left: 10px; - padding-right: 10px; - } +#extending-android-to-wearables { + padding-top: 30px; } .landing-short-section { @@ -4934,7 +6636,7 @@ a.download-sdk { } .landing-gray-background { - background-color: #b0bec5; + background-color: #e9e9e9; } .landing-white-background { @@ -4946,19 +6648,24 @@ a.download-sdk { background-color: hsl(8, 70%, 54%); } -.landing-red-background .landing-h1 { - color: white; -} - -.landing-red-background .landing-subhead { +.landing-subhead-red { color: hsl(8, 71%, 84%); text-align: left; } +.landing-subhead-red p { + margin-top: 20px; +} + +.landing-hero-container { + height: 100%; +} + .preview-hero { - height: calc(100vh - 128px); + height: calc(100% - 110px); min-height: 504px; + margin-top: -5px; padding-top: 0; padding-bottom: 0; background-image: url(../../preview/images/hero.jpg); @@ -4970,8 +6677,9 @@ a.download-sdk { } .wear-hero { - height: calc(100vh - 128px); + height: calc(100% - 110px); min-height: 504px; + margin-top: -5px; padding-top: 0; padding-bottom: 0; background-image: url(../../wear/images/hero.jpg); @@ -4983,8 +6691,9 @@ a.download-sdk { } .tv-hero { - height: calc(100vh - 128px); + height: calc(100% - 110px); min-height: 504px; + margin-top: -5px; padding-top: 0; padding-bottom: 0; background-image: url(../../tv/images/hero.jpg); @@ -4996,8 +6705,9 @@ a.download-sdk { } .auto-hero { - height: calc(100vh - 128px); + height: calc(100% - 110px); min-height: 504px; + margin-top: -5px; padding-top: 0; padding-bottom: 0; background-image: url(../../auto/images/hero.jpg); @@ -5010,16 +6720,16 @@ a.download-sdk { .landing-hero-scrim { background: black; - height: 100%; - left: 0; - position: absolute; opacity: .2; + position: absolute; width: 100%; + height: 100%; + margin-left: -10px; } .landing-hero-wrap { margin: 0 auto; - max-width: 940px; + width: 940px; clear: both; height: 100%; position: relative; @@ -5206,6 +6916,17 @@ a.landing-button:visited { margin-bottom: 20px; } +.col-3-wide { + display: inline; + float: left; + margin-left: 10px; + margin-right: 10px; +} + +.col-3-wide { + width: 302px; +} + /** * ANIMATION */ @@ -5249,7 +6970,7 @@ a.landing-button:visited { } #video-frame { - max-width:940px; + width:940px; height:100%; margin:72px auto; display:none; @@ -5320,7 +7041,8 @@ Styles for d.a.c/index: /* Generic full screen carousel styling to be used across pages. */ .fullscreen-carousel { - margin: 0 -20px; + margin: 0 -10px; + width: 100%; overflow: hidden; position: relative; } @@ -5359,6 +7081,7 @@ Styles for d.a.c/index: font-weight: 300; font-size: 18px; line-height: 24px; + -webkit-font-smoothing: antialiased; } .fullscreen-carousel .hero .hero-bg { @@ -5492,19 +7215,48 @@ Styles for d.a.c/index: } + + + +/* + Styles for the entity link used in the actions bar and in the cta of + the resources that appear in the tab carousel. +*/ +.actions-bar a:after, +.resource .cta:after { + content: '›'; + font-weight: 400; + font-size: 22px; + left: 5px; + line-height: 1; + position: relative; + top: 1px; + transition: left 190ms ease-out; +} + +.actions-bar a:hover:after, +.resource .cta:hover:after { + left: 10px; +} + + + + /* Styles for the actions bar. */ .actions-bar { - background: #b0bec5; + background: #9acd00; + margin: 0 -10px; text-align: center; } .actions-bar .actions { - padding: 24px 0; + padding: 30px 0 30px; text-align: justify; font-size: 0.1px; line-height: 0.1px; + margin: 0 10px 0 0; } .actions-bar .actions:after { @@ -5518,28 +7270,23 @@ Styles for d.a.c/index: } .actions-bar a { - font-size: 24px; - line-height: 50px; + font-size: 21px; + line-height: 27px; color: #fff; font-weight: 300; + -webkit-font-smoothing: antialiased; } -.actions-bar .dac-sprite { - margin: 0 -6px 0 -12px; - -webkit-transition: all 190ms ease-out; - transition: all 190ms ease-out; +.actions-bar a:after { + top: 0px; + font-size: 22px; } -.actions-bar a:hover .dac-sprite { - - transform: translateX(5px); +.actions-bar a:hover { + color: #fff !important; } -@media (max-width: 719px) { - .responsive .actions-bar .actions > div { - display: block; - } -} + @@ -5703,3043 +7450,3 @@ a.home-new-cta-btn:hover, .resource-card-6x2 > .card-bg.helpouts-card-bg:after { display:none; } - -.dac-visible-mobile-block, .dac-mobile-only, .dac-visible-mobile-inline, .dac-visible-mobile-inline-block, .dac-visible-tablet-block, .dac-visible-tablet-inline, .dac-visible-tablet-inline-block, .dac-visible-desktop-block, .dac-visible-desktop-inline, .dac-visible-desktop-inline-block { - display: none !important; -} - -@media (max-width: 719px) { - .responsive .dac-hidden-mobile { - display: none !important; - } - - .responsive .dac-visible-mobile-block, .responsive .dac-mobile-only { - display: block !important; - } - - .responsive .dac-visible-mobile-inline { - display: inline !important; - } - - .responsive .dac-visible-mobile-inline-block { - display: inline-block !important; - } -} - -@media (min-width: 720px) and (max-width: 979px) { - .responsive .dac-hidden-tablet { - display: none !important; - } - - .responsive .dac-visible-tablet-block { - display: block !important; - } - - .responsive .dac-visible-tablet-inline { - display: inline !important; - } - - .responsive .dac-visible-tablet-inline-block { - display: inline-block !important; - } -} - -@media (min-width: 980px) { - .responsive .dac-hidden-desktop { - display: none !important; - } - - .responsive .dac-visible-desktop-block { - display: block !important; - } - - .responsive .dac-visible-desktop-inline { - display: inline !important; - } - - .responsive .dac-visible-desktop-inline-block { - display: inline-block !important; - } -} - -/* New CSS */ -/************ RESOURCE CARDS ******************/ -/* Basic card-styling with shadow */ -.resource-card { - background: #fff; - box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.21); - display: block; - position: relative; -} - -/* Styling for background image including tinting and section icons in stacks */ -.card-bg { - bottom: 131px; - display: block; - position: absolute; - vertical-align: top; - width: 100%; - left: 0; - top: 0; - background-size: cover; - background-repeat: no-repeat; - background-position: center; - background-image: url(../images/resource-card-default-android.jpg); -} - -.card-bg:after { - content: ""; - display: block; - height: 100%; - width: 100%; - opacity: 1; - background: rgba(0, 0, 0, 0.05); - -webkit-transition: opacity 0.5s; - transition: opacity 0.5s; -} - -.static .card-bg:after { - display: none; -} - -.card-bg .card-section-icon { - position: absolute; - top: 50%; - width: 100%; - margin-top: -35px; - text-align: center; - padding-top: 65px; - z-index: 100; -} - -.card-bg .card-section-icon .icon { - position: absolute; - left: 50%; - margin-left: -28px; - top: 0px; - width: 56px; - height: 56px; - background-repeat: no-repeat; - background-position: 50% 50%; - background-image: url(../images/stack-icon.png); -} - -.card-bg .card-section-icon .section { - text-transform: uppercase; - color: white; - font-size: 14px; -} - -.card-info { - position: absolute; - box-sizing: border-box; - height: 131px; - right: 0; - bottom: 0; - left: 0; - overflow: hidden; - background: #fefefe; - padding: 6px 12px; -} - -.card-info .section { - color: #898989; - font-size: 11px; - font-weight: 700; - letter-spacing: 0.77px; - line-height: 20px; - text-transform: uppercase; -} - -.card-info .title { - color: #333; - font-size: 18px; - font-weight: 500; - line-height: 24px; - margin-bottom: 2px; - max-height: 48px; - overflow: hidden; - padding-bottom: 5px; - text-overflow: ellipsis; - white-space: normal; -} - -.card-info .description { - overflow: hidden; -} - -.card-info .description .text { - color: #666; - font-size: 14px; - height: 60px; - line-height: 20px; - overflow: hidden; - width: 100%; -} - -.card-info .description .util { - position: absolute; - right: 5px; - bottom: 70px; - opacity: 0; - -webkit-transition: opacity 0.5s; - transition: opacity 0.5s; -} - -.card-info.empty-desc .title { - white-space: normal; - overflow: visible; -} - -.card-info.empty-desc .description { - display: none; -} - -/* Truncate card summaries at bounding box and - * and apply ellipsis at lower right */ -.ellipsis { - overflow: hidden; - float: right; - line-height: 15px; - width: 100%; -} - -.ellipsis:before { - content: ""; - float: left; - width: 5px; - height: 100%; -} - -.ellipsis > *:first-child.text { - float: right; - width: 100% !important; - margin-left: -5px; -} - -.ellipsis:after { - content: "\02026"; - height: 17px; - padding-bottom: 4px; - box-sizing: content-box; - float: right; - position: relative; - top: -16px; - left: 100%; - width: 4em; - margin-left: -4em; - padding-right: 5px; - background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(white), color-stop(65%, white)); - background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0), white 65%, white); - background: linear-gradient(to right, rgba(255, 255, 255, 0), white 65%, white); -} - -.ellipsis:after { - font-style: normal; - color: #aaa; - font-size: 13px; - text-align: right; -} - -.resource-card:hover { - cursor: pointer; -} - -.static .resource-card:hover { - cursor: auto; -} - -.resource-card:hover .card-bg:after { - opacity: 0; -} - -.resource-card:hover .card-info .description .util { - opacity: 1; -} - -/* Carousel Layout */ -/* Carousel styles for landing page */ -.resource-carousel-layout { - height: 531px; - margin: 20px 0 20px 0; - padding: 0 !important; - position: relative; - overflow: hidden; -} - -.resource-carousel-layout .slideshow-prev, .resource-carousel-layout .slideshow-next { - display: none; -} - -.resource-carousel-layout .pagination { - bottom: 97px; - left: auto; - padding-right: 10px; - right: 0; - text-align: right; - width: 16.66666667%; -} - -.resource-carousel-layout .pagination ul li { - text-indent: 8000px; -} - -.resource-carousel-layout .frame li { - position: relative; -} - -.resource-carousel-layout .frame li .card-bg { - bottom: 131px; -} - -.resource-carousel-layout .frame li .card-info { - height: 131px; - padding: 6px 12px; - top: auto; -} - -.resource-carousel-layout .frame li .card-info .title { - font-size: 28px; - font-weight: 400; - line-height: 32px; -} - -.resource-carousel-layout .frame li .card-info .description .text { - height: 40px; -} - -.resource-carousel-layout .frame li .card-info .description .util { - bottom: 97px; - right: 4px; -} - -/* Stack Layout */ -.resource-stack-layout { - display: inline-block; - padding: 0; -} - -.resource-stack-layout .section-card-menu > .card-info .section, .resource-stack-layout .section-card > .card-info .title { - /*text-transform: uppercase;*/ - color: #898989; - font-size: 17px; - line-height: 24px; - margin-bottom: 6px; -} - -.resource-stack-layout .section-card { - height: 284px; -} - -.resource-stack-layout .section-card > .card-bg { - height: 192px; -} - -.resource-stack-layout .section-card > .card-info { - padding: 4px 12px 6px 12px; - top: 192px; -} - -.resource-stack-layout .section-card > .card-info .section { - display: none; -} - -.resource-stack-layout .section-card > .card-info .title { - font-size: 17px; - border-bottom: 1px solid #959595; - padding-bottom: 0px; -} - -.resource-stack-layout .section-card > .card-info .description { - font-size: 13px; - line-height: 15px; -} - -.resource-stack-layout .section-card > .card-info .description .text { - height: 30px; -} - -.resource-stack-layout .related-card { - height: 90px; -} - -.resource-stack-layout .related-card > .card-bg { - left: 0; - top: 0; - width: 90px; - height: 100%; - position: absolute; - display: block; -} - -.resource-stack-layout .related-card > .card-info { - left: 90px; - padding: 4px 12px 4px 12px; -} - -.resource-stack-layout .related-card > .card-info .section { - font-size: 12px; - margin-bottom: 1px; - display: none; -} - -.resource-stack-layout .related-card > .card-info .title { - font-size: 16px; - margin-bottom: -2px; - white-space: normal; - overflow: visible; - text-overflow: ellipsis; -} - -.resource-stack-layout .related-card > .card-info .title:after { - content: url(../images/link-out.png); - display: block; -} - -.resource-stack-layout .related-card > .card-info .description { - display: none; -} - -.resource-stack-layout .section-card-menu { - /* Flexible height */ - display: block; - height: auto; - width: auto; -} - -.resource-stack-layout .section-card-menu .card-bg { - height: 155px; - /* Flexible height */ - position: relative; - display: inline-block; - vertical-align: top; -} - -.resource-stack-layout .section-card-menu .card-info { - padding: 4px 12px 0px 12px; - /* Flexible height */ - position: relative; - left: auto; - top: auto; - right: auto; - bottom: auto; -} - -.resource-stack-layout .section-card-menu .card-info ul { - list-style: none; - margin: 0; -} - -.resource-stack-layout .section-card-menu .card-info ul li { - list-style: none; - margin: 0; - padding: 15px 0; - border-top-width: 1px; - border-top-style: solid; - border-top-color: #959595; -} - -.resource-stack-layout .section-card-menu .card-info ul li a, .resource-stack-layout .section-card-menu .card-info ul li a:focus, .resource-stack-layout .section-card-menu .card-info ul li a:link, .resource-stack-layout .section-card-menu .card-info ul li a:visited, .resource-stack-layout .section-card-menu .card-info ul li a:active, .resource-stack-layout .section-card-menu .card-info ul li a:hover { - color: #333 !important; -} - -.resource-stack-layout .section-card-menu .card-info ul li:first-child { - border-top: none; -} - -.resource-stack-layout .section-card-menu .card-info ul li:hover .title:after { - opacity: 1; - -webkit-transition: opacity 0.5s; - transition: opacity 0.5s; -} - -.resource-stack-layout .section-card-menu .card-info ul li:hover .description { - max-height: 30px; - opacity: 1; - -webkit-transition: max-height 0.5s, opacity 1s; - transition: max-height 0.5s, opacity 1s; -} - -.resource-stack-layout .section-card-menu .card-info .title { - font-size: 16px; - margin-bottom: -2px; - position: relative; -} - -.resource-stack-layout .section-card-menu .card-info .title:after { - background: url(../images/stack-arrow-right.png); - content: ''; - opacity: 0; - -webkit-transition: opacity 0.25s; - transition: opacity 0.25s; - position: absolute; - right: 0px; - top: 3px; - width: 10px; - height: 15px; -} - -.resource-stack-layout .section-card-menu .card-info .title.more { - text-transform: uppercase; - color: #898989; - display: inline-block; -} - -.resource-stack-layout .section-card-menu .card-info .title.more:after { - background: url(../images/stack-arrow-right.png); - content: ''; - display: block; - position: absolute; - right: -20px; - top: 3px; - width: 10px; - height: 15px; -} - -.resource-stack-layout .section-card-menu .card-info .description { - max-height: 0px; - opacity: 0; - overflow: hidden; - font-size: 13px; - line-height: 15px; - /* Hover off */ - -webkit-transition: max-height 0.5s, opacity 0.5s; - transition: max-height 0.5s, opacity 0.5s; -} - -.resource-stack-layout .section-card-menu .card-info .description .text { - height: 30px; -} - -.resource-stack-layout:after { - content: "."; - display: block; - height: 0; - clear: both; - visibility: hidden; -} - -.resource-card, .resource-card-stack { - margin-bottom: 20px; -} - -.resource-card-row-stack-last { - margin-bottom: 0px !important; -} - -.resource-card-col-stack-last { - margin-bottom: 0px !important; -} - -.resource-card-3x6 { - height: 300px; -} - -.resource-card-3x12 { - height: 620px; -} - -.resource-card-3x18 { - height: 940px; -} - -.resource-card-6x6 { - height: 300px; -} - -.resource-card-6x12 { - height: 620px; -} - -.resource-card-6x18 { - height: 940px; -} - -.resource-card-9x6 { - height: 300px; -} - -.resource-card-9x12 { - height: 620px; -} - -.resource-card-9x18 { - height: 940px; -} - -.resource-card-12x6 { - height: 300px; -} - -.resource-card-12x12 { - height: 620px; -} - -.resource-card-12x18 { - height: 940px; -} - -.resource-card-15x6 { - height: 300px; -} - -.resource-card-15x12 { - height: 620px; -} - -.resource-card-15x18 { - height: 940px; -} - -.resource-card-18x6 { - height: 300px; -} - -.resource-card-18x12 { - height: 620px; -} - -.resource-card-18x18 { - height: 940px; -} - -.resource-card-3x2 { - height: 100px; -} - -.resource-card-3x2x3 { - height: 90px; - margin-bottom: 15px; -} - -.resource-card-3x3 { - height: 150px; -} - -.resource-card-3x3x2 { - height: 142px; - margin-bottom: 16px; -} - -.resource-card-6x2 { - height: 100px; -} - -.resource-card-6x2x3 { - height: 90px; - margin-bottom: 15px; -} - -.resource-card-6x3 { - height: 150px; -} - -.resource-card-6x3x2 { - height: 142px; - margin-bottom: 16px; -} - -.resource-card-9x2 { - height: 100px; -} - -.resource-card-9x2x3 { - height: 90px; - margin-bottom: 15px; -} - -.resource-card-9x3 { - height: 150px; -} - -.resource-card-9x3x2 { - height: 142px; - margin-bottom: 16px; -} - -.resource-card-12x2 { - height: 100px; -} - -.resource-card-12x2x3 { - height: 90px; - margin-bottom: 15px; -} - -.resource-card-12x3 { - height: 150px; -} - -.resource-card-12x3x2 { - height: 142px; - margin-bottom: 16px; -} - -.resource-card-15x2 { - height: 100px; -} - -.resource-card-15x2x3 { - height: 90px; - margin-bottom: 15px; -} - -.resource-card-15x3 { - height: 150px; -} - -.resource-card-15x3x2 { - height: 142px; - margin-bottom: 16px; -} - -.resource-card-18x2 { - height: 100px; -} - -.resource-card-18x2x3 { - height: 90px; - margin-bottom: 15px; -} - -.resource-card-18x3 { - height: 150px; -} - -.resource-card-18x3x2 { - height: 142px; - margin-bottom: 16px; -} - -/* - The following are styles for cards in the flowlayout above, styled by the number of rows they span -*/ -/* Single row, 2 column items. */ -.resource-card-9x6 { - height: 390px; -} - -/* Double row, 1 column items. Eg full width video thumbnails. */ -.resource-card-18x12 { - height: 558px; -} - -/* 1/3 row items */ -.resource-card-3x2 > .card-bg, .resource-card-6x2 > .card-bg, .resource-card-9x2 > .card-bg, .resource-card-12x2 > .card-bg, .resource-card-15x2 > .card-bg, .resource-card-18x2 > .card-bg { - left: 0; - top: 0; - width: 90px; - height: 100%; - position: absolute; - display: block; -} - -.resource-card-3x2 > .card-info, .resource-card-6x2 > .card-info, .resource-card-9x2 > .card-info, .resource-card-12x2 > .card-info, .resource-card-15x2 > .card-info, .resource-card-18x2 > .card-info { - height: 100%; - left: 90px; - padding: 6px 12px; - overflow: hidden; -} - -.resource-card-3x2 > .card-info .title, .resource-card-6x2 > .card-info .title, .resource-card-9x2 > .card-info .title, .resource-card-12x2 > .card-info .title, .resource-card-15x2 > .card-info .title, .resource-card-18x2 > .card-info .title { - max-height: 48px; - white-space: normal; -} - -.resource-card-3x2 > .card-info .description, .resource-card-6x2 > .card-info .description, .resource-card-9x2 > .card-info .description, .resource-card-12x2 > .card-info .description, .resource-card-15x2 > .card-info .description, .resource-card-18x2 > .card-info .description { - display: none; -} - -.resource-card-3x2 > .card-info .text, .resource-card-6x2 > .card-info .text, .resource-card-9x2 > .card-info .text, .resource-card-12x2 > .card-info .text, .resource-card-15x2 > .card-info .text, .resource-card-18x2 > .card-info .text { - height: auto; -} - -/* Override to show the description instead of the content section */ -.no-section .resource-card-3x2 > .card-info .section, .no-section .resource-card-6x2 > .card-info .section { - display: none; -} - -.no-section .resource-card-3x2 > .card-info .description, .no-section .resource-card-6x2 > .card-info .description { - display: block; -} - -/* 1/2 row items */ -.resource-card-3x3, .resource-card-6x3, .resource-card-9x3, .resource-card-12x3, .resource-card-15x3, .resource-card-18x3 { - height: 160px; -} - -.resource-card-3x3 > .card-bg, .resource-card-6x3 > .card-bg, .resource-card-9x3 > .card-bg, .resource-card-12x3 > .card-bg, .resource-card-15x3 > .card-bg, .resource-card-18x3 > .card-bg { - left: 0; - top: 0; - width: 90px; - height: 100%; - position: absolute; - display: block; -} - -.resource-card-3x3 > .card-info, .resource-card-6x3 > .card-info, .resource-card-9x3 > .card-info, .resource-card-12x3 > .card-info, .resource-card-15x3 > .card-info, .resource-card-18x3 > .card-info { - height: 100%; - left: 90px; - padding: 6px 12px; -} - -.resource-card-3x3 > .card-info .section, .resource-card-6x3 > .card-info .section, .resource-card-9x3 > .card-info .section, .resource-card-12x3 > .card-info .section, .resource-card-15x3 > .card-info .section, .resource-card-18x3 > .card-info .section { - display: none; -} - -.resource-card-3x3 > .card-info .title, .resource-card-6x3 > .card-info .title, .resource-card-9x3 > .card-info .title, .resource-card-12x3 > .card-info .title, .resource-card-15x3 > .card-info .title, .resource-card-18x3 > .card-info .title { - max-height: 96px; - white-space: normal; -} - -.resource-card-3x3 > .card-info .text, .resource-card-6x3 > .card-info .text, .resource-card-9x3 > .card-info .text, .resource-card-12x3 > .card-info .text, .resource-card-15x3 > .card-info .text, .resource-card-18x3 > .card-info .text { - height: auto; -} - -.resource-card-3x3 > .card-info .util, .resource-card-6x3 > .card-info .util, .resource-card-9x3 > .card-info .util, .resource-card-12x3 > .card-info .util, .resource-card-15x3 > .card-info .util, .resource-card-18x3 > .card-info .util { - display: none; -} - -/* placement of plusone */ -.resource-card-6x12 > .card-info .description .util, .resource-card-9x12 > .card-info .description .util, .resource-card-12x12 > .card-info .description .util, .resource-card-15x12 > .card-info .description .util { - bottom: 2px; -} - -.resource-card-18x12 > .card-info .description .util { - bottom: 2px; -} - -/* Overrides for col-16 6x6 cards linking to local content on landing pages. - Suppresses "section". */ -.landing .card-info .section { - display: none; -} - -/* - Generate a resource stack layout for a 3 column widget spanning 16 grid cols -*/ -.resource-stack-layout.col-16 { - margin: 0 -14px 0 0; - width: 954px; -} - -.resource-stack-layout.col-16 .resource-card-stack { - margin: 0 14px 0 0; - width: 304px; -} - -/* Example of card menu tinting */ -.resource-widget[data-section=distribute\/tools] .section-card-menu .card-bg:after { - background: rgba(126, 55, 148, 0.4) !important; -} - -.resource-widget[data-section=distribute\/tools] .section-card-menu .card-section-icon .icon { - background-color: #7e3794 !important; -} - -.resource-widget[data-section=distribute\/tools] .section-card-menu .card-info ul li { - border-top-color: #7e3794 !important; -} - -/* tinting for stacks */ -div.jd-descr > .resource-widget[data-section=distribute\/tools] .section-card-menu .card-info ul li { - border-top-color: #7e3794 !important; -} - -.dac-fab { - background: #fff; - box-shadow: 0 2px 2px rgba(0, 0, 0, 0.21); - box-sizing: border-box; - border-radius: 50%; - border: none; - cursor: pointer; - display: inline-block; - font-size: 0; - height: 36px; - line-height: 36px; - outline: 0; - padding: 0; - text-align: center; - -webkit-transition: box-shadow .3s; - transition: box-shadow .3s; - vertical-align: middle; - width: 36px; -} - -.dac-fab:hover, a:hover > .dac-fab { - box-shadow: 0 3px 8px rgba(0, 0, 0, 0.21); -} - -.dac-fab.dac-primary { - background: #00c7a0; -} - -.dac-fab.dac-large { - height: 54px; - line-height: 54px; - width: 54px; -} - -/* Footer component */ -.dac-footer { - border-top: 1px solid #f9f9f9; - color: #999; - font-size: 12px; - padding-bottom: 20px; -} - -.dac-footer a { - color: #999; -} - -.dac-footer p { - margin: 7px 0 0; -} - -.dac-footer-main { - padding: 30px 0; -} - -.dac-footer-reachout { - text-align: right; -} - -.dac-footer-contact, .dac-footer-social { - display: inline; -} - -.dac-footer-social-link + .dac-footer-social-link { - margin-left: 8px; -} - -.dac-footer a.dac-footer-getnews, .dac-footer a.dac-footer-contact-link { - color: #000; - cursor: pointer; - font-size: 20px; - font-weight: 300; - margin-right: 24px; - vertical-align: middle; -} - -.dac-footer-getnews > .dac-fab { - margin-left: 4px; -} - -.dac-footer-separator { - background: #f9f9f9; - margin: 0 0 12px; -} - -.dac-footer-links a + a:before { - content: '|'; - cursor: default; - margin: 0 10px 0 8px; -} - -.dac-footer .locales { - float: right; - margin: 0; -} - -.dac-footer .locales select { - background-color: #f9f9f9; - border: none; - border-radius: 0; - color: #999; - font-size: 12px; - height: auto; - margin-top: -2px; - padding: 8px 12px; -} - -@media (max-width: 719px) { - .responsive .dac-footer-reachout { - text-align: left; - } - - .responsive .dac-footer-social { - display: block; - } - - .responsive .dac-footer-social-link, .responsive .dac-footer-contact-link { - display: inline-block; - margin-top: 20px; - } - - .responsive .dac-footer .locales { - display: block; - float: none; - margin-top: 15px; - } -} - -/* ============================================================================= - Columns - ========================================================================== */ -.wrap { - margin: 0 auto; - max-width: 940px; - clear: both; -} - -.cols { - margin-left: -10px; - margin-right: -10px; - /** - * For modern browsers - * 1. The space content is one way to avoid an Opera bug when the - * contenteditable attribute is included anywhere else in the document. - * Otherwise it causes space to appear at the top and bottom of elements - * that are clearfixed. - * 2. The use of `table` rather than `block` is only necessary if using - * `:before` to contain the top-margins of child elements. - */ -} - -.cols:before, .cols:after { - content: ' '; - /* 1 */ - display: table; - /* 2 */ -} - -.cols:after { - clear: both; -} - -[class*=col-] { - box-sizing: border-box; - float: left; - min-height: 1px; - padding-left: 10px; - padding-right: 10px; - position: relative; -} - -.col-1 { - width: 6.25%; -} - -.col-2 { - width: 12.5%; -} - -.col-3 { - width: 18.75%; -} - -.col-4 { - width: 25%; -} - -.col-5 { - width: 31.25%; -} - -.col-6 { - width: 37.5%; -} - -.col-7 { - width: 43.75%; -} - -.col-8 { - width: 50%; -} - -.col-9 { - width: 56.25%; -} - -.col-10 { - width: 62.5%; -} - -.col-11 { - width: 68.75%; -} - -.col-12 { - width: 75%; -} - -.col-13 { - width: 81.25%; -} - -.col-14 { - width: 87.5%; -} - -.col-15 { - width: 93.75%; -} - -.col-16 { - width: 100%; -} - -.col-13 .col-1 { - width: 7.69230769%; -} - -.col-13 .col-2 { - width: 15.38461538%; -} - -.col-13 .col-3 { - width: 23.07692308%; -} - -.col-13 .col-4 { - width: 30.76923077%; -} - -.col-13 .col-5 { - width: 38.46153846%; -} - -.col-13 .col-6 { - width: 46.15384615%; -} - -.col-13 .col-7 { - width: 53.84615385%; -} - -.col-13 .col-8 { - width: 61.53846154%; -} - -.col-13 .col-9 { - width: 69.23076923%; -} - -.col-13 .col-10 { - width: 76.92307692%; -} - -.col-13 .col-11 { - width: 84.61538462%; -} - -.col-13 .col-12 { - width: 92.30769231%; -} - -.col-13 .col-13 { - width: 100%; -} - -.col-12 .col-1 { - width: 8.33333333%; -} - -.col-12 .col-2 { - width: 16.66666667%; -} - -.col-12 .col-3 { - width: 25%; -} - -.col-12 .col-4 { - width: 33.33333333%; -} - -.col-12 .col-5 { - width: 41.66666667%; -} - -.col-12 .col-6 { - width: 50%; -} - -.col-12 .col-7 { - width: 58.33333333%; -} - -.col-12 .col-8 { - width: 66.66666667%; -} - -.col-12 .col-9 { - width: 75%; -} - -.col-12 .col-10 { - width: 83.33333333%; -} - -.col-12 .col-11 { - width: 91.66666667%; -} - -.col-12 .col-12 { - width: 100%; -} - -.col-1of1, .col-2of2, .col-3of3, .col-4of4, .col-5of5, .col-6of6, .col-8of8, .col-10of10, .col-12of12, .col-16of16 { - width: 100%; -} - -.col-1of2, .col-2of4, .col-3of6, .col-4of8, .col-5of10, .col-6of12, .col-8of16 { - width: 50%; -} - -.col-1of3, .col-2of6, .col-4of12 { - width: 33.33333333%; -} - -.col-2of3, .col-4of6, .col-8of12 { - width: 66.66666667%; -} - -.col-1of4, .col-2of8, .col-3of12, .col-4of16 { - width: 25%; -} - -.col-3of4, .col-6of8, .col-9of12, .col-12of16 { - width: 75%; -} - -.col-1of5, .col-2of10 { - width: 20%; -} - -.col-2of5, .col-4of10 { - width: 40%; -} - -.col-3of5, .col-6of10 { - width: 60%; -} - -.col-4of5, .col-8of10 { - width: 80%; -} - -.col-1of6, .col-2of12 { - width: 16.66666667%; -} - -.col-5of6, .col-10of12 { - width: 83.33333333%; -} - -.col-1of8, .col-2of16 { - width: 12.5%; -} - -.col-3of8, .col-6of16 { - width: 37.5%; -} - -.col-5of8, .col-10of16 { - width: 62.5%; -} - -.col-7of8, .col-14of16 { - width: 87.5%; -} - -.col-1of10 { - width: 10%; -} - -.col-3of10 { - width: 30%; -} - -.col-7of10 { - width: 70%; -} - -.col-9of10 { - width: 90%; -} - -.col-1of12 { - width: 8.33333333%; -} - -.col-5of12 { - width: 41.66666667%; -} - -.col-7of12 { - width: 58.33333333%; -} - -.col-11of12 { - width: 91.66666667%; -} - -.col-1of16 { - width: 6.25%; -} - -.col-3of16 { - width: 18.75%; -} - -.col-5of16 { - width: 31.25%; -} - -.col-7of16 { - width: 43.75%; -} - -.col-9of16 { - width: 56.25%; -} - -.col-11of16 { - width: 68.75%; -} - -.col-13of16 { - width: 81.25%; -} - -.col-15of16 { - width: 93.75%; -} - -.col-pull-1of1, .col-pull-2of2, .col-pull-3of3, .col-pull-4of4, .col-pull-5of5, .col-pull-6of6, .col-pull-8of8, .col-pull-10of10, .col-pull-12of12, .col-pull-16of16 { - left: -100%; -} - -.col-pull-1of2, .col-pull-2of4, .col-pull-3of6, .col-pull-4of8, .col-pull-5of10, .col-pull-6of12, .col-pull-8of16 { - left: -50%; -} - -.col-pull-1of3, .col-pull-2of6, .col-pull-4of12 { - left: -33.33333333%; -} - -.col-pull-2of3, .col-pull-4of6, .col-pull-8of12 { - left: -66.66666667%; -} - -.col-pull-1of4, .col-pull-2of8, .col-pull-3of12, .col-pull-4of16 { - left: -25%; -} - -.col-pull-3of4, .col-pull-6of8, .col-pull-9of12, .col-pull-12of16 { - left: -75%; -} - -.col-pull-1of5, .col-pull-2of10 { - left: -20%; -} - -.col-pull-2of5, .col-pull-4of10 { - left: -40%; -} - -.col-pull-3of5, .col-pull-6of10 { - left: -60%; -} - -.col-pull-4of5, .col-pull-8of10 { - left: -80%; -} - -.col-pull-1of6, .col-pull-2of12 { - left: -16.66666667%; -} - -.col-pull-5of6, .col-pull-10of12 { - left: -83.33333333%; -} - -.col-pull-1of8, .col-pull-2of16 { - left: -12.5%; -} - -.col-pull-3of8, .col-pull-6of16 { - left: -37.5%; -} - -.col-pull-5of8, .col-pull-10of16 { - left: -62.5%; -} - -.col-pull-7of8, .col-pull-14of16 { - left: -87.5%; -} - -.col-pull-1of10 { - left: -10%; -} - -.col-pull-3of10 { - left: -30%; -} - -.col-pull-7of10 { - left: -70%; -} - -.col-pull-9of10 { - left: -90%; -} - -.col-pull-1of12 { - left: -8.33333333%; -} - -.col-pull-5of12 { - left: -41.66666667%; -} - -.col-pull-7of12 { - left: -58.33333333%; -} - -.col-pull-11of12 { - left: -91.66666667%; -} - -.col-pull-1of16 { - left: -6.25%; -} - -.col-pull-3of16 { - left: -18.75%; -} - -.col-pull-5of16 { - left: -31.25%; -} - -.col-pull-7of16 { - left: -43.75%; -} - -.col-pull-9of16 { - left: -56.25%; -} - -.col-pull-11of16 { - left: -68.75%; -} - -.col-pull-13of16 { - left: -81.25%; -} - -.col-pull-15of16 { - left: -93.75%; -} - -.col-push-1of1, .col-push-2of2, .col-push-3of3, .col-push-4of4, .col-push-5of5, .col-push-6of6, .col-push-8of8, .col-push-10of10, .col-push-12of12, .col-push-16of16 { - left: 100%; -} - -.col-push-1of2, .col-push-2of4, .col-push-3of6, .col-push-4of8, .col-push-5of10, .col-push-6of12, .col-push-8of16 { - left: 50%; -} - -.col-push-1of3, .col-push-2of6, .col-push-4of12 { - left: 33.33333333%; -} - -.col-push-2of3, .col-push-4of6, .col-push-8of12 { - left: 66.66666667%; -} - -.col-push-1of4, .col-push-2of8, .col-push-3of12, .col-push-4of16 { - left: 25%; -} - -.col-push-3of4, .col-push-6of8, .col-push-9of12, .col-push-12of16 { - left: 75%; -} - -.col-push-1of5, .col-push-2of10 { - left: 20%; -} - -.col-push-2of5, .col-push-4of10 { - left: 40%; -} - -.col-push-3of5, .col-push-6of10 { - left: 60%; -} - -.col-push-4of5, .col-push-8of10 { - left: 80%; -} - -.col-push-1of6, .col-push-2of12 { - left: 16.66666667%; -} - -.col-push-5of6, .col-push-10of12 { - left: 83.33333333%; -} - -.col-push-1of8, .col-push-2of16 { - left: 12.5%; -} - -.col-push-3of8, .col-push-6of16 { - left: 37.5%; -} - -.col-push-5of8, .col-push-10of16 { - left: 62.5%; -} - -.col-push-7of8, .col-push-14of16 { - left: 87.5%; -} - -.col-push-1of10 { - left: 10%; -} - -.col-push-3of10 { - left: 30%; -} - -.col-push-7of10 { - left: 70%; -} - -.col-push-9of10 { - left: 90%; -} - -.col-push-1of12 { - left: 8.33333333%; -} - -.col-push-5of12 { - left: 41.66666667%; -} - -.col-push-7of12 { - left: 58.33333333%; -} - -.col-push-11of12 { - left: 91.66666667%; -} - -.col-push-1of16 { - left: 6.25%; -} - -.col-push-3of16 { - left: 18.75%; -} - -.col-push-5of16 { - left: 31.25%; -} - -.col-push-7of16 { - left: 43.75%; -} - -.col-push-9of16 { - left: 56.25%; -} - -.col-push-11of16 { - left: 68.75%; -} - -.col-push-13of16 { - left: 81.25%; -} - -.col-push-15of16 { - left: 93.75%; -} - -@media (max-width: 960px) and (min-width: 720px) { - .responsive .col-tablet-1of1, .responsive .col-tablet-2of2, .responsive .col-tablet-3of3, .responsive .col-tablet-4of4, .responsive .col-tablet-5of5, .responsive .col-tablet-6of6, .responsive .col-tablet-8of8, .responsive .col-tablet-10of10, .responsive .col-tablet-12of12, .responsive .col-tablet-16of16 { - width: 100%; - } - - .responsive .col-tablet-1of2, .responsive .col-tablet-2of4, .responsive .col-tablet-3of6, .responsive .col-tablet-4of8, .responsive .col-tablet-5of10, .responsive .col-tablet-6of12, .responsive .col-tablet-8of16 { - width: 50%; - } - - .responsive .col-tablet-1of3, .responsive .col-tablet-2of6, .responsive .col-tablet-4of12 { - width: 33.33333333%; - } - - .responsive .col-tablet-2of3, .responsive .col-tablet-4of6, .responsive .col-tablet-8of12 { - width: 66.66666667%; - } - - .responsive .col-tablet-1of4, .responsive .col-tablet-2of8, .responsive .col-tablet-3of12, .responsive .col-tablet-4of16 { - width: 25%; - } - - .responsive .col-tablet-3of4, .responsive .col-tablet-6of8, .responsive .col-tablet-9of12, .responsive .col-tablet-12of16 { - width: 75%; - } - - .responsive .col-tablet-1of5, .responsive .col-tablet-2of10 { - width: 20%; - } - - .responsive .col-tablet-2of5, .responsive .col-tablet-4of10 { - width: 40%; - } - - .responsive .col-tablet-3of5, .responsive .col-tablet-6of10 { - width: 60%; - } - - .responsive .col-tablet-4of5, .responsive .col-tablet-8of10 { - width: 80%; - } - - .responsive .col-tablet-1of6, .responsive .col-tablet-2of12 { - width: 16.66666667%; - } - - .responsive .col-tablet-5of6, .responsive .col-tablet-10of12 { - width: 83.33333333%; - } - - .responsive .col-tablet-1of8, .responsive .col-tablet-2of16 { - width: 12.5%; - } - - .responsive .col-tablet-3of8, .responsive .col-tablet-6of16 { - width: 37.5%; - } - - .responsive .col-tablet-5of8, .responsive .col-tablet-10of16 { - width: 62.5%; - } - - .responsive .col-tablet-7of8, .responsive .col-tablet-14of16 { - width: 87.5%; - } - - .responsive .col-tablet-1of10 { - width: 10%; - } - - .responsive .col-tablet-3of10 { - width: 30%; - } - - .responsive .col-tablet-7of10 { - width: 70%; - } - - .responsive .col-tablet-9of10 { - width: 90%; - } - - .responsive .col-tablet-1of12 { - width: 8.33333333%; - } - - .responsive .col-tablet-5of12 { - width: 41.66666667%; - } - - .responsive .col-tablet-7of12 { - width: 58.33333333%; - } - - .responsive .col-tablet-11of12 { - width: 91.66666667%; - } - - .responsive .col-tablet-1of16 { - width: 6.25%; - } - - .responsive .col-tablet-3of16 { - width: 18.75%; - } - - .responsive .col-tablet-5of16 { - width: 31.25%; - } - - .responsive .col-tablet-7of16 { - width: 43.75%; - } - - .responsive .col-tablet-9of16 { - width: 56.25%; - } - - .responsive .col-tablet-11of16 { - width: 68.75%; - } - - .responsive .col-tablet-13of16 { - width: 81.25%; - } - - .responsive .col-tablet-15of16 { - width: 93.75%; - } -} - -.col-3-wide { - width: 33.33333333%; -} - -@media (max-width: 719px) { - .responsive [class*=col-] { - float: none; - left: 0; - width: auto; - } -} - -/* Header component */ -.dac-header { - background: #fff; - height: 64px; - margin: 0 -20px; -} - -.about .dac-header, .distribute .dac-header, .develop .dac-header { - height: 128px; -} - -.dac-header-inner { - background: #fff; - box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.07); - box-sizing: border-box; - height: 64px; -} - -.dac-header.dac-sub .dac-header-inner { - border-bottom: 1px solid #e5e5e5; - box-shadow: none; -} - -.dac-header.is-sticky .dac-header-inner { - left: 0; - position: fixed; - top: 0; - right: 0; - -webkit-animation: .3s dac-header-show; - animation: .3s dac-header-show; - z-index: 52; -} - -.dac-header-logo { - border-right: 1px solid #e5e5e5; - display: block; - font-size: 20px; - font-weight: 300; - float: left; - letter-spacing: .3px; - line-height: 36px; - margin-right: 16px; - padding: 14px 24px 14px; -} - -.dac-header-logo:link, .dac-header-logo:visited, .dac-header-logo:hover, .dac-header-logo:active { - color: #444; -} - -.dac-header-logo-image { - margin-right: 5px; - vertical-align: top; -} - -.dac-header-consoleBtn { - border: 1px solid #c5c5c5; - border-radius: 4px; - box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.11); - background: #fff; - float: right; - font-size: 14px; - line-height: 28px; - margin: 17px 30px 17px 10px; - padding: 0 10px; - position: relative; - z-index: 52; -} - -.dac-header-consoleBtn > .dac-sprite { - margin-right: 5px; -} - -.dac-header-consoleBtn:link, .dac-header-consoleBtn:visited, .dac-header-consoleBtn:hover, .dac-header-consoleBtn:active { - color: #666; -} - -.dac-header-consoleBtn:focus { - background: rgba(63, 81, 181, 0.1); - outline: 0; -} - -@media (max-width: 719px) { - .responsive .dac-header { - height: 64px; - text-align: center; - } - - .responsive .dac-header-logo { - border-right: 0; - display: inline-block; - margin-right: 0; - float: none; - } - - .responsive .dac-header.dac-sub { - display: none; - } - - .responsive .dac-header-consoleBtn { - display: none; - } -} - -@-webkit-keyframes dac-header-show { - 0% { - -webkit-transform: translateY(-64px); - transform: translateY(-64px); - } - - 100% { - -webkit-transform: translateY(0); - transform: translateY(0); - } -} - -@keyframes dac-header-show { - 0% { - -webkit-transform: translateY(-64px); - transform: translateY(-64px); - } - - 100% { - -webkit-transform: translateY(0); - transform: translateY(0); - } -} - -/* Header Breadcrumbs component */ -.dac-header-crumbs { - display: none; - list-style-type: none; - margin: 0; -} - -.is-sticky .dac-header-crumbs { - display: block; -} - -.dac-header-crumbs-item { - float: left; - position: relative; - margin: 0; - padding-left: 10px; -} - -.dac-header-crumbs-item:before { - color: #444; - content: '>'; - font-weight: 300; - font-size: 20px; - left: 0; - line-height: 28px; - padding: 16px 0; - position: absolute; -} - -.dac-header-crumbs-item:first-child:before { - content: none; -} - -.dac-header-crumbs-link { - display: block; - font-size: 16px; - font-weight: 300; - line-height: 32px; - padding: 16px 16px; - -webkit-transition: background-color 0.35s cubic-bezier(0.35, 0, 0.25, 1); - transition: background-color 0.35s cubic-bezier(0.35, 0, 0.25, 1); -} - -.dac-header-crumbs-link:link, .dac-header-crumbs-link:visited, .dac-header-crumbs-link:hover, .dac-header-crumbs-link:active { - color: #444; -} - -.dac-header-crumbs-link:focus { - background: rgba(63, 81, 181, 0.1); - outline: 0; -} - -.dac-header-crumbs-link.current { - color: #6ab344; - font-weight: 400; -} - -@media (max-width: 719px) { - .responsive .dac-header-crumbs { - display: none; - } -} - -/* Header site search component */ -.dac-header-search { - background: #fff; - border-left: 1px solid #e5e5e5; - display: block; - float: right; - height: 28px; - padding: 18px 0; - position: relative; - overflow: hidden; - -webkit-transition: width 0.4s ease, left 0.4s ease; - transition: width 0.4s ease, left 0.4s ease; - width: 64px; - z-index: 52; -} - -.dac-header-search:hover, .dac-header-search.active { - width: 228px; -} - -.dac-header-search-inner { - width: 228px; -} - -.dac-header-search-btn { - background: url(../images/icon_search.png) 50% 0 no-repeat; - height: 28px; - position: absolute; - width: 64px; -} - -.dac-header-search:hover .dac-header-search-btn { - background-position: 50% -28px; -} - -.dac-header-search-form { - left: 54px; - opacity: 0; - position: absolute; - right: 24px; - top: 20px; - -webkit-transition: opacity .4s; - transition: opacity .4s; -} - -.dac-header-search:hover .dac-header-search-form, .dac-header-search.active .dac-header-search-form { - opacity: 1; -} - -.dac-header-search-input { - background-color: transparent; - border: none; - border-bottom: 1px solid #CCC; - box-sizing: border-box; - color: #2f2f2f; - font-size: 14px; - height: 24px; - outline: none; - padding: 4px 20px 4px 0; - width: 100%; - z-index: 1500; -} - -.dac-header-search:hover .dac-header-search-input { - border-bottom: 1px solid #33b5e5; -} - -.dac-header-search-input:focus { - color: #222; - font-weight: bold; - outline: 0; -} - -.dac-header-search-close { - position: absolute; - right: 4px; - bottom: 4px; - width: 16px; - height: 16px; - margin: 0; - text-indent: -1000em; - background: url(../images/close.png) no-repeat 0 0; - z-index: 9999; -} - -.dac-header-search-close:hover, .dac-header-search-close:focus { - background-position: -16px 0; - cursor: pointer; -} - -@media (max-width: 719px) { - .responsive .dac-header-search { - position: absolute; - left: calc(100% - 64px); - right: 0; - top: 0; - width: auto; - } - - .responsive .dac-header-search:hover, .responsive .dac-header-search.active { - left: 64px; - width: auto; - } -} - -/* Main navigation component */ -.is-sticky .dac-nav, .dac-nav-head, .dac-nav-toggle { - display: none; -} - -.dac-nav-list { - list-style-type: none; - left: 192px; - margin: 0; - position: absolute; - right: 0; - top: 0; - z-index: 51; -} - -.dac-nav-item { - float: left; - margin: 0; -} - -.dac-nav-head { - margin-bottom: 10px; -} - -.dac-nav-dimmer { - background: #000; - display: none; - height: 100%; - left: 0; - opacity: 0; - position: fixed; - top: 0; - -webkit-transition: visibility 0s linear .3s, opacity .3s linear; - transition: visibility 0s linear .3s, opacity .3s linear; - -webkit-transform: translateZ(0); - transform: translateZ(0); - visibility: hidden; - width: 100%; - z-index: 52; -} - -.dac-nav-hamburger { - display: inline-block; - height: 15px; - width: 16px; -} - -.dac-nav-hamburger-top, .dac-nav-hamburger-mid, .dac-nav-hamburger-bot { - background: #999; - display: block; - height: 3px; - margin: 3px 0 0; - width: 100%; -} - -.dac-nav-link { - display: block; - font-size: 16px; - font-weight: 300; - letter-spacing: .24px; - line-height: 32px; - padding: 18px 16px 14px; - -webkit-transition: background-color 0.35s cubic-bezier(0.35, 0, 0.25, 1); - transition: background-color 0.35s cubic-bezier(0.35, 0, 0.25, 1); -} - -.dac-nav-link:link, .dac-nav-link:visited, .dac-nav-link:hover, .dac-nav-link:active { - color: #444; -} - -.dac-nav-link:focus { - background: rgba(63, 81, 181, 0.1); - outline: 0; -} - -.dac-nav-link.has-subnav, .dac-nav-link.selected { - border-bottom: 3px solid #6ab344; - font-weight: 500; - padding-bottom: 11px; -} - -.dac-nav-secondary { - border-bottom: 1px solid #e5e5e5; - display: none; - left: -192px; - list-style-type: none; - margin: 0; - position: absolute; - top: 64px; - right: 0; -} - -.dac-nav-link.has-subnav + .dac-nav-secondary, .dac-nav-link.selected + .dac-nav-secondary { - display: block; -} - -.dac-nav-secondary .dac-nav-link { - padding: 17px 16px 15px; -} - -.dac-nav-secondary .dac-nav-link:link, .dac-nav-secondary .dac-nav-link:visited, .dac-nav-secondary .dac-nav-link:hover, .dac-nav-secondary .dac-nav-link:active { - color: #666; -} - -@media (min-width: 720px) and (max-width: 979px) { - .responsive .dac-nav-secondary .dac-nav-link { - padding-left: 8px; - padding-right: 8px; - } -} - -.dac-nav-secondary .dac-nav-item:first-child .dac-nav-link { - padding-left: 20px; -} - -.dac-nav-secondary .dac-nav-link.selected { - border: none; - font-weight: 700; -} - -@media (max-width: 719px) { - .responsive.dac-nav-open { - overflow: hidden; - } - - .responsive .dac-nav-toggle { - border-right: 1px solid #e5e5e5; - display: inline-block; - position: absolute; - left: 0; - line-height: 64px; - text-align: center; - width: 64px; - } - - .responsive .dac-nav-head, .responsive .dac-nav-secondary, .responsive .dac-nav-dimmer { - display: block; - } - - .responsive .dac-nav-dimmer.dac-nav-open { - opacity: .8; - -webkit-transition-delay: 0s; - transition-delay: 0s; - visibility: visible; - } - - .responsive .dac-nav-list { - background: #fff; - left: auto; - padding: 0 0 20px 0; - position: static; - } - - .responsive .dac-nav-list { - bottom: 0; - max-width: 280px; - overflow-y: auto; - position: fixed; - right: 100%; - top: 0; - -webkit-transition: -webkit-transform .3s ease; - transition: transform .3s ease; - width: 85%; - z-index: 52; - } - - .responsive .dac-nav-list.dac-nav-open { - -webkit-transform: translate3d(100%, 0, 0); - transform: translate3d(100%, 0, 0); - } - - .responsive .dac-nav-secondary { - border: none; - position: static; - width: 100%; - } - - .responsive .dac-nav-item { - float: none; - } - - .responsive .dac-nav-link { - display: block; - font-size: 12px; - font-weight: 600; - color: #333; - padding: 0 20px; - } - - .responsive .dac-nav-link.selected { - color: #09f; - } - - .responsive .dac-nav-secondary .dac-nav-link { - font-weight: 400; - margin-left: 20px; - margin-right: 20px; - } - - .responsive .dac-nav-link.has-subnav, .responsive .dac-nav-link.selected { - border: none; - } - - .responsive .dac-logo-image { - margin-right: 5px; - vertical-align: top; - } - - .responsive .dac-nav-logo { - box-shadow: 0 2px 2px rgba(0, 0, 0, 0.04); - font-size: 20px; - font-weight: 300; - letter-spacing: .3px; - line-height: 36px; - padding: 14px 24px; - } - - .responsive .dac-nav-logo:link, .responsive .dac-nav-logo:visited, .responsive .dac-nav-logo:hover, .responsive .dac-nav-logo:active { - color: #444; - } -} - -.dac-light.dac-hero, .dac-light.dac-section { - background-color: #eceff1; -} - -.dac-gray.dac-hero, .dac-gray.dac-section { - background-color: #b0bec5; -} - -.dac-dark.dac-hero, .dac-dark.dac-section { - background-color: #37474f; -} - -.dac-red.dac-hero, .dac-red.dac-section { - background-color: #dc4d38; -} - -.dac-hero-cta:link, .dac-hero-cta:visited, .dac-section-title, .dac-section-links { - color: #212121; - color: rgba(0, 0, 0, 0.87); -} - -.dac-invert .dac-hero-cta:link, .dac-invert .dac-hero-cta:visited, .dac-invert .dac-section-title, .dac-invert .dac-section-links { - color: white; -} - -.dac-hero-tag, .dac-hero-description, .dac-section-subtitle { - color: #757575; - color: rgba(0, 0, 0, 0.54); -} - -.dac-invert .dac-hero-tag, .dac-invert .dac-hero-description, .dac-invert .dac-section-subtitle { - color: #b2b2b2; - color: rgba(255, 255, 255, 0.7); -} - -/* Hero carousel */ -.dac-hero { - background-color: #fff; - background-position: 50% 30%; - background-size: cover; - box-sizing: border-box; - font-size: 16px; - min-height: 550px; - padding-top: 120px; -} - -.dac-hero.dac-darken:before { - background: rgba(0, 0, 0, 0.3); - bottom: 0; - content: ''; - display: block; - left: 0; - position: absolute; - right: 0; - top: 0; -} - -.dac-hero.dac-darken .dac-hero-content { - position: relative; -} - -@media (max-width: 719px) { - .responsive .dac-hero { - padding-bottom: 20px; - padding-top: 20px; - } -} - -.dac-hero-tag { - font-size: 11px; - font-weight: 700; - letter-spacing: .07em; - margin-bottom: 2px; - text-transform: uppercase; -} - -.dac-hero-title { - margin: 0 0 14px; -} - -.dac-hero-description { - margin-bottom: 16px; -} - -.dac-hero-cta { - display: inline-block; - line-height: 40px; - margin-right: 20px; -} - -.dac-hero-cta:hover { - color: currentColor; -} - -.dac-hero-cta .dac-sprite { - margin-left: -8px; -} - -.dac-hero-figure { - text-align: center; -} - -.dac-hero-carousel { - height: 550px; - position: relative; -} - -.dac-hero-carousel > .dac-hero { - bottom: 0; - left: 0; - position: absolute; - right: 0; - top: 0; -} - -.dac-hero-carousel > .dac-hero, .dac-hero-carousel > .dac-hero .wrap { - opacity: 0; -} - -.dac-hero-carousel > .dac-hero.active { - opacity: 1; - -webkit-transition: opacity .5s; - transition: opacity .5s; - z-index: 1; -} - -.dac-hero-carousel > .dac-hero.active .wrap { - opacity: 1; - -webkit-transition: opacity .5s .5s; - transition: opacity .5s .5s; -} - -.dac-hero-carousel > .dac-hero.out, .dac-hero-carousel > .dac-hero.out .wrap { - -webkit-transition: opacity 0s .5s; - transition: opacity 0s .5s; - opacity: 0; -} - -.dac-hero-carousel-pagination { - bottom: 33px; - left: 0; - position: absolute; - right: 0; - z-index: 51; -} - -@media (max-width: 719px) { - .responsive .dac-hero-carousel-pagination { - text-align: right; - bottom: 20px; - } -} - -.dac-pagination { - list-style: none; - margin: 0 -3px; -} - -.dac-pagination-item { - background-color: rgba(153, 153, 153, 0.4); - border-radius: 50%; - cursor: pointer; - display: inline-block; - height: 14px; - margin: 0 3px; - overflow: hidden; - text-indent: 100%; - -webkit-transition: background-color .1s ease-in; - transition: background-color .1s ease-in; - white-space: nowrap; - width: 14px; -} - -.dac-pagination-item:hover { - background-color: rgba(153, 153, 153, 0.6); -} - -.dac-pagination-item.active, .dac-pagination-item.active:hover { - background-color: #6ab344; -} - -.dac-invert .dac-pagination-item { - background-color: rgba(204, 204, 204, 0.2); -} - -.dac-invert .dac-pagination-item:hover { - background-color: rgba(153, 153, 153, 0.4); -} - -/* Form component */ -.dac-form { - font-size: 16px; - /* Modal Responsive */ -} - -.dac-form a { - color: #000; -} - -.dac-form-aside { - display: inline-block; - font-size: 12px; - margin-top: 0; -} - -.dac-form-required { - color: #ef4300; -} - -.dac-form-fieldset { - padding: 0; -} - -.dac-form-legend { - display: block; - font-weight: 500; - margin: 20px 0; - padding: 0; - width: 100%; -} - -.dac-form-legend > .dac-form-required { - float: right; - margin-top: 3px; -} - -.dac-form-input { - border: 0 solid #e3e3e3; - border-bottom-width: 1px; - display: block; - outline: 0; - padding: 8px 0; - -webkit-transition: border-color .2s; - transition: border-color .2s; - width: 100%; -} - -.dac-form-input-group { - position: relative; -} - -.dac-form-input-group > .dac-form-required { - display: block; - bottom: 3px; - position: absolute; - right: 0; -} - -.dac-form-input:focus { - border-bottom-color: #09f; -} - -.dac-form-floatlabel { - display: block; - margin-top: 5px; - -webkit-transform-origin: 0 100%; - -ms-transform-origin: 0 100%; - transform-origin: 0 100%; - -webkit-transform: translate3d(0, 30px, 0) scale(1); - transform: translate3d(0, 30px, 0) scale(1); - -webkit-transition: -webkit-transform .2s; - transition: transform .2s; -} - -.dac-focused > .dac-form-floatlabel, .dac-has-value > .dac-form-floatlabel { - -webkit-transform: translate3d(0, 0, 0) scale(.75); - transform: translate3d(0, 0, 0) scale(.75); -} - -.dac-form-radio, .dac-form-checkbox { - display: none; -} - -.dac-form-radio-group, .dac-form-checkbox-group { - display: table; - margin-top: 10px; -} - -.dac-form-radio-button, .dac-form-checkbox-button { - box-sizing: border-box; - cursor: pointer; - display: table-cell; - float: left; - height: 18px; - margin: 2px 10px 0 0; - position: relative; - width: 18px; -} - -.dac-form-radio-button::after, .dac-form-radio-button::before, .dac-form-checkbox-button::after, .dac-form-checkbox-button::before { - box-sizing: border-box; - content: ''; - border-radius: 50%; - display: block; - height: 100%; - position: absolute; - width: 100%; -} - -.dac-form-radio-button::before, .dac-form-checkbox-button::before { - background: rgba(0, 0, 0, 0.7); - -webkit-transform: translateZ(0) scale(0); - transform: translateZ(0) scale(0); - -webkit-transition: -webkit-transform .3s; - transition: transform .3s; -} - -.dac-form-radio:checked + .dac-form-radio-button::before, .dac-form-checkbox:checked + .dac-form-checkbox-button::before { - -webkit-transform: translateZ(0) scale(.5); - transform: translateZ(0) scale(.5); -} - -.dac-form-radio-button::after, .dac-form-checkbox-button::after { - border: 2px solid rgba(0, 0, 0, 0.7); -} - -.dac-form-checkbox-button::after, .dac-form-checkbox-button::before { - border-radius: 0; -} - -@media (max-width: 719px) { - .responsive .dac-form-legend { - margin-bottom: 0; - } -} - -/* Media component */ -.dac-media { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-flex-flow: row wrap; - -ms-flex-flow: row wrap; - flex-flow: row wrap; -} - -.dac-media-figure { - margin: 0; -} - -.dac-media-body { - -webkit-box-flex: 1; - -webkit-flex: 1; - -ms-flex: 1; - flex: 1; -} - -.no-flexbox .dac-media { - display: table; - width: 100%; -} - -.no-flexbox .dac-media-body, .no-flexbox .dac-media-figure { - display: table-cell; -} - -.no-flexbox .dac-media-figure { - padding: 0; -} - -.no-flexbox .dac-media-body { - width: 100%; -} - -/* Modal component */ -.dac-modal { - /* Modal dimmer */ - /* Modal Header */ - /* Modal window */ - /* Modal Action button */ - /* Modal Footer */ - /* Modal Responsive */ -} - -.dac-modal-open { - overflow: hidden; -} - -.dac-modal-dimmer { - background: #000; - height: 100%; - left: 0; - opacity: 0; - position: fixed; - top: 0; - -webkit-transform: translateZ(0); - transform: translateZ(0); - -webkit-transition: visibility 0s linear .3s, opacity .3s linear; - transition: visibility 0s linear .3s, opacity .3s linear; - visibility: hidden; - width: 100%; - z-index: 51; -} - -.dac-modal-dimmer.dac-active { - opacity: .8; - -webkit-transition-delay: 0s; - transition-delay: 0s; - visibility: visible; -} - -.dac-modal-header { - background: #00695c; - margin: -35px -35px 0; - padding: 35px 35px 30px; - position: relative; -} - -.dac-modal-header-close { - background: none; - border: none; - cursor: pointer; - line-height: 0; - outline: 0; - opacity: .7; - padding: 8px; - position: absolute; - right: 5px; - -webkit-transition: background-color .3s; - transition: background-color .3s; - top: 5px; -} - -.dac-modal-header-close:active { - background: rgba(255, 255, 255, 0.2); -} - -.dac-modal-header-title { - color: #fff; - font-size: 24px; - font-weight: 300; - line-height: 32px; - margin: 0; - padding-right: 150px; -} - -.dac-modal-header-subtitle { - bottom: 23px; - color: #fff; - display: inline-block; - font: inherit; - font-size: 14px; - opacity: .8; - position: absolute; - right: 35px; -} - -.dac-modal-header hr { - display: none; -} - -.dac-modal-window { - background: #fff; - border-top-left-radius: 6px; - border-top-right-radius: 6px; - box-sizing: border-box; - left: 50%; - margin-left: -480px; - max-width: 960px; - opacity: 0; - padding: 35px 35px 17.5px; - position: fixed; - top: 50%; - -webkit-transition: visibility 0s linear .3s, opacity .3s linear; - transition: visibility 0s linear .3s, opacity .3s linear; - -webkit-transform: translate(0, -50%); - -ms-transform: translate(0, -50%); - transform: translate(0, -50%); - visibility: hidden; - width: 100%; - z-index: 51; -} - -.dac-modal-window.dac-active { - opacity: 1; - -webkit-transition-delay: 0s; - transition-delay: 0s; - visibility: visible; -} - -.dac-modal-action { - bottom: 0; - position: absolute; - right: 0; -} - -.dac-modal-iframe { - display: none; -} - -.dac-modal-footer { - margin-top: 35px; - position: relative; -} - -@media (max-width: 1010px) { - .responsive .dac-modal-window { - bottom: auto; - left: 10px; - margin: 10px; - right: 10px; - top: 50%; - -webkit-transform: translate3d(0, -50%, 0); - transform: translate3d(0, -50%, 0); - width: auto; - } -} - -@media (max-width: 719px) { - .responsive .dac-modal-header { - margin: -10px -10px 10px; - padding-bottom: 10px; - padding-left: 10px; - padding-right: 10px; - } - - .responsive .dac-modal-header-title { - font-size: 16px; - line-height: 26px; - padding: 0; - } - - .responsive .dac-modal-header-subtitle { - display: inline-block; - margin: 0; - position: static; - text-align: right; - width: 100%; - } - - .responsive .dac-modal-window { - border-radius: 0; - bottom: auto; - margin: 10px; - left: 0; - padding: 10px; - top: 0; - -webkit-transform: none; - -ms-transform: none; - transform: none; - width: auto; - } - - .responsive .dac-modal-footer { - border-top: 1px solid #e3e3e3; - margin: 20px -10px 0; - padding: 30px 10px; - } - - .responsive .dac-modal-action { - display: block; - margin: 40px auto 0; - position: static; - } -} - -.newsletter-checkboxes { - padding-top: 10px; -} - -.dac-expand, .dac-section { - margin-left: -20px; - margin-right: -20px; - padding-left: 20px; - padding-right: 20px; -} - -@media (max-width: 719px) { - .responsive .dac-expand, .responsive .dac-section { - margin-left: -10px; - margin-right: -10px; - padding-left: 10px; - padding-right: 10px; - } -} - -.dac-invert { - color: #b2b2b2; - color: rgba(255, 255, 255, 0.7); -} - -.dac-invert h1, .dac-invert h2, .dac-invert h3 { - color: #fff; -} - -.dac-light.dac-hero, .dac-light.dac-section { - background-color: #eceff1; -} - -.dac-gray.dac-hero, .dac-gray.dac-section { - background-color: #b0bec5; -} - -.dac-dark.dac-hero, .dac-dark.dac-section { - background-color: #37474f; -} - -.dac-red.dac-hero, .dac-red.dac-section { - background-color: #dc4d38; -} - -.dac-hero-cta:link, .dac-hero-cta:visited, .dac-section-title, .dac-section-links { - color: #212121; - color: rgba(0, 0, 0, 0.87); -} - -.dac-invert .dac-hero-cta:link, .dac-invert .dac-hero-cta:visited, .dac-invert .dac-section-title, .dac-invert .dac-section-links { - color: white; -} - -.dac-hero-tag, .dac-hero-description, .dac-section-subtitle { - color: #757575; - color: rgba(0, 0, 0, 0.54); -} - -.dac-invert .dac-hero-tag, .dac-invert .dac-hero-description, .dac-invert .dac-section-subtitle { - color: #b2b2b2; - color: rgba(255, 255, 255, 0.7); -} - -.dac-section { - background-position: 50% 50%; - background-size: cover; - padding-bottom: 84px; - padding-top: 84px; - position: relative; -} - -.dac-section.dac-small { - padding-bottom: 32px; - padding-top: 32px; -} - -.dac-section-title { - text-align: center; - margin-bottom: 40px; - margin-top: 0; -} - -.dac-section-subtitle { - font-size: 16px; - margin-bottom: 40px; - margin-top: -24px; - text-align: center; -} - -.dac-section-links { - font-size: 16px; - list-style: none; - line-height: 40px; - margin: 16px 0 0; - text-align: center; -} - -@media (max-width: 719px) { - .responsive .dac-section-links { - margin-left: -8px; - text-align: left; - } -} - -.dac-section-link { - display: inline-block; - margin: 0 32px; -} - -@media (max-width: 719px) { - .responsive .dac-section-link { - display: block; - margin: 0; - } -} - -.dac-section-link a:link, .dac-section-link a:visited { - color: inherit; -} - -/* -SCSS variables are information about icon's compiled state, stored under its original file name - -.icon-home { - width: $icon-home-width; -} - -The large array-like variables contain all information about a single icon -$icon-home: x y offset_x offset_y width height total_width total_height image_path; - -At the bottom of this section, we provide information about the spritesheet itself -$spritesheet: width height image $spritesheet-sprites; -*/ -.dac-sprite, #tb li:before, #qv li:before { - background-image: url(/assets/images/sprite.png); - display: inline-block; - vertical-align: middle; } - @media screen and (min-device-pixel-ratio: 1.5) { - .dac-sprite, #tb li:before, #qv li:before { - background-image: url(/assets/images/sprite-2x.png); - background-size: 50% 50%; } } - -.dac-sprite.dac-auto-chevron { - background-position: 0px -38px; - height: 24px; - width: 24px; - vertical-align: -6px; } - .dac-invert .dac-sprite.dac-auto-chevron { - background-position: -26px -38px; - height: 24px; - width: 24px; } -.dac-sprite.dac-auto-chevron-large { - background-position: -38px 0px; - height: 36px; - width: 36px; - vertical-align: -10px; } - .dac-invert .dac-sprite.dac-auto-chevron-large { - background-position: 0px 0px; - height: 36px; - width: 36px; } - -.dac-sprite.dac-arrow-right { - background-position: -76px -35px; - height: 18px; - width: 11px; } - -.dac-sprite.dac-chevron-large-right-black { - background-position: -38px 0px; - height: 36px; - width: 36px; } - -.dac-sprite.dac-chevron-large-right-white { - background-position: 0px 0px; - height: 36px; - width: 36px; } - -.dac-sprite.dac-chevron-right-black { - background-position: 0px -38px; - height: 24px; - width: 24px; } - -.dac-sprite.dac-chevron-right-white { - background-position: -26px -38px; - height: 24px; - width: 24px; } - -.dac-sprite.dac-close { - background-position: -54px -64px; - height: 12px; - width: 12px; } - -.dac-sprite.dac-google-play { - background-position: -52px -38px; - height: 18px; - width: 16px; } - -.dac-sprite.dac-gplus { - background-position: -76px 0px; - height: 17px; - width: 16px; } - -.dac-sprite.dac-mail { - background-position: -36px -64px; - height: 12px; - width: 16px; } - -.dac-sprite.dac-rss { - background-position: -20px -64px; - height: 14px; - width: 14px; } - -.dac-sprite.dac-twitter { - background-position: -76px -19px; - height: 14px; - width: 16px; } - -.dac-sprite.dac-youtube { - background-position: 0px -64px; - height: 14px; - width: 18px; } - -.dac-visible-mobile-block, .dac-mobile-only, .dac-visible-mobile-inline, .dac-visible-mobile-inline-block, .dac-visible-tablet-block, .dac-visible-tablet-inline, .dac-visible-tablet-inline-block, .dac-visible-desktop-block, .dac-visible-desktop-inline, .dac-visible-desktop-inline-block { - display: none !important; } - -@media (max-width: 719px) { - .responsive .dac-hidden-mobile { - display: none !important; } - .responsive .dac-visible-mobile-block, .responsive .dac-mobile-only { - display: block !important; } - .responsive .dac-visible-mobile-inline { - display: inline !important; } - .responsive .dac-visible-mobile-inline-block { - display: inline-block !important; } } - -@media (min-width: 720px) and (max-width: 979px) { - .responsive .dac-hidden-tablet { - display: none !important; } - .responsive .dac-visible-tablet-block { - display: block !important; } - .responsive .dac-visible-tablet-inline { - display: inline !important; } - .responsive .dac-visible-tablet-inline-block { - display: inline-block !important; } } - -@media (min-width: 980px) { - .responsive .dac-hidden-desktop { - display: none !important; } - .responsive .dac-visible-desktop-block { - display: block !important; } - .responsive .dac-visible-desktop-inline { - display: inline !important; } - .responsive .dac-visible-desktop-inline-block { - display: inline-block !important; } } - -#tb li:before, #qv li:before { - background-position: 0px -38px; - height: 24px; - width: 24px; - content: ''; - left: -8px; - opacity: .7; - position: absolute; } diff --git a/tools/droiddoc/templates-sdk-dev/assets/css/fullscreen.css b/tools/droiddoc/templates-sdk-dev/assets/css/fullscreen.css index 0f108e046..7912e3490 100644 --- a/tools/droiddoc/templates-sdk-dev/assets/css/fullscreen.css +++ b/tools/droiddoc/templates-sdk-dev/assets/css/fullscreen.css @@ -14,7 +14,195 @@ */ @media screen, projection, print { - .wrap { - max-width: none; - } +.full { + padding: 2.5em 0; + border-top: solid 1px #ddd; + border-bottom: solid 1px #ddd; + background: #f7f7f7; } +.wrap { + margin: 0 auto; + width: 100%; + min-width:600px; + clear: both; +} +.cols { + height: 1%; + margin: 0 -1.533742331288343558282%; + width: 103.06748466257669%} +*+html .cols { + margin-bottom: 20px; +} +.cols:after { + clear: both; + content: ' '; + display: block; + height: 0; + visibility: hidden; +} +.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, +.col-13, .col-14, .col-15, .col-16 { + float: left; + margin: 0 1.063829787234% 20px 1.063829787234%; +} +* html .col-1, * html .col-2, * html .col-3, * html .col-4, * html .col-5, * html .col-6, * html +.col-7, * html .col-8, * html .col-9, * html .col-10, * html .col-11, * html .col-12, * html +.col-13, * html .col-14, * html .col-15, * html .col-16 { + margin: 0; + margin: 0 1.063829787234% 20px 1.063829787234%; +} +[dir='rtl'] .col-1, [dir='rtl'] .col-2, [dir='rtl'] .col-3, [dir='rtl'] .col-4, [dir='rtl'] .col-5, +[dir='rtl'] .col-6, [dir='rtl'] .col-7, [dir='rtl'] .col-8, [dir='rtl'] .col-9, [dir='rtl'] .col-10, +[dir='rtl'] .col-11, [dir='rtl'] .col-12 { + float: right; +} +.col-1 { + width: 4.16666666666667%; +} +.col-2 { + width: 10.4166666666667%; +} +.col-3 { + width: 16.6666666666667%; +} +.col-4 { + width: 22.9166666666667%; +} +.col-5 { + width: 29.1666666666667%; +} +.col-6 { + width: 35.4166666666667%; +} +.col-7 { + width: 41.6666666666667%; +} +.col-8 { + width: 47.9166666666667%; +} +.col-9 { + width: 55.3333333333333%; +} +.col-10 { + width: 60.4166666666667%; +} +.col-11 { + width: 66.6666666666667%; +} +.col-12 { + width: 72.9166666666667%; +} +.col-13 { + width: 79.1666666666667%; +} +.col-14 { + width: 85.4166666666667%; +} +.col-15 { + width: 91.6666666666667%; +} +.col-16 { + width: 97.9166666666667%; +} + + + + + + + +#header .col-1, +#nav-x .col-1 { width: 40px } +#header .col-2, +#nav-x .col-2 { width: 100px } +#header .col-3, +#nav-x .col-3 { width: 160px } +#header .col-4, +#nav-x .col-4 { width: 220px } +#header .col-5, +#nav-x .col-5 { width: 280px } +#header .col-6, +#nav-x .col-6 { width: 340px } +#header .col-7, +#nav-x .col-7 { width: 400px } +#header .col-8, +#nav-x .col-8 { width: 460px } +#header .col-9, +#nav-x .col-9 { width: 520px } +#header .col-10, +#nav-x .col-10 { width: 580px } +#header .col-11, +#nav-x .col-11 { width: 640px } +#header .col-12, +#nav-x .col-12 { width: 700px } +#header .col-13, +#nav-x .col-13 { width: 760px } +#header .col-14, +#nav-x .col-14 { width: 820px } +#header .col-15, +#nav-x .col-15 { width: 880px } +#header .col-16, +#nav-x .col-16 { width: 940px } + + + +body { + padding:0 20px; +} +#header, +#searchResults, +#nav-x { + margin:0; +} +#body-content { + margin:0; +} +#body-content > .col-12 { + width:77.9804965%; + margin:0 0 0 0.97%; /* this percentage chosen to make IE9 happy */ +} +#side-nav { + width: 19.9804965%; + margin:0 1.063829787234% 0 0; +} + +#header .wrap { + max-width: 100%; +} + +#header-wrapper #nav-x div.wrap, +#searchResults.wrap { + max-width:100%; +} + +.nav-x { + margin:-2px 0 0 0; +} + +#devdoc-nav.fixed, +#devdoc-nav.fixed a.totop { + left:20px; /* !important ... for IE i think */ +} + +#sticky-header { + padding: 0 20px; +} + +#sticky-header > div { + width: 100%; +} + +.sticky-menu { + width:100%; + left:-20px; +} + +.col-right { + margin-right:0px; +} + +@media screen and (max-width:772px) { +.col-5, .col-6, .col-7 { + clear: both; + width: 97.0238096%} +} \ No newline at end of file diff --git a/tools/droiddoc/templates-sdk-dev/assets/images/resource-card-default-android.jpg b/tools/droiddoc/templates-sdk-dev/assets/images/resource-card-default-android.jpg index 398030f13429e0ebaab9de285a760a146ae28e02..80507444a935f1aa0b0547821be6b3ebcf7fbe9f 100644 GIT binary patch literal 15565 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�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 literal 12042 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 diff --git a/tools/droiddoc/templates-sdk/assets/images/styles/notice-designers-material.png b/tools/droiddoc/templates-sdk-dev/assets/images/styles/notice-designers-material.png similarity index 100% rename from tools/droiddoc/templates-sdk/assets/images/styles/notice-designers-material.png rename to tools/droiddoc/templates-sdk-dev/assets/images/styles/notice-designers-material.png diff --git a/tools/droiddoc/templates-sdk/assets/images/styles/notice-designers-material@2x.png b/tools/droiddoc/templates-sdk-dev/assets/images/styles/notice-designers-material@2x.png similarity index 100% rename from tools/droiddoc/templates-sdk/assets/images/styles/notice-designers-material@2x.png rename to tools/droiddoc/templates-sdk-dev/assets/images/styles/notice-designers-material@2x.png diff --git a/tools/droiddoc/templates-sdk-dev/assets/js/docs.js b/tools/droiddoc/templates-sdk-dev/assets/js/docs.js index ca642171f..7f4be4e16 100644 --- a/tools/droiddoc/templates-sdk-dev/assets/js/docs.js +++ b/tools/droiddoc/templates-sdk-dev/assets/js/docs.js @@ -82,7 +82,7 @@ $(document).ready(function() { .after('
'); // set up the search close button - $('#search-close').click(function() { + $('.search .close').click(function() { $searchInput = $('#search_autocomplete'); $searchInput.attr('value', ''); $(this).addClass("hide"); @@ -92,6 +92,32 @@ $(document).ready(function() { hideResults(); }); + // Set up quicknav + var quicknav_open = false; + $("#btn-quicknav").click(function() { + if (quicknav_open) { + $(this).removeClass('active'); + quicknav_open = false; + collapse(); + } else { + $(this).addClass('active'); + quicknav_open = true; + expand(); + } + }) + + var expand = function() { + $('#header-wrap').addClass('quicknav'); + $('#quicknav').stop().show().animate({opacity:'1'}); + } + + var collapse = function() { + $('#quicknav').stop().animate({opacity:'0'}, 100, function() { + $(this).hide(); + $('#header-wrap').removeClass('quicknav'); + }); + } + //Set up search $("#search_autocomplete").focus(function() { @@ -154,71 +180,73 @@ $(document).ready(function() { // Highlight the header tabs... // highlight Design tab - var urlSegments = pagePathOriginal.split('/'); - var navEl = $(".dac-nav-list"); - var subNavEl = navEl.find(".dac-nav-secondary"); - var parentNavEl; - if ($("body").hasClass("design")) { - navEl.find("> li.design > a").addClass("selected"); + $("#header li.design a").addClass("selected"); + $("#sticky-header").addClass("design"); + // highlight About tabs } else if ($("body").hasClass("about")) { - if (urlSegments[1] == "about" || urlSegments[1] == "wear" || urlSegments[1] == "tv" || urlSegments[1] == "auto") { - navEl.find("> li.home > a").addClass('has-subnav'); - subNavEl.find("li." + urlSegments[1] + " > a").addClass("selected"); - } else { - navEl.find("> li.home > a").addClass('selected'); + var rootDir = pagePathOriginal.substring(1,pagePathOriginal.indexOf('/', 1)); + if (rootDir == "about") { + $("#nav-x li.about a").addClass("selected"); + } else if (rootDir == "wear") { + $("#nav-x li.wear a").addClass("selected"); + } else if (rootDir == "tv") { + $("#nav-x li.tv a").addClass("selected"); + } else if (rootDir == "auto") { + $("#nav-x li.auto a").addClass("selected"); } // highlight Develop tab } else if ($("body").hasClass("develop") || $("body").hasClass("google")) { - parentNavEl = navEl.find("> li.develop > a"); - parentNavEl.addClass('has-subnav'); - + $("#header li.develop a").addClass("selected"); + $("#sticky-header").addClass("develop"); // In Develop docs, also highlight appropriate sub-tab - if (urlSegments[1] == "training") { - subNavEl.find("li.training > a").addClass("selected"); - } else if (urlSegments[1] == "guide") { - subNavEl.find("li.guide > a").addClass("selected"); - } else if (urlSegments[1] == "reference") { + var rootDir = pagePathOriginal.substring(1,pagePathOriginal.indexOf('/', 1)); + if (rootDir == "training") { + $("#nav-x li.training a").addClass("selected"); + } else if (rootDir == "guide") { + $("#nav-x li.guide a").addClass("selected"); + } else if (rootDir == "reference") { // If the root is reference, but page is also part of Google Services, select Google if ($("body").hasClass("google")) { - subNavEl.find("li.google > a").addClass("selected"); + $("#nav-x li.google a").addClass("selected"); } else { - subNavEl.find("li.reference > a").addClass("selected"); + $("#nav-x li.reference a").addClass("selected"); } - } else if ((urlSegments[1] == "tools") || (urlSegments[1] == "sdk")) { - subNavEl.find("li.tools > a").addClass("selected"); + } else if ((rootDir == "tools") || (rootDir == "sdk")) { + $("#nav-x li.tools a").addClass("selected"); } else if ($("body").hasClass("google")) { - subNavEl.find("li.google > a").addClass("selected"); + $("#nav-x li.google a").addClass("selected"); } else if ($("body").hasClass("samples")) { - subNavEl.find("li.samples > a").addClass("selected"); - } else { - parentNavEl.removeClass('has-subnav').addClass("selected"); + $("#nav-x li.samples a").addClass("selected"); } + // highlight Distribute tab } else if ($("body").hasClass("distribute")) { - parentNavEl = navEl.find("> li.distribute > a"); - parentNavEl.addClass('has-subnav'); + $("#header li.distribute a").addClass("selected"); + $("#sticky-header").addClass("distribute"); - if (urlSegments[2] == "users") { - subNavEl.find("li.users > a").addClass("selected"); - } else if (urlSegments[2] == "engage") { - subNavEl.find("li.engage > a").addClass("selected"); - } else if (urlSegments[2] == "monetize") { - subNavEl.find("li.monetize > a").addClass("selected"); - } else if (urlSegments[2] == "analyze") { - subNavEl.find("li.analyze > a").addClass("selected"); - } else if (urlSegments[2] == "tools") { - subNavEl.find("li.disttools > a").addClass("selected"); - } else if (urlSegments[2] == "stories") { - subNavEl.find("li.stories > a").addClass("selected"); - } else if (urlSegments[2] == "essentials") { - subNavEl.find("li.essentials > a").addClass("selected"); - } else if (urlSegments[2] == "googleplay") { - subNavEl.find("li.googleplay > a").addClass("selected"); - } else { - parentNavEl.removeClass('has-subnav').addClass("selected"); + var baseFrag = pagePathOriginal.indexOf('/', 1) + 1; + var secondFrag = pagePathOriginal.substring(baseFrag, pagePathOriginal.indexOf('/', baseFrag)); + if (secondFrag == "users") { + $("#nav-x li.users a").addClass("selected"); + } else if (secondFrag == "engage") { + $("#nav-x li.engage a").addClass("selected"); + } else if (secondFrag == "monetize") { + $("#nav-x li.monetize a").addClass("selected"); + } else if (secondFrag == "analyze") { + $("#nav-x li.analyze a").addClass("selected"); + } else if (secondFrag == "tools") { + $("#nav-x li.disttools a").addClass("selected"); + } else if (secondFrag == "stories") { + $("#nav-x li.stories a").addClass("selected"); + } else if (secondFrag == "essentials") { + $("#nav-x li.essentials a").addClass("selected"); + } else if (secondFrag == "googleplay") { + $("#nav-x li.googleplay a").addClass("selected"); } + } else if ($("body").hasClass("about")) { + $("#sticky-header").addClass("about"); } // set global variable so we can highlight the sidenav a bit later (such as for google reference) @@ -364,12 +392,13 @@ false; // navigate across topic boundaries only in design docs var $olClasses = $('
    '); var $liClass; + var $imgIcon; var $h2Title; var $pSummary; var $olLessons; var $liLesson; $classLinks.each(function(index) { - $liClass = $('
  1. '); + $liClass = $('
  2. '); $h2Title = $('

    ' + $(this).html()+'

    '); $pSummary = $('

    ' + $classDescriptions[index] + '

    '); @@ -378,14 +407,18 @@ false; // navigate across topic boundaries only in design docs $lessons = $(this).closest('li').find('ul li a'); if ($lessons.length) { + $imgIcon = $(''); $lessons.each(function(index) { $olLessons.append('
  3. ' + $(this).html()+'
    4. '); }); } else { + $imgIcon = $(''); $pSummary.addClass('article'); } - $liClass.append($h2Title).append($pSummary).append($olLessons); + $liClass.append($h2Title).append($imgIcon).append($pSummary).append($olLessons); $olClasses.append($liClass); }); $('.jd-descr').append($olClasses); @@ -471,6 +504,15 @@ false; // navigate across topic boundaries only in design docs po.src = 'https://apis.google.com/js/plusone.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s); + + // Revise the sidenav widths to make room for the scrollbar + // which avoids the visible width from changing each time the bar appears + var $sidenav = $("#side-nav"); + var sidenav_width = parseInt($sidenav.innerWidth()); + + $("#devdoc-nav #nav").css("width", sidenav_width - 4 + "px"); // 4px is scrollbar width + + $(".scroll-pane").removeAttr("tabindex"); // get rid of tabindex added by jscroller if ($(".scroll-pane").length > 1) { @@ -544,15 +586,6 @@ false; // navigate across topic boundaries only in design docs }); }); } - - // Responsive testing - var responsiveParam = location.href.match(/[?&]responsive=?(|true|false)/); - if (responsiveParam) { - localStorage['test-responsive'] = ['', 'true'].indexOf(responsiveParam) > -1; - } - if (localStorage['test-responsive']) { - $(document.body).addClass('responsive'); - } }); // END of the onload event @@ -705,28 +738,21 @@ function initExpandableNavItems(rootTag) { /** Create the list of breadcrumb links in the sticky header */ function buildBreadcrumbs() { - var $breadcrumbUl = $(".dac-header-crumbs"); - var primaryNavLink = ".dac-nav-list > .dac-nav-item > .dac-nav-link"; - + var $breadcrumbUl = $("#sticky-header ul.breadcrumb"); // Add the secondary horizontal nav item, if provided - var $selectedSecondNav = $(".dac-nav-secondary .dac-nav-link.selected").clone() - .attr('class', 'dac-header-crumbs-link'); - + var $selectedSecondNav = $("div#nav-x ul.nav-x a.selected").clone().removeClass("selected"); if ($selectedSecondNav.length) { - $breadcrumbUl.prepend($('
  4. ').append($selectedSecondNav)); + $breadcrumbUl.prepend($("
  5. ").append($selectedSecondNav)) } - // Add the primary horizontal nav - var $selectedFirstNav = $(primaryNavLink + ".selected, " + primaryNavLink + ".has-subnav").clone() - .attr('class', 'dac-header-crumbs-link'); - + var $selectedFirstNav = $("div#header-wrap ul.nav-x a.selected").clone().removeClass("selected"); // If there's no header nav item, use the logo link and title from alt text if ($selectedFirstNav.length < 1) { - $selectedFirstNav = $('') + $selectedFirstNav = $("") .attr('href', $("div#header .logo a").attr('href')) .text($("div#header .logo img").attr('alt')); } - $breadcrumbUl.prepend($('
  6. ').append($selectedFirstNav)); + $breadcrumbUl.prepend($("
  7. ").append($selectedFirstNav)); } @@ -798,7 +824,7 @@ function setNavBarLeftPos() { function updateSideNavPosition() { var newLeft = $(window).scrollLeft() - navBarLeftPos; $('#devdoc-nav').css({left: -newLeft}); - $('#devdoc-nav .totop').css({left: -(newLeft - parseInt($('#side-nav').css('padding-left')))}); + $('#devdoc-nav .totop').css({left: -(newLeft - parseInt($('#side-nav').css('margin-left')))}); } // TODO: use $(document).ready instead @@ -1042,7 +1068,7 @@ var prevScrollLeft = 0; // used to compare current position to previous position /* Sets the vertical scoll position at which the sticky bar should appear. This method is called to reset the position when search results appear or hide */ function setStickyTop() { - stickyTop = $('#header-wrapper').outerHeight() - $('#header > .dac-header-inner').outerHeight(); + stickyTop = $('#header-wrapper').outerHeight() - $('#sticky-header').outerHeight(); } /* @@ -1052,7 +1078,8 @@ $(window).scroll(function(event) { setStickyTop(); var hiding = false; - var $headerEl = $('#header'); + var $stickyEl = $('#sticky-header'); + var $menuEl = $('.menu-container'); // Exit if there's no sidenav if ($('#side-nav').length == 0) return; // Exit if the mouse target is a DIV, because that means the event is coming @@ -1093,14 +1120,16 @@ $(window).scroll(function(event) { .css({'width':'auto','margin':''}) .prependTo('#side-nav'); // delay hide the sticky - $headerEl.removeClass('is-sticky'); + $menuEl.removeClass('sticky-menu'); + $stickyEl.fadeOut(250); hiding = false; // update the sidenaav position for side scrolling updateSideNavPosition(); } else if (!sticky && shouldBeSticky) { sticky = true; - $headerEl.addClass('is-sticky'); + $stickyEl.fadeIn(10); + $menuEl.addClass('sticky-menu'); // make the sidenav fixed var width = $('#devdoc-nav').width(); @@ -1113,7 +1142,8 @@ $(window).scroll(function(event) { updateSideNavPosition(); } else if (hiding && top < 15) { - $headerEl.removeClass('is-sticky'); + $menuEl.removeClass('sticky-menu'); + $stickyEl.hide(); hiding = false; } resizeNav(250); // pass true in order to delay the scrollbar re-initialization for performance @@ -1811,11 +1841,12 @@ function sync_selection_table(toroot) // if there are api results if ((gMatches.length > 0) || (gGoogleMatches.length > 0)) { // reveal suggestion list + $('.suggest-card.dummy').show(); $('.suggest-card.reference').show(); var listIndex = 0; // list index position // reset the lists - $(".suggest-card.reference li").remove(); + $(".search_filtered_wrapper.reference li").remove(); // ########### ANDROID RESULTS ############# if (gMatches.length > 0) { @@ -1845,12 +1876,13 @@ function sync_selection_table(toroot) } } else { $('.suggest-card.reference').hide(); + $('.suggest-card.dummy').hide(); } // ########### JD DOC RESULTS ############# if (gDocsMatches.length > 0) { // reset the lists - $(".suggest-card:not(.reference) li").remove(); + $(".search_filtered_wrapper.docs li").remove(); // determine google results to show // NOTE: The order of the conditions below for the sugg.type MUST BE SPECIFIC: @@ -1915,7 +1947,7 @@ function sync_selection_table(toroot) } } else { - $('.suggest-card:not(.reference)').hide(300); + $('.search_filtered_wrapper.docs .suggest-card:not(.dummy)').hide(300); } } @@ -1939,14 +1971,14 @@ function search_changed(e, kd, toroot) // show/hide the close button if (text != '') { - $("#search-close").removeClass("hide"); + $(".search .close").removeClass("hide"); } else { - $("#search-close").addClass("hide"); + $(".search .close").addClass("hide"); } // 27 = esc if (e.keyCode == 27) { // close all search results - if (kd) $('#search-close').trigger('click'); + if (kd) $('.search .close').trigger('click'); return true; } // 13 = enter @@ -2504,7 +2536,7 @@ function search_focus_changed(obj, focused) { if (!focused) { if(obj.value == ""){ - $("#search-close").addClass("hide"); + $(".search .close").addClass("hide"); } $(".suggest-card").hide(); } @@ -2521,7 +2553,7 @@ function submit_search() { function hideResults() { $("#searchResults").slideUp('fast', setStickyTop); - $("#search-close").addClass("hide"); + $(".search .close").addClass("hide"); location.hash = ''; $("#search_autocomplete").val("").blur(); @@ -2638,7 +2670,7 @@ google.setOnLoadCallback(function(){ } else { // first time loading search results for this page $('#searchResults').slideDown('slow', setStickyTop); - $("#search-close").removeClass("hide"); + $(".search .close").removeClass("hide"); loadSearchResults(); } }, true); @@ -2682,7 +2714,7 @@ $(window).hashchange( function(){ searchControl.execute(query); $('#searchResults').slideDown('slow', setStickyTop); $("#search_autocomplete").focus(); - $("#search-close").removeClass("hide"); + $(".search .close").removeClass("hide"); updateResultTitle(query); }); @@ -3504,10 +3536,6 @@ function showSamples() { var addedPageResources = {}; $(document).ready(function() { - // Need to initialize hero carousel before other sections for dedupe - // to work correctly. - $('[data-carousel-query]').dacCarouselQuery(); - $('.resource-widget').each(function() { initResourceWidget(this); }); @@ -3517,8 +3545,8 @@ function showSamples() { showing lines that are cut off. This works with the css ellipsis classes to fade last text line and apply an ellipsis char. */ - //card text currently uses 20px line height. - var lineHeight = 20; + //card text currently uses 15px line height. + var lineHeight = 15; $('.card-info .text').ellipsisfade(lineHeight); }); @@ -3534,10 +3562,11 @@ function showSamples() { isCarousel = $widget.hasClass('resource-carousel-layout'), isStack = $widget.hasClass('resource-stack-layout'); - // remove illegal col-x class which is not relevant anymore thanks to responsive styles. + // find size of widget by pulling out its class name + var sizeCols = 1; var m = $widget.get(0).className.match(/\bcol-(\d+)\b/); - if (m && !$widget.is('.cols > *')) { - $widget.removeClass('col-' + m[1]); + if (m) { + sizeCols = parseInt(m[1], 10); } var opts = { @@ -3547,6 +3576,7 @@ function showSamples() { sortOrder: $widget.data('sortorder'), query: $widget.data('query'), section: $widget.data('section'), + sizeCols: sizeCols, /* Added by LFL 6/6/14 */ resourceStyle: $widget.data('resourcestyle') || 'card', stackSort: $widget.data('stacksort') || 'true' @@ -3574,7 +3604,7 @@ function showSamples() { /* Initializes a Resource Carousel Widget */ function drawResourcesCarouselWidget($widget, opts, resources) { $widget.empty(); - var plusone = false; // stop showing plusone buttons on cards + var plusone = true; //always show plusone on carousel $widget.addClass('resource-card slideshow-container') .append($('').addClass('slideshow-prev').text('Prev')) @@ -3612,7 +3642,7 @@ function showSamples() { function drawResourcesStackWidget($widget, opts, resources, sections) { // Don't empty widget, grab all items inside since they will be the first // items stacked, followed by the resource query - var plusone = false; // stop showing plusone buttons on cards + var plusone = true; //by default show plusone on section cards var cards = $widget.find('.resource-card').detach().toArray(); var numStacks = opts.numStacks || 1; var $stacks = []; @@ -3707,33 +3737,22 @@ function showSamples() { return $el; } - - function createResponsiveFlowColumn(cardSize) { - var cardWidth = parseInt(cardSize.match(/(\d+)/)[1], 10); - var column = $('
    ').addClass('col-' + (cardWidth / 3) + 'of6'); - if (cardWidth < 9) { - column.addClass('col-tablet-1of2'); - } else if (cardWidth > 9 && cardWidth < 18) { - column.addClass('col-tablet-1of1'); - } - if (cardWidth < 18) { - column.addClass('col-mobile-1of1') - } - return column; - } /* Initializes a flow widget, see distribute.scss for generating accompanying css */ function drawResourcesFlowWidget($widget, opts, resources) { - $widget.empty().addClass('cols'); + $widget.empty(); var cardSizes = opts.cardSizes || ['6x6']; var i = 0, j = 0; - var plusone = false; // stop showing plusone buttons on cards + var plusone = true; // by default show plusone on resource cards while (i < resources.length) { var cardSize = cardSizes[j++ % cardSizes.length]; cardSize = cardSize.replace(/^\s+|\s+$/,''); - - var column = createResponsiveFlowColumn(cardSize).appendTo($widget); + // Some card sizes do not get a plusone button, such as where space is constrained + // or for cards commonly embedded in docs (to improve overall page speed). + plusone = !((cardSize == "6x2") || (cardSize == "6x3") || + (cardSize == "9x2") || (cardSize == "9x3") || + (cardSize == "12x2") || (cardSize == "12x3")); // A stack has a third dimension which is the number of stacked items var isStack = cardSize.match(/(\d+)x(\d+)x(\d+)/); @@ -3744,7 +3763,7 @@ function showSamples() { // Create a stack container which should have the dimensions defined // by the product of the items inside. $stackDiv = $('
    ').addClass('resource-card-stack resource-card-' + isStack[1] - + 'x' + isStack[2] * isStack[3]) .appendTo(column); + + 'x' + isStack[2] * isStack[3]) .appendTo($widget); } // Build each stack item or just a single item @@ -3766,7 +3785,7 @@ function showSamples() { stackCount = 0; } - $card.appendTo($stackDiv || column); + $card.appendTo($stackDiv || $widget); } while (++i < resources.length && stackCount > 0); } @@ -3781,10 +3800,6 @@ function showSamples() { } function buildResourceList(opts) { - return $.queryResources(opts); - } - - $.queryResources = function(opts) { var maxResults = opts.maxResults || 100; var query = opts.query || ''; @@ -3833,9 +3848,8 @@ function showSamples() { // add to list of already added indices for (var j = 0; j < resources.length; j++) { - if (resources[j]) { - addedResourceIndices[resources[j].index] = 1; - } + // console.log(resources[j].title); + addedResourceIndices[resources[j].index] = 1; } // concat to final results list @@ -3877,7 +3891,7 @@ function showSamples() { function getResourceNotAlreadyAddedFilter(addedResourceIndices) { return function(resource) { - return resource && !addedResourceIndices[resource.index]; + return !addedResourceIndices[resource.index]; }; } @@ -4141,7 +4155,7 @@ function showSamples() { $this.parent().siblings().each(function () { if ($(this).is(":visible")) { - var h = $(this).outerHeight(true); + var h = $(this).height(); remainingHeight = remainingHeight - h; } }); @@ -4340,467 +4354,3 @@ function showSamples() { } } })(); - -(function($) { - 'use strict'; - - /** - * Toggle Floating Label state. - * @param {HTMLElement} el - The DOM element. - * @param options - * @constructor - */ - function FloatingLabel(el, options) { - this.el = $(el); - this.options = $.extend({}, FloatingLabel.DEFAULTS_, options); - this.group = this.el.closest('.dac-form-input-group'); - this.input = this.group.find('.dac-form-input'); - - this.checkValue_ = this.checkValue_.bind(this); - this.checkValue_(); - - this.input.on('focus', function() { - this.group.addClass('dac-focused'); - }.bind(this)); - this.input.on('blur', function() { - this.group.removeClass('dac-focused'); - this.checkValue_(); - }.bind(this)); - this.input.on('keyup', this.checkValue_); - } - - /** - * The label is moved out of the textbox when it has a value. - */ - FloatingLabel.prototype.checkValue_ = function() { - if (this.input.val().length) { - this.group.addClass('dac-has-value'); - } else { - this.group.removeClass('dac-has-value'); - } - }; - - /** - * jQuery plugin - * @param {object} options - Override default options. - */ - $.fn.dacFloatingLabel = function(options) { - return this.each(function() { - new FloatingLabel(this, options); - }); - }; - - $(document).on('ready.aranja', function() { - $('.dac-form-floatlabel').each(function() { - $(this).dacFloatingLabel($(this).data()); - }); - }); -})(jQuery); - -/* global toRoot, CAROUSEL_OVERRIDE */ -(function($) { - // Ordering matters - var TAG_MAP = [ - {from: 'developerstory', to: 'Android Developer Story'}, - {from: 'googleplay', to: 'Google Play'} - ]; - - function DacCarouselQuery(el) { - this.el = $(el); - - var opts = this.el.data(); - opts.maxResults = parseInt(opts.maxResults || '100', 10); - opts.query = opts.carouselQuery; - var resources = $.queryResources(opts); - - this.el.empty(); - $(resources).map(function() { - var resource = $.extend({}, this, CAROUSEL_OVERRIDE[this.url]); - var slide = $('
    '); - var image = cleanUrl(resource.heroImage || resource.image); - var fullBleed = image && !resource.heroColor; - - // Configure background - slide.css({ - backgroundImage: fullBleed ? 'url(' + image + ')' : '', - backgroundColor: resource.heroColor || '' - }); - - // Should copy be inverted - slide.toggleClass('dac-invert', resource.heroInvert || fullBleed); - slide.toggleClass('dac-darken', fullBleed); - - var cols = $('
    '); - - // inline image column - var rightCol = $('
    ') - .appendTo(cols); - - if (!fullBleed && image) { - rightCol.append($('').attr('src', image)); - } - - // info column - $('
    ') - .append($('
    ').text(formatTag(resource))) - .append($('

    ').text(formatTitle(resource))) - .append($('

    ').text(resource.summary)) - .append($('') - .text(formatCTA(resource)) - .attr('href', cleanUrl(resource.url)) - .prepend($('')) - ) - .appendTo(cols); - - slide.append(cols.wrap('

    ').parent()); - return slide[0]; - }).prependTo(this.el); - - // Pagination element. - this.el.append('
    '); - - this.el.dacCarousel(); - } - - function cleanUrl(url) { - if (url && url.indexOf('//') === -1) { - url = toRoot + url; - } - return url; - } - - function formatTag(resource) { - // Hmm, need a better more scalable solution for this. - for (var i = 0, mapping; mapping = TAG_MAP[i]; i++) { - if (resource.tags.indexOf(mapping.from) > -1) { - return mapping.to; - } - } - return resource.type; - } - - function formatTitle(resource) { - return resource.title.replace(/android developer story: /i, ''); - } - - function formatCTA(resource) { - return resource.type === 'youtube' ? 'Watch the video' : 'Learn more'; - } - - // jQuery plugin - $.fn.dacCarouselQuery = function() { - return this.each(function() { - var el = $(this); - var data = el.data('dac.carouselQuery'); - - if (!data) { el.data('dac.carouselQuery', (data = new DacCarouselQuery(el))); } - }); - }; - - // Data API - $(function() { - $('[data-carousel-query]').dacCarouselQuery(); - }); -})(jQuery); - -(function($) { - /** - * A CSS based carousel, inspired by SequenceJS. - * @param {jQuery} el - * @param {object} options - * @constructor - */ - function DacCarousel(el, options) { - this.el = $(el); - this.options = options = $.extend({}, DacCarousel.OPTIONS, this.el.data(), options || {}); - this.frames = this.el.find(options.frameSelector); - this.count = this.frames.size(); - this.current = options.start; - - this.initPagination(); - this.initEvents(); - this.initFrame(); - } - - DacCarousel.OPTIONS = { - auto: true, - autoTime: 10000, - autoMinTime: 5000, - btnPrev: '[data-carousel-prev]', - btnNext: '[data-carousel-next]', - frameSelector: 'article', - loop: true, - start: 0, - pagination: '[data-carousel-pagination]' - }; - - DacCarousel.prototype.initPagination = function() { - this.pagination = $([]); - if (!this.options.pagination) { return; } - - var pagination = $('

    @@ -250,6 +340,18 @@ color:#666;font-weight:100;font-size:27px;">L Developer Preview
    + + @@ -263,11 +365,11 @@ color:#666;font-weight:100;font-size:27px;">L Developer Preview
    -?> +?> diff --git a/tools/droiddoc/templates-sdk-dev/customizations.cs b/tools/droiddoc/templates-sdk-dev/customizations.cs index 15dc3af72..c8c88cc46 100644 --- a/tools/droiddoc/templates-sdk-dev/customizations.cs +++ b/tools/droiddoc/templates-sdk-dev/customizations.cs @@ -1,11 +1,10 @@
    -
    -
    +
    @@ -19,11 +18,10 @@ def:sdk_nav() ?> def:no_nav() ?>
    -
    -
    +
    -
    +
    @@ -59,7 +57,7 @@ def:training_nav() ?> -
    +
    @@ -73,7 +71,7 @@ def:googleplay_nav() ?> -
    +
    @@ -87,7 +85,7 @@ def:essentials_nav() ?> -
    +
    @@ -101,7 +99,7 @@ def:users_nav() ?> -
    +
    @@ -115,7 +113,7 @@ def:engage_nav() ?> -
    +
    @@ -129,7 +127,7 @@ def:analyze_nav() ?> -
    +
    @@ -143,7 +141,7 @@ def:monetize_nav() ?> -
    +
    @@ -157,7 +155,7 @@ def:disttools_nav() ?> -
    +
    @@ -171,7 +169,7 @@ def:stories_nav() ?> -
    +
    @@ -189,7 +187,7 @@ def:guide_nav() ?> -
    +
    @@ -208,7 +206,7 @@ def:design_nav() ?> -
    +
    @@ -227,7 +225,7 @@ def:distribute_nav() ?> -
    +
    @@ -246,7 +244,7 @@ def:samples_nav() ?> -
    +
    @@ -269,7 +267,7 @@ def:google_nav() ?> -
    +
    @@ -289,7 +287,7 @@ def:about_nav() ?> -
    +
    @@ -308,7 +306,7 @@ def:wear_nav() ?> -
    +
    -
    +
    @@ -435,25 +433,78 @@ def:default_left_nav() ?> -
  8. '); + $liClass = $('
  9. '); $h2Title = $('

    ' + $(this).html()+'

    '); $pSummary = $('

    ' + $classDescriptions[index] + '

    '); @@ -407,18 +378,14 @@ false; // navigate across topic boundaries only in design docs $lessons = $(this).closest('li').find('ul li a'); if ($lessons.length) { - $imgIcon = $(''); $lessons.each(function(index) { $olLessons.append('
  10. ' + $(this).html()+'
    11. '); }); } else { - $imgIcon = $(''); $pSummary.addClass('article'); } - $liClass.append($h2Title).append($imgIcon).append($pSummary).append($olLessons); + $liClass.append($h2Title).append($pSummary).append($olLessons); $olClasses.append($liClass); }); $('.jd-descr').append($olClasses); @@ -504,15 +471,6 @@ false; // navigate across topic boundaries only in design docs po.src = 'https://apis.google.com/js/plusone.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s); - - // Revise the sidenav widths to make room for the scrollbar - // which avoids the visible width from changing each time the bar appears - var $sidenav = $("#side-nav"); - var sidenav_width = parseInt($sidenav.innerWidth()); - - $("#devdoc-nav #nav").css("width", sidenav_width - 4 + "px"); // 4px is scrollbar width - - $(".scroll-pane").removeAttr("tabindex"); // get rid of tabindex added by jscroller if ($(".scroll-pane").length > 1) { @@ -586,6 +544,15 @@ false; // navigate across topic boundaries only in design docs }); }); } + + // Responsive testing + var responsiveParam = location.href.match(/[?&]responsive=?(|true|false)/); + if (responsiveParam) { + localStorage['test-responsive'] = ['', 'true'].indexOf(responsiveParam) > -1; + } + if (localStorage['test-responsive']) { + $(document.body).addClass('responsive'); + } }); // END of the onload event @@ -738,21 +705,28 @@ function initExpandableNavItems(rootTag) { /** Create the list of breadcrumb links in the sticky header */ function buildBreadcrumbs() { - var $breadcrumbUl = $("#sticky-header ul.breadcrumb"); + var $breadcrumbUl = $(".dac-header-crumbs"); + var primaryNavLink = ".dac-nav-list > .dac-nav-item > .dac-nav-link"; + // Add the secondary horizontal nav item, if provided - var $selectedSecondNav = $("div#nav-x ul.nav-x a.selected").clone().removeClass("selected"); + var $selectedSecondNav = $(".dac-nav-secondary .dac-nav-link.selected").clone() + .attr('class', 'dac-header-crumbs-link'); + if ($selectedSecondNav.length) { - $breadcrumbUl.prepend($("
  11. ").append($selectedSecondNav)) + $breadcrumbUl.prepend($('
  12. ').append($selectedSecondNav)); } + // Add the primary horizontal nav - var $selectedFirstNav = $("div#header-wrap ul.nav-x a.selected").clone().removeClass("selected"); + var $selectedFirstNav = $(primaryNavLink + ".selected, " + primaryNavLink + ".has-subnav").clone() + .attr('class', 'dac-header-crumbs-link'); + // If there's no header nav item, use the logo link and title from alt text if ($selectedFirstNav.length < 1) { - $selectedFirstNav = $("") + $selectedFirstNav = $('') .attr('href', $("div#header .logo a").attr('href')) .text($("div#header .logo img").attr('alt')); } - $breadcrumbUl.prepend($("
  13. ").append($selectedFirstNav)); + $breadcrumbUl.prepend($('
  14. ').append($selectedFirstNav)); } @@ -824,7 +798,7 @@ function setNavBarLeftPos() { function updateSideNavPosition() { var newLeft = $(window).scrollLeft() - navBarLeftPos; $('#devdoc-nav').css({left: -newLeft}); - $('#devdoc-nav .totop').css({left: -(newLeft - parseInt($('#side-nav').css('margin-left')))}); + $('#devdoc-nav .totop').css({left: -(newLeft - parseInt($('#side-nav').css('padding-left')))}); } // TODO: use $(document).ready instead @@ -1068,7 +1042,7 @@ var prevScrollLeft = 0; // used to compare current position to previous position /* Sets the vertical scoll position at which the sticky bar should appear. This method is called to reset the position when search results appear or hide */ function setStickyTop() { - stickyTop = $('#header-wrapper').outerHeight() - $('#sticky-header').outerHeight(); + stickyTop = $('#header-wrapper').outerHeight() - $('#header > .dac-header-inner').outerHeight(); } /* @@ -1078,8 +1052,7 @@ $(window).scroll(function(event) { setStickyTop(); var hiding = false; - var $stickyEl = $('#sticky-header'); - var $menuEl = $('.menu-container'); + var $headerEl = $('#header'); // Exit if there's no sidenav if ($('#side-nav').length == 0) return; // Exit if the mouse target is a DIV, because that means the event is coming @@ -1120,16 +1093,14 @@ $(window).scroll(function(event) { .css({'width':'auto','margin':''}) .prependTo('#side-nav'); // delay hide the sticky - $menuEl.removeClass('sticky-menu'); - $stickyEl.fadeOut(250); + $headerEl.removeClass('is-sticky'); hiding = false; // update the sidenaav position for side scrolling updateSideNavPosition(); } else if (!sticky && shouldBeSticky) { sticky = true; - $stickyEl.fadeIn(10); - $menuEl.addClass('sticky-menu'); + $headerEl.addClass('is-sticky'); // make the sidenav fixed var width = $('#devdoc-nav').width(); @@ -1142,8 +1113,7 @@ $(window).scroll(function(event) { updateSideNavPosition(); } else if (hiding && top < 15) { - $menuEl.removeClass('sticky-menu'); - $stickyEl.hide(); + $headerEl.removeClass('is-sticky'); hiding = false; } resizeNav(250); // pass true in order to delay the scrollbar re-initialization for performance @@ -1841,12 +1811,11 @@ function sync_selection_table(toroot) // if there are api results if ((gMatches.length > 0) || (gGoogleMatches.length > 0)) { // reveal suggestion list - $('.suggest-card.dummy').show(); $('.suggest-card.reference').show(); var listIndex = 0; // list index position // reset the lists - $(".search_filtered_wrapper.reference li").remove(); + $(".suggest-card.reference li").remove(); // ########### ANDROID RESULTS ############# if (gMatches.length > 0) { @@ -1876,13 +1845,12 @@ function sync_selection_table(toroot) } } else { $('.suggest-card.reference').hide(); - $('.suggest-card.dummy').hide(); } // ########### JD DOC RESULTS ############# if (gDocsMatches.length > 0) { // reset the lists - $(".search_filtered_wrapper.docs li").remove(); + $(".suggest-card:not(.reference) li").remove(); // determine google results to show // NOTE: The order of the conditions below for the sugg.type MUST BE SPECIFIC: @@ -1947,7 +1915,7 @@ function sync_selection_table(toroot) } } else { - $('.search_filtered_wrapper.docs .suggest-card:not(.dummy)').hide(300); + $('.suggest-card:not(.reference)').hide(300); } } @@ -1971,14 +1939,14 @@ function search_changed(e, kd, toroot) // show/hide the close button if (text != '') { - $(".search .close").removeClass("hide"); + $("#search-close").removeClass("hide"); } else { - $(".search .close").addClass("hide"); + $("#search-close").addClass("hide"); } // 27 = esc if (e.keyCode == 27) { // close all search results - if (kd) $('.search .close').trigger('click'); + if (kd) $('#search-close').trigger('click'); return true; } // 13 = enter @@ -2536,7 +2504,7 @@ function search_focus_changed(obj, focused) { if (!focused) { if(obj.value == ""){ - $(".search .close").addClass("hide"); + $("#search-close").addClass("hide"); } $(".suggest-card").hide(); } @@ -2553,7 +2521,7 @@ function submit_search() { function hideResults() { $("#searchResults").slideUp('fast', setStickyTop); - $(".search .close").addClass("hide"); + $("#search-close").addClass("hide"); location.hash = ''; $("#search_autocomplete").val("").blur(); @@ -2670,7 +2638,7 @@ google.setOnLoadCallback(function(){ } else { // first time loading search results for this page $('#searchResults').slideDown('slow', setStickyTop); - $(".search .close").removeClass("hide"); + $("#search-close").removeClass("hide"); loadSearchResults(); } }, true); @@ -2714,7 +2682,7 @@ $(window).hashchange( function(){ searchControl.execute(query); $('#searchResults').slideDown('slow', setStickyTop); $("#search_autocomplete").focus(); - $(".search .close").removeClass("hide"); + $("#search-close").removeClass("hide"); updateResultTitle(query); }); @@ -3536,6 +3504,10 @@ function showSamples() { var addedPageResources = {}; $(document).ready(function() { + // Need to initialize hero carousel before other sections for dedupe + // to work correctly. + $('[data-carousel-query]').dacCarouselQuery(); + $('.resource-widget').each(function() { initResourceWidget(this); }); @@ -3545,8 +3517,8 @@ function showSamples() { showing lines that are cut off. This works with the css ellipsis classes to fade last text line and apply an ellipsis char. */ - //card text currently uses 15px line height. - var lineHeight = 15; + //card text currently uses 20px line height. + var lineHeight = 20; $('.card-info .text').ellipsisfade(lineHeight); }); @@ -3562,11 +3534,10 @@ function showSamples() { isCarousel = $widget.hasClass('resource-carousel-layout'), isStack = $widget.hasClass('resource-stack-layout'); - // find size of widget by pulling out its class name - var sizeCols = 1; + // remove illegal col-x class which is not relevant anymore thanks to responsive styles. var m = $widget.get(0).className.match(/\bcol-(\d+)\b/); - if (m) { - sizeCols = parseInt(m[1], 10); + if (m && !$widget.is('.cols > *')) { + $widget.removeClass('col-' + m[1]); } var opts = { @@ -3576,7 +3547,6 @@ function showSamples() { sortOrder: $widget.data('sortorder'), query: $widget.data('query'), section: $widget.data('section'), - sizeCols: sizeCols, /* Added by LFL 6/6/14 */ resourceStyle: $widget.data('resourcestyle') || 'card', stackSort: $widget.data('stacksort') || 'true' @@ -3604,7 +3574,7 @@ function showSamples() { /* Initializes a Resource Carousel Widget */ function drawResourcesCarouselWidget($widget, opts, resources) { $widget.empty(); - var plusone = true; //always show plusone on carousel + var plusone = false; // stop showing plusone buttons on cards $widget.addClass('resource-card slideshow-container') .append($('').addClass('slideshow-prev').text('Prev')) @@ -3642,7 +3612,7 @@ function showSamples() { function drawResourcesStackWidget($widget, opts, resources, sections) { // Don't empty widget, grab all items inside since they will be the first // items stacked, followed by the resource query - var plusone = true; //by default show plusone on section cards + var plusone = false; // stop showing plusone buttons on cards var cards = $widget.find('.resource-card').detach().toArray(); var numStacks = opts.numStacks || 1; var $stacks = []; @@ -3737,22 +3707,33 @@ function showSamples() { return $el; } + + function createResponsiveFlowColumn(cardSize) { + var cardWidth = parseInt(cardSize.match(/(\d+)/)[1], 10); + var column = $('
    ').addClass('col-' + (cardWidth / 3) + 'of6'); + if (cardWidth < 9) { + column.addClass('col-tablet-1of2'); + } else if (cardWidth > 9 && cardWidth < 18) { + column.addClass('col-tablet-1of1'); + } + if (cardWidth < 18) { + column.addClass('col-mobile-1of1') + } + return column; + } /* Initializes a flow widget, see distribute.scss for generating accompanying css */ function drawResourcesFlowWidget($widget, opts, resources) { - $widget.empty(); + $widget.empty().addClass('cols'); var cardSizes = opts.cardSizes || ['6x6']; var i = 0, j = 0; - var plusone = true; // by default show plusone on resource cards + var plusone = false; // stop showing plusone buttons on cards while (i < resources.length) { var cardSize = cardSizes[j++ % cardSizes.length]; cardSize = cardSize.replace(/^\s+|\s+$/,''); - // Some card sizes do not get a plusone button, such as where space is constrained - // or for cards commonly embedded in docs (to improve overall page speed). - plusone = !((cardSize == "6x2") || (cardSize == "6x3") || - (cardSize == "9x2") || (cardSize == "9x3") || - (cardSize == "12x2") || (cardSize == "12x3")); + + var column = createResponsiveFlowColumn(cardSize).appendTo($widget); // A stack has a third dimension which is the number of stacked items var isStack = cardSize.match(/(\d+)x(\d+)x(\d+)/); @@ -3763,7 +3744,7 @@ function showSamples() { // Create a stack container which should have the dimensions defined // by the product of the items inside. $stackDiv = $('
    ').addClass('resource-card-stack resource-card-' + isStack[1] - + 'x' + isStack[2] * isStack[3]) .appendTo($widget); + + 'x' + isStack[2] * isStack[3]) .appendTo(column); } // Build each stack item or just a single item @@ -3785,7 +3766,7 @@ function showSamples() { stackCount = 0; } - $card.appendTo($stackDiv || $widget); + $card.appendTo($stackDiv || column); } while (++i < resources.length && stackCount > 0); } @@ -3800,6 +3781,10 @@ function showSamples() { } function buildResourceList(opts) { + return $.queryResources(opts); + } + + $.queryResources = function(opts) { var maxResults = opts.maxResults || 100; var query = opts.query || ''; @@ -3848,8 +3833,9 @@ function showSamples() { // add to list of already added indices for (var j = 0; j < resources.length; j++) { - // console.log(resources[j].title); - addedResourceIndices[resources[j].index] = 1; + if (resources[j]) { + addedResourceIndices[resources[j].index] = 1; + } } // concat to final results list @@ -3891,7 +3877,7 @@ function showSamples() { function getResourceNotAlreadyAddedFilter(addedResourceIndices) { return function(resource) { - return !addedResourceIndices[resource.index]; + return resource && !addedResourceIndices[resource.index]; }; } @@ -4155,7 +4141,7 @@ function showSamples() { $this.parent().siblings().each(function () { if ($(this).is(":visible")) { - var h = $(this).height(); + var h = $(this).outerHeight(true); remainingHeight = remainingHeight - h; } }); @@ -4354,3 +4340,467 @@ function showSamples() { } } })(); + +(function($) { + 'use strict'; + + /** + * Toggle Floating Label state. + * @param {HTMLElement} el - The DOM element. + * @param options + * @constructor + */ + function FloatingLabel(el, options) { + this.el = $(el); + this.options = $.extend({}, FloatingLabel.DEFAULTS_, options); + this.group = this.el.closest('.dac-form-input-group'); + this.input = this.group.find('.dac-form-input'); + + this.checkValue_ = this.checkValue_.bind(this); + this.checkValue_(); + + this.input.on('focus', function() { + this.group.addClass('dac-focused'); + }.bind(this)); + this.input.on('blur', function() { + this.group.removeClass('dac-focused'); + this.checkValue_(); + }.bind(this)); + this.input.on('keyup', this.checkValue_); + } + + /** + * The label is moved out of the textbox when it has a value. + */ + FloatingLabel.prototype.checkValue_ = function() { + if (this.input.val().length) { + this.group.addClass('dac-has-value'); + } else { + this.group.removeClass('dac-has-value'); + } + }; + + /** + * jQuery plugin + * @param {object} options - Override default options. + */ + $.fn.dacFloatingLabel = function(options) { + return this.each(function() { + new FloatingLabel(this, options); + }); + }; + + $(document).on('ready.aranja', function() { + $('.dac-form-floatlabel').each(function() { + $(this).dacFloatingLabel($(this).data()); + }); + }); +})(jQuery); + +/* global toRoot, CAROUSEL_OVERRIDE */ +(function($) { + // Ordering matters + var TAG_MAP = [ + {from: 'developerstory', to: 'Android Developer Story'}, + {from: 'googleplay', to: 'Google Play'} + ]; + + function DacCarouselQuery(el) { + this.el = $(el); + + var opts = this.el.data(); + opts.maxResults = parseInt(opts.maxResults || '100', 10); + opts.query = opts.carouselQuery; + var resources = $.queryResources(opts); + + this.el.empty(); + $(resources).map(function() { + var resource = $.extend({}, this, CAROUSEL_OVERRIDE[this.url]); + var slide = $('
    '); + var image = cleanUrl(resource.heroImage || resource.image); + var fullBleed = image && !resource.heroColor; + + // Configure background + slide.css({ + backgroundImage: fullBleed ? 'url(' + image + ')' : '', + backgroundColor: resource.heroColor || '' + }); + + // Should copy be inverted + slide.toggleClass('dac-invert', resource.heroInvert || fullBleed); + slide.toggleClass('dac-darken', fullBleed); + + var cols = $('
    '); + + // inline image column + var rightCol = $('
    ') + .appendTo(cols); + + if (!fullBleed && image) { + rightCol.append($('').attr('src', image)); + } + + // info column + $('
    ') + .append($('
    ').text(formatTag(resource))) + .append($('

    ').text(formatTitle(resource))) + .append($('

    ').text(resource.summary)) + .append($('') + .text(formatCTA(resource)) + .attr('href', cleanUrl(resource.url)) + .prepend($('')) + ) + .appendTo(cols); + + slide.append(cols.wrap('

    ').parent()); + return slide[0]; + }).prependTo(this.el); + + // Pagination element. + this.el.append('
    '); + + this.el.dacCarousel(); + } + + function cleanUrl(url) { + if (url && url.indexOf('//') === -1) { + url = toRoot + url; + } + return url; + } + + function formatTag(resource) { + // Hmm, need a better more scalable solution for this. + for (var i = 0, mapping; mapping = TAG_MAP[i]; i++) { + if (resource.tags.indexOf(mapping.from) > -1) { + return mapping.to; + } + } + return resource.type; + } + + function formatTitle(resource) { + return resource.title.replace(/android developer story: /i, ''); + } + + function formatCTA(resource) { + return resource.type === 'youtube' ? 'Watch the video' : 'Learn more'; + } + + // jQuery plugin + $.fn.dacCarouselQuery = function() { + return this.each(function() { + var el = $(this); + var data = el.data('dac.carouselQuery'); + + if (!data) { el.data('dac.carouselQuery', (data = new DacCarouselQuery(el))); } + }); + }; + + // Data API + $(function() { + $('[data-carousel-query]').dacCarouselQuery(); + }); +})(jQuery); + +(function($) { + /** + * A CSS based carousel, inspired by SequenceJS. + * @param {jQuery} el + * @param {object} options + * @constructor + */ + function DacCarousel(el, options) { + this.el = $(el); + this.options = options = $.extend({}, DacCarousel.OPTIONS, this.el.data(), options || {}); + this.frames = this.el.find(options.frameSelector); + this.count = this.frames.size(); + this.current = options.start; + + this.initPagination(); + this.initEvents(); + this.initFrame(); + } + + DacCarousel.OPTIONS = { + auto: true, + autoTime: 10000, + autoMinTime: 5000, + btnPrev: '[data-carousel-prev]', + btnNext: '[data-carousel-next]', + frameSelector: 'article', + loop: true, + start: 0, + pagination: '[data-carousel-pagination]' + }; + + DacCarousel.prototype.initPagination = function() { + this.pagination = $([]); + if (!this.options.pagination) { return; } + + var pagination = $('

    @@ -340,18 +250,6 @@ color:#666;font-weight:100;font-size:27px;">M Developer Preview
    - - @@ -365,11 +263,11 @@ color:#666;font-weight:100;font-size:27px;">M Developer Preview
    -?> +?> diff --git a/tools/droiddoc/templates-sdk/customizations.cs b/tools/droiddoc/templates-sdk/customizations.cs index c8c88cc46..15dc3af72 100644 --- a/tools/droiddoc/templates-sdk/customizations.cs +++ b/tools/droiddoc/templates-sdk/customizations.cs @@ -1,10 +1,11 @@
    +
    -
    +
    @@ -18,10 +19,11 @@ def:sdk_nav() ?> def:no_nav() ?>
    +
    -
    +
    -
    +
    @@ -57,7 +59,7 @@ def:training_nav() ?> -
    +
    @@ -71,7 +73,7 @@ def:googleplay_nav() ?> -
    +
    @@ -85,7 +87,7 @@ def:essentials_nav() ?> -
    +
    @@ -99,7 +101,7 @@ def:users_nav() ?> -
    +
    @@ -113,7 +115,7 @@ def:engage_nav() ?> -
    +
    @@ -127,7 +129,7 @@ def:analyze_nav() ?> -
    +
    @@ -141,7 +143,7 @@ def:monetize_nav() ?> -
    +
    @@ -155,7 +157,7 @@ def:disttools_nav() ?> -
    +
    @@ -169,7 +171,7 @@ def:stories_nav() ?> -
    +
    @@ -187,7 +189,7 @@ def:guide_nav() ?> -
    +
    @@ -206,7 +208,7 @@ def:design_nav() ?> -
    +
    @@ -225,7 +227,7 @@ def:distribute_nav() ?> -
    +
    @@ -244,7 +246,7 @@ def:samples_nav() ?> -
    +
    @@ -267,7 +269,7 @@ def:google_nav() ?> -
    +
    @@ -287,7 +289,7 @@ def:about_nav() ?> -
    +
    @@ -306,7 +308,7 @@ def:wear_nav() ?> -
    +
    -
    +
    @@ -433,78 +435,25 @@ def:default_left_nav() ?> -
    -
    -
    -
    -
    -
    -
    -
    Links
    - -
    Android Sites
    - - - - -
    Language
    -
    - -
    - - - -
    -
    -
    -
    - - -
    +
    -
    - -
    -
     
    @@ -524,7 +473,6 @@ def:header_search_widget() ?>
    -
    @@ -597,11 +545,12 @@ def:custom_copyright() ?> -

    - About Android  |  - Legal  |  - Support -

    about/index.html">About Android + Auto + TV + Wear + Legal + -
    -
    +
     

    -
    -
    +
    Previous Next
    @@ -55,9 +53,9 @@ -
    -
     
    -
    +
    +
     
    +
    Previous Next
    diff --git a/tools/droiddoc/templates-sdk/docpage.cs b/tools/droiddoc/templates-sdk/docpage.cs index 83b119935..fe8836b8e 100644 --- a/tools/droiddoc/templates-sdk/docpage.cs +++ b/tools/droiddoc/templates-sdk/docpage.cs @@ -6,7 +6,7 @@ googledevelopdevelop guide samples
    class="fullpage"class="col-13" id="doc-col"class="col-12" id="doc-col" > @@ -36,14 +36,12 @@ include:"header.cs" ?> -
    -
    +
     

    -
    -
    +
    >Get started
    -
    +
    -
    - -
    -
    +
    +
    + +
    +

    +
    @@ -153,13 +153,11 @@ include:"header.cs" ?>
    +
    wrap" itemscope itemtype="http://schema.org/SiteNavigationElement"> - -
    - +
    es-lang="Empezar" >Get started Next class - -
    -
    - -
    - -
    - +
    +
    @@ -194,9 +186,9 @@ include:"header.cs" ?> - - - + + + diff --git a/tools/droiddoc/templates-sdk/footer.cs b/tools/droiddoc/templates-sdk/footer.cs index b609d3b8c..230930685 100644 --- a/tools/droiddoc/templates-sdk/footer.cs +++ b/tools/droiddoc/templates-sdk/footer.cs @@ -1,20 +1,152 @@ -