Compartmentalized the SCSS files
Project: http://git-wip-us.apache.org/repos/asf/cordova-docs/repo Commit: http://git-wip-us.apache.org/repos/asf/cordova-docs/commit/a5729c7b Tree: http://git-wip-us.apache.org/repos/asf/cordova-docs/tree/a5729c7b Diff: http://git-wip-us.apache.org/repos/asf/cordova-docs/diff/a5729c7b Branch: refs/heads/cordova-website Commit: a5729c7b70aa6d87809a5746eb4f30ca2ef73931 Parents: e83bce0 Author: Brad Gashler <[email protected]> Authored: Thu Aug 13 17:17:38 2015 -0700 Committer: Brad Gashler <[email protected]> Committed: Thu Aug 13 17:17:38 2015 -0700 ---------------------------------------------------------------------- www/static/css-src/home.scss | 220 +++++++++++++++++++++++++++++++++++++ www/static/css-src/main.scss | 226 +------------------------------------- 2 files changed, 223 insertions(+), 223 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/cordova-docs/blob/a5729c7b/www/static/css-src/home.scss ---------------------------------------------------------------------- diff --git a/www/static/css-src/home.scss b/www/static/css-src/home.scss new file mode 100644 index 0000000..a0df3ff --- /dev/null +++ b/www/static/css-src/home.scss @@ -0,0 +1,220 @@ +/* @media (min-width: $screen-sm-min) { body { font-size:.5em; } } */ + + +body { + +} + +#hero { + height:1020px; + background-color:$gray-transparent; + background-image: url("{{ site.baseurl }}/static/img/wisplight.jpg"); + background-size: cover; + position:relative; + color:white; + #hero_section { + width:80%; + max-width:730px; + font-size:18px; + margin-top:-100px; /* vertically centers more accuaretly since bottom bar is absolutely positioned*/ + > div { + display: inline-block; + } + #hero_section_left { + width:39%; + vertical-align: top; + } + + #hero_section_right { + width:59%; + div { + padding-bottom:20px; + } + .platforms_more { + font-size: 12px; + padding-left: 20px; + font-weight: bold; + } + } + } + .hero_logo { + width:100%; + padding-top:40px; + padding-bottom:20px; + } +} +@media (max-width: 768px) { + #hero #hero_section #hero_section_right { width:100%; } +} + +#hero_bottom_strip { + position: absolute; + top: 100%; + min-height: 200px; + background-color: rgba(128,128,128,.15); + width: 100%; + margin: 0; + /* margin-top: -200px; */ /* Less responsive */ + @include vendor-prefix(transform, translateY(-100%)); + + .container { + padding-top:55px; + padding-bottom:55px; + font-size: 18px; + } + .sprite_img { + position:relative; + left: 0px; + margin: 0; + padding: 0; + top:0; + width: 85px; + height: 85px; + background-repeat: no-repeat; + background-size: cover; + } +} +.value_prop { + max-width: 146px; +} + +@mixin sprite-img($a, $b) { + background: url("{{ site.baseurl }}/static/img/value-prop-sprite.svg") $a $b; +} + +#sprite_shared_code { @include sprite-img(0px, 0) } +#sprite_offline { @include sprite-img(-84px, 0) } +#sprite_apis { @include sprite-img(-84px*2, 0) } + +.navbar-brand { + padding:0; + position: absolute; +} +img#logo_top { + width:190px; + padding:5px; +} + +@media (min-width: 768px) { /* Center the navs when not collapsed */ + .nav_bar_center { + text-align:center; + height:50px; + } + .nav_bar_center > ul { + display: inline-block; + float:none; + } + } + +.vertical-center-parent { + position: relative; + width:100%; + height:100%; + .vertical-center-child { + position:absolute; + top:50%; + left:50%; + @include vendor-prefix(transform, translate(-50%,-50%)); + } +} + +/* +********* Getting Started *********** +*/ +#current_os { + font-weight: bold; +} +.number_circle { + display: inline-block; + width: 50px; + height:50px; + padding: 8px; + font-size: 24px; + color: #ffffff; + vertical-align: middle; + white-space: nowrap; + text-align: center; + background-color: $brand-primary-darker; + border-radius: 50%; + margin-top: 20px; +} + +.well_code { + @extend .well; + padding-bottom:19px + 50px; + position:relative; + background-color: $gray-10; + margin-top:46px; + div { + @extend .well_code; + position: absolute; + top: 100%; + @include vendor-prefix(transform, translateY(-100%)); + padding: 0; + margin:0; + background-color: $gray-20; + width: 100%; + margin-left:-19px; + button { + background-color: $brand-primary; + margin:5px; + } + } +} + + +/* +********* Showcase Section *********** +*/ +.dark { + background-color: $gray-90; +} +.showcase_section_intro { + margin: auto; + float:none; + max-width: 700px; + h1 { color: $brand-gold; padding-bottom:0; } + h2 { color: white; font-size: 18px; font-weight:normal; padding:0; margin-top:0 } + p, span { color: $gray-40; text-align: left; } + padding-top: 4px; + padding-bottom: 35px; +} + +.supported_platforms { + background-color: darken(white, 85%); + margin-left: -15px; + margin-right: -15px; +} +.platform_logos { + list-style-type: none; + padding-left:0; + padding-top: 20px; + padding-bottom: 20px; +} +.cordova_tools_gallery { + color:white; + .card { + padding:8px; + .card_title { + color: $brand-primary; + font-weight: bold; + } + .card_inner { + background-color:darken(white, 85%); + padding: 32px 16px 32px 16px; + } + .sample_app_thumb { + background-color: #AD6E6E; + width: 100%; + height: 100px; + } + img { + height:50px; + padding-bottom:5px; + } + } +} +.add_seemore_links { + margin-top:10px; + a { padding-left:30px; } +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/cordova-docs/blob/a5729c7b/www/static/css-src/main.scss ---------------------------------------------------------------------- diff --git a/www/static/css-src/main.scss b/www/static/css-src/main.scss index 4f3ae1e..42ba3b5 100644 --- a/www/static/css-src/main.scss +++ b/www/static/css-src/main.scss @@ -1,6 +1,4 @@ @import 'lib/bootstrap'; -/* @import 'blog'; */ -@import 'plugins'; /* Customized Variables for Bootstrap */ $gray-base:black; @@ -54,227 +52,6 @@ $scree-md-max: $screen-lg - 1; } -/* @media (min-width: $screen-sm-min) { body { font-size:.5em; } } */ - - -body { - -} - -#hero { - height:1020px; - background-color:$gray-transparent; - background-image: url("{{ site.baseurl }}/static/img/wisplight.jpg"); - background-size: cover; - position:relative; - color:white; - #hero_section { - width:80%; - max-width:730px; - font-size:18px; - margin-top:-100px; /* vertically centers more accuaretly since bottom bar is absolutely positioned*/ - > div { - display: inline-block; - } - #hero_section_left { - width:39%; - vertical-align: top; - } - - #hero_section_right { - width:59%; - div { - padding-bottom:20px; - } - .platforms_more { - font-size: 12px; - padding-left: 20px; - font-weight: bold; - } - } - } - .hero_logo { - width:100%; - padding-top:40px; - padding-bottom:20px; - } -} -@media (max-width: 768px) { - #hero #hero_section #hero_section_right { width:100%; } -} - -#hero_bottom_strip { - position: absolute; - top: 100%; - min-height: 200px; - background-color: rgba(128,128,128,.15); - width: 100%; - margin: 0; - /* margin-top: -200px; */ /* Less responsive */ - @include vendor-prefix(transform, translateY(-100%)); - - .container { - padding-top:55px; - padding-bottom:55px; - font-size: 18px; - } - .sprite_img { - position:relative; - left: 0px; - margin: 0; - padding: 0; - top:0; - width: 85px; - height: 85px; - background-repeat: no-repeat; - background-size: cover; - } -} -.value_prop { - max-width: 146px; -} - -@mixin sprite-img($a, $b) { - background: url("{{ site.baseurl }}/static/img/value-prop-sprite.svg") $a $b; -} - -#sprite_shared_code { @include sprite-img(0px, 0) } -#sprite_offline { @include sprite-img(-84px, 0) } -#sprite_apis { @include sprite-img(-84px*2, 0) } - -.navbar-brand { - padding:0; - position: absolute; -} -img#logo_top { - width:190px; - padding:5px; -} - -@media (min-width: 768px) { /* Center the navs when not collapsed */ - .nav_bar_center { - text-align:center; - height:50px; - } - .nav_bar_center > ul { - display: inline-block; - float:none; - } - } - -.vertical-center-parent { - position: relative; - width:100%; - height:100%; - .vertical-center-child { - position:absolute; - top:50%; - left:50%; - @include vendor-prefix(transform, translate(-50%,-50%)); - } -} - -/* -********* Getting Started *********** -*/ -#current_os { - font-weight: bold; -} -.number_circle { - display: inline-block; - width: 50px; - height:50px; - padding: 8px; - font-size: 24px; - color: #ffffff; - vertical-align: middle; - white-space: nowrap; - text-align: center; - background-color: $brand-primary-darker; - border-radius: 50%; - margin-top: 20px; -} - -.well_code { - @extend .well; - padding-bottom:19px + 50px; - position:relative; - background-color: $gray-10; - margin-top:46px; - div { - @extend .well_code; - position: absolute; - top: 100%; - @include vendor-prefix(transform, translateY(-100%)); - padding: 0; - margin:0; - background-color: $gray-20; - width: 100%; - margin-left:-19px; - button { - background-color: $brand-primary; - margin:5px; - } - } -} - - -/* -********* Showcase Section *********** -*/ -.dark { - background-color: $gray-90; -} -.showcase_section_intro { - margin: auto; - float:none; - max-width: 700px; - h1 { color: $brand-gold; padding-bottom:0; } - h2 { color: white; font-size: 18px; font-weight:normal; padding:0; margin-top:0 } - p, span { color: $gray-40; text-align: left; } - padding-top: 4px; - padding-bottom: 35px; -} - -.supported_platforms { - background-color: darken(white, 85%); - margin-left: -15px; - margin-right: -15px; -} -.platform_logos { - list-style-type: none; - padding-left:0; - padding-top: 20px; - padding-bottom: 20px; -} -.cordova_tools_gallery { - color:white; - .card { - padding:8px; - .card_title { - color: $brand-primary; - font-weight: bold; - } - .card_inner { - background-color:darken(white, 85%); - padding: 32px 16px 32px 16px; - } - .sample_app_thumb { - background-color: #AD6E6E; - width: 100%; - height: 100px; - } - img { - height:50px; - padding-bottom:5px; - } - } -} -.add_seemore_links { - margin-top:10px; - a { padding-left:30px; } -} - /* ********* Modifications to Bootstrap *********** */ @@ -301,4 +78,7 @@ h2 { padding: 1px 5px; } +@import 'home'; +@import 'blog'; +@import 'plugins'; @import 'contribute'; \ No newline at end of file --------------------------------------------------------------------- To unsubscribe, e-mail: [email protected] For additional commands, e-mail: [email protected]
