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
this.ui = {
$doc: $(window),
$hero: $('#jumbotron')
$hero: $('#jumbotron'),
$collapse: $('.navbar-collapse')
}
this.addEventListeners();
@ -80,6 +81,11 @@ var APP = APP || {};
return;
_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(),
speedAdj = (top*0.8),
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
this.ui = {
$doc: $(window),
$hero: $('#jumbotron')
$hero: $('#jumbotron'),
$collapse: $('.navbar-collapse')
}
this.addEventListeners();
@ -28,6 +29,11 @@ var APP = APP || {};
return;
_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(),
speedAdj = (top*0.8),
speedAdjOffset = speedAdj - top;

View File

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

View File

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

View File

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

View File

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

View File

@ -338,6 +338,9 @@ body.page-sub #header {
padding-left: 0;
line-height: 22px;
}
#footer .footer-hashi span {
margin-right: 0;
}
#footer .footer-hashi .hashi-logo {
display: block;
margin-top: 15px;
@ -347,7 +350,7 @@ body.page-sub #header {
margin-left: 0;
}
#footer .buttons.navbar-nav li.first {
margin-right: 0;
margin-right: 0 !important;
}
#header {
background: #694a9c;
@ -711,7 +714,7 @@ body.page-home {
}
body.layout-docs,
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-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-top: 50px;
margin-right: 4%;
background-color: #f7f3f9;
border-radius: 6px;
}
.docs-sidebar a {