added position sticky to page

This commit is contained in:
Brad Rydzewski 2015-10-01 15:54:39 -07:00
parent fc4b106949
commit 7f3e4de836
4 changed files with 16 additions and 1 deletions

View file

@ -154,3 +154,12 @@
color:rgba(255,255,255,0.5); color:rgba(255,255,255,0.5);
line-height:38px; line-height:38px;
display:inline-block; display:inline-block;
@supports (position:sticky)
.sticky
position: sticky;
top: 20px;
@supports not (position:sticky)
.sticky
top: 0px;

View file

@ -176,6 +176,10 @@ input[type=range]:focus::-ms-fill-upper { background: #367ebd; }
.tail i { color: rgba(255, 255, 255, 0.5); line-height: 38px; display: inline-block; } .tail i { color: rgba(255, 255, 255, 0.5); line-height: 38px; display: inline-block; }
@supports (position: sticky) { .sticky { position: sticky; top: 20px; } }
@supports not (position: sticky) { .sticky { top: 0px; } }
.user-row .col-sm-4 { width: 100%; } .user-row .col-sm-4 { width: 100%; }
.user-row .col-sm-4:last-child .card { border-bottom: none; } .user-row .col-sm-4:last-child .card { border-bottom: none; }

View file

@ -52,4 +52,5 @@ html
script[type="text/javascript"][src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.6/moment.min.js"] script[type="text/javascript"][src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.6/moment.min.js"]
script[type="text/javascript"][src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha/js/bootstrap.min.js"] script[type="text/javascript"][src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha/js/bootstrap.min.js"]
script[type="text/javascript"][src="https://cdnjs.cloudflare.com/ajax/libs/typeahead.js/0.11.1/typeahead.bundle.min.js"] script[type="text/javascript"][src="https://cdnjs.cloudflare.com/ajax/libs/typeahead.js/0.11.1/typeahead.bundle.min.js"]
script[text="text/javascript"][src="https://cdnjs.cloudflare.com/ajax/libs/stickyfill/1.1.2/stickyfill.js"]
script[type="text/javascript"][src="/static/scripts_gen/drone.min.js"] script[type="text/javascript"][src="/static/scripts_gen/drone.min.js"]

View file

@ -17,7 +17,7 @@ block header
block content block content
div.container-fluid div.container-fluid
div.row div.row
div.col-md-4 div.col-md-4.sticky
div.build-summary div.build-summary
div div
div[class=Build.Status][style="display:none"] #{Build.Status} div[class=Build.Status][style="display:none"] #{Build.Status}
@ -73,6 +73,7 @@ block content
block append scripts block append scripts
script script
$('.sticky').Stickyfill();
var repo = #{json(Repo.FullName)}; var repo = #{json(Repo.FullName)};
var build = #{json(Build.Number)}; var build = #{json(Build.Number)};
var job = #{json(Job.Number)}; var job = #{json(Job.Number)};