responsive/finishing touches

This commit is contained in:
JT 2014-04-08 21:00:59 -07:00
parent b5683db078
commit 7fffbc23f7
8 changed files with 38 additions and 16 deletions

View File

@ -66,7 +66,8 @@ var APP = APP || {};
//cache elements //cache elements
this.ui = { this.ui = {
$doc: $(window), $doc: $(window),
$hero: $('#jumbotron') $hero: $('#jumbotron'),
$collapse: $('.navbar-collapse')
} }
this.addEventListeners(); this.addEventListeners();
@ -80,6 +81,11 @@ var APP = APP || {};
return; return;
_this.ui.$doc.scroll(function() { _this.ui.$doc.scroll(function() {
//if collapseable menu is open dont do parrallax. It looks wonky. Bootstrap conflict
if( _this.ui.$collapse.hasClass('in'))
return;
var top = _this.ui.$doc.scrollTop(), var top = _this.ui.$doc.scrollTop(),
speedAdj = (top*0.8), speedAdj = (top*0.8),
speedAdjOffset = speedAdj - top; speedAdjOffset = speedAdj - top;

View File

@ -1 +1 @@
var APP=function(){function a(){APP.Utils.runIfClassNamePresent("page-home",b)}function b(){APP.Homepage.init()}return{initialize:a}}(),APP=APP||{};APP.Utils=function(){return{isMobile:function(){return navigator.userAgent.match(/Android/i)||navigator.userAgent.match(/webOS/i)||navigator.userAgent.match(/iPhone/i)||navigator.userAgent.match(/iPod/i)||navigator.userAgent.match(/BlackBerry/i)||navigator.userAgent.match(/Windows Phone/i)?!0:!1}(),runIfClassNamePresent:function(a,b){var c=document.getElementsByClassName(a);c.length>0&&b()}}}();var APP=APP||{};!function(){APP.Homepage=function(){return{ui:null,init:function(){this.ui={$doc:$(window),$hero:$("#jumbotron")},this.addEventListeners()},addEventListeners:function(){var a=this;APP.Utils.isMobile||a.ui.$doc.scroll(function(){var b=a.ui.$doc.scrollTop(),c=.8*b,d=c-b;a.ui.$hero.css("webkitTransform","translate(0, "+c+"px)"),a.ui.$hero.find(".container").css("webkitTransform","translate(0, "+d+"px)")})}}}()}(jQuery,this); var APP=function(){function a(){APP.Utils.runIfClassNamePresent("page-home",b)}function b(){APP.Homepage.init()}return{initialize:a}}(),APP=APP||{};APP.Utils=function(){return{isMobile:function(){return navigator.userAgent.match(/Android/i)||navigator.userAgent.match(/webOS/i)||navigator.userAgent.match(/iPhone/i)||navigator.userAgent.match(/iPod/i)||navigator.userAgent.match(/BlackBerry/i)||navigator.userAgent.match(/Windows Phone/i)?!0:!1}(),runIfClassNamePresent:function(a,b){var c=document.getElementsByClassName(a);c.length>0&&b()}}}();var APP=APP||{};!function(){APP.Homepage=function(){return{ui:null,init:function(){this.ui={$doc:$(window),$hero:$("#jumbotron"),$collapse:$(".navbar-collapse")},this.addEventListeners()},addEventListeners:function(){var a=this;APP.Utils.isMobile||a.ui.$doc.scroll(function(){if(!a.ui.$collapse.hasClass("in")){var b=a.ui.$doc.scrollTop(),c=.8*b,d=c-b;a.ui.$hero.css("webkitTransform","translate(0, "+c+"px)"),a.ui.$hero.find(".container").css("webkitTransform","translate(0, "+d+"px)")}})}}}()}(jQuery,this);

View File

@ -14,7 +14,8 @@ var APP = APP || {};
//cache elements //cache elements
this.ui = { this.ui = {
$doc: $(window), $doc: $(window),
$hero: $('#jumbotron') $hero: $('#jumbotron'),
$collapse: $('.navbar-collapse')
} }
this.addEventListeners(); this.addEventListeners();
@ -28,6 +29,11 @@ var APP = APP || {};
return; return;
_this.ui.$doc.scroll(function() { _this.ui.$doc.scroll(function() {
//if collapseable menu is open dont do parrallax. It looks wonky. Bootstrap conflict
if( _this.ui.$collapse.hasClass('in'))
return;
var top = _this.ui.$doc.scrollTop(), var top = _this.ui.$doc.scrollTop(),
speedAdj = (top*0.8), speedAdj = (top*0.8),
speedAdjOffset = speedAdj - top; speedAdjOffset = speedAdj - top;

View File

@ -22,9 +22,9 @@
</div> </div>
</div> </div>
<script src="javascripts/lib/jquery-2.0.3.min.js"></script> <script src="/javascripts/lib/jquery-2.0.3.min.js"></script>
<script src="javascripts/lib/bootstrap.min.js"></script> <script src="/javascripts/lib/bootstrap.min.js"></script>
<script src="javascripts/app/deploy/site.js"></script> <script src="/javascripts/app/deploy/site.js"></script>
<script> <script>
APP.initialize(); APP.initialize();

View File

@ -4,7 +4,7 @@
body.layout-docs, body.layout-docs,
body.layout-intro{ body.layout-intro{
background: #f7f3f9; background: @light-purple url('../images/sidebar-dots.jpg') left 62px no-repeat;
>.container{ >.container{
.col-md-8[role=main]{ .col-md-8[role=main]{
@ -36,7 +36,7 @@ body.layout-intro{
margin-bottom: 30px; margin-bottom: 30px;
margin-top: 50px; margin-top: 50px;
margin-right: 4%; margin-right: 4%;
// background-color: @tan; background-color: @light-purple;
border-radius: @el-border-radius; border-radius: @el-border-radius;
a{ a{

View File

@ -252,17 +252,23 @@ body.page-sub{
} }
#footer{ #footer{
.footer-hashi .hashi-logo{ .footer-hashi {
span{
margin-right: 0;
}
.hashi-logo{
display: block; display: block;
margin-top: 15px; margin-top: 15px;
margin-bottom: 20px; margin-bottom: 20px;
} }
}
.buttons.navbar-nav{ .buttons.navbar-nav{
margin-left: 0; margin-left: 0;
li.first { li.first {
margin-right: 0; margin-right: 0 !important;
} }
} }
} }

View File

@ -29,7 +29,7 @@
@consul-gray: #909090; @consul-gray: #909090;
@consul-footer-gray: #d7d4d7; @consul-footer-gray: #d7d4d7;
@purple: #69499a; @purple: #69499a;
@light-purple: #f7f3f9;
@btn-color: #4592C5; @btn-color: #4592C5;

View File

@ -338,6 +338,9 @@ body.page-sub #header {
padding-left: 0; padding-left: 0;
line-height: 22px; line-height: 22px;
} }
#footer .footer-hashi span {
margin-right: 0;
}
#footer .footer-hashi .hashi-logo { #footer .footer-hashi .hashi-logo {
display: block; display: block;
margin-top: 15px; margin-top: 15px;
@ -347,7 +350,7 @@ body.page-sub #header {
margin-left: 0; margin-left: 0;
} }
#footer .buttons.navbar-nav li.first { #footer .buttons.navbar-nav li.first {
margin-right: 0; margin-right: 0 !important;
} }
#header { #header {
background: #694a9c; background: #694a9c;
@ -711,7 +714,7 @@ body.page-home {
} }
body.layout-docs, body.layout-docs,
body.layout-intro { body.layout-intro {
background: #f7f3f9; background: #f7f3f9 url('../images/sidebar-dots.jpg') left 62px no-repeat;
} }
body.layout-docs > .container .col-md-8[role=main], body.layout-docs > .container .col-md-8[role=main],
body.layout-intro > .container .col-md-8[role=main] { body.layout-intro > .container .col-md-8[role=main] {
@ -740,6 +743,7 @@ body.layout-intro > .container .col-md-8[role=main] > div {
margin-bottom: 30px; margin-bottom: 30px;
margin-top: 50px; margin-top: 50px;
margin-right: 4%; margin-right: 4%;
background-color: #f7f3f9;
border-radius: 6px; border-radius: 6px;
} }
.docs-sidebar a { .docs-sidebar a {