headroom nav
This commit is contained in:
wgroeneveld
parent
9f1daf5867
commit
c223f76522
|
|
@ -1,7 +1,6 @@
|
|||
---
|
||||
title: "Archive by year: 2013"
|
||||
category: "archive"
|
||||
bigimg: Archive.jpg
|
||||
icontag: tag
|
||||
url: /post/2013/
|
||||
disableComments: true
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
---
|
||||
title: "Archive by year: 2014"
|
||||
category: "archive"
|
||||
bigimg: Archive.jpg
|
||||
icontag: tag
|
||||
url: /post/2014/
|
||||
disableComments: true
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
---
|
||||
title: "Archive by year: 2015"
|
||||
category: "archive"
|
||||
bigimg: Archive.jpg
|
||||
icontag: tag
|
||||
url: /post/2015/
|
||||
disableComments: true
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
---
|
||||
title: "Archive by year: 2016"
|
||||
category: "archive"
|
||||
bigimg: Archive.jpg
|
||||
icontag: tag
|
||||
url: /post/2016/
|
||||
disableComments: true
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
---
|
||||
title: "Archive by year: 2017"
|
||||
category: "archive"
|
||||
bigimg: Archive.jpg
|
||||
icontag: tag
|
||||
url: /post/2017/
|
||||
disableComments: true
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
---
|
||||
title: "Archive by year: 2018"
|
||||
category: "archive"
|
||||
bigimg: Archive.jpg
|
||||
icontag: tag
|
||||
url: /post/2018/
|
||||
disableComments: true
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
---
|
||||
title: "Archive by year: 2019"
|
||||
category: "archive"
|
||||
bigimg: Archive.jpg
|
||||
icontag: tag
|
||||
url: /post/2019/
|
||||
disableComments: true
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
---
|
||||
title: "Archive by year: 2020"
|
||||
category: "archive"
|
||||
bigimg: Archive.jpg
|
||||
icontag: tag
|
||||
url: /post/2020/
|
||||
disableComments: true
|
||||
|
|
|
|||
|
|
@ -26,7 +26,24 @@ document.addEventListener("DOMContentLoaded",function() {
|
|||
});
|
||||
})();
|
||||
|
||||
const box = new SimpleLightbox('.lbox', { /* options */ });
|
||||
new SimpleLightbox('.lbox');
|
||||
new Headroom(document.querySelector(".navbar"), {
|
||||
offset: 100,
|
||||
tolerance: {
|
||||
up: 10,
|
||||
down: 0
|
||||
},
|
||||
classes : {
|
||||
initial : "headroom",
|
||||
pinned : "headroom-pinned",
|
||||
unpinned : "headroom-unpinned",
|
||||
top : "headroom-top",
|
||||
notTop : "headroom-not-top",
|
||||
bottom : "headroom-bottom",
|
||||
notBottom : "headroom-not-bottom",
|
||||
frozen: "headroom-frozen"
|
||||
}
|
||||
}).init();
|
||||
|
||||
(function() {
|
||||
const $target = document.querySelector('#searchapp');
|
||||
|
|
|
|||
|
|
@ -114,73 +114,6 @@ pre code
|
|||
content: " "
|
||||
clear: both
|
||||
|
||||
.navbar-icon
|
||||
font-size: 125%
|
||||
display: inline-block !important
|
||||
|
||||
.navbar.navbar-default
|
||||
border-top: 5px solid var(--accent)
|
||||
border-bottom: 1px solid #e7e7e7
|
||||
|
||||
.navbar-right
|
||||
@media (min-width: 768px)
|
||||
float: right!important
|
||||
margin-right: -15px
|
||||
|
||||
nav
|
||||
background-color: rgba(243, 243, 243, 0.8)
|
||||
border-color: #e7e7e7
|
||||
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif !important
|
||||
line-height: 1.4 !important
|
||||
|
||||
a:hover
|
||||
background-color: #e7e7e7
|
||||
text-decoration: none
|
||||
|
||||
.navbar-nav
|
||||
margin: 7.5px -15px
|
||||
@media (min-width: 768px)
|
||||
float: left
|
||||
margin: 0
|
||||
|
||||
.navbar-nav>li
|
||||
@media (min-width: 768px)
|
||||
float: left
|
||||
|
||||
.nav
|
||||
padding-left: 0
|
||||
margin-bottom: 0
|
||||
list-style: none
|
||||
|
||||
&>li
|
||||
position: relative
|
||||
display: block
|
||||
|
||||
.navbar-nav>li>a
|
||||
@media (min-width: 768px)
|
||||
padding-top: 15px
|
||||
padding-bottom: 15px
|
||||
padding: 10px 15px
|
||||
line-height: 20px
|
||||
position: relative
|
||||
display: block
|
||||
|
||||
|
||||
.navbar-fixed-bottom, .navbar-fixed-top
|
||||
position: fixed
|
||||
right: 0
|
||||
left: 0
|
||||
z-index: 1030
|
||||
|
||||
.navbar-fixed-top
|
||||
top: 0
|
||||
border-width: 0 0 1px
|
||||
border-radius: 0
|
||||
|
||||
.navbar
|
||||
min-height: 50px
|
||||
margin-bottom: 0
|
||||
border: 1px solid transparent
|
||||
|
||||
.visible-lg, .visible-md, .visible-sm, .visible-xs
|
||||
display: none !important
|
||||
|
|
@ -188,48 +121,10 @@ nav
|
|||
display: block !important
|
||||
|
||||
|
||||
.navbar-brand
|
||||
float: left
|
||||
height: 50px
|
||||
font-size: 18px
|
||||
position: relative
|
||||
top: 15px
|
||||
left: 30px
|
||||
line-height: 20px
|
||||
font-weight: bold
|
||||
|
||||
body > footer
|
||||
border-bottom: 5px solid var(--accent)
|
||||
background-color: rgba(243, 243, 243, 0.8)
|
||||
|
||||
.navbar-default .navbar-toggle
|
||||
border-color: #ddd
|
||||
|
||||
.navbar-toggle
|
||||
@media (min-width: 768px)
|
||||
display: none
|
||||
position: relative
|
||||
float: right
|
||||
padding: 9px 10px
|
||||
margin-top: 8px
|
||||
margin-right: 15px
|
||||
margin-bottom: 8px
|
||||
background-color: transparent
|
||||
background-image: none
|
||||
border: 1px solid transparent
|
||||
border-radius: 4px
|
||||
|
||||
.icon-bar
|
||||
background-color: #888
|
||||
|
||||
.icon-bar
|
||||
display: block
|
||||
width: 22px
|
||||
height: 2px
|
||||
border-radius: 1px
|
||||
|
||||
&+.icon-bar
|
||||
margin-top: 4px
|
||||
|
||||
|
||||
button, input, select, textarea
|
||||
|
|
@ -252,63 +147,6 @@ button, input, optgroup, select, textarea
|
|||
font: inherit
|
||||
color: inherit
|
||||
|
||||
.navbar-default .navbar-collapse, .navbar-default .navbar-form
|
||||
border-color: #e7e7e7
|
||||
|
||||
.container-fluid>.navbar-collapse, .container-fluid>.navbar-header, .container>.navbar-collapse, .container>.navbar-header
|
||||
margin-right: -15px
|
||||
margin-left: -15px
|
||||
@media (min-width: 768px)
|
||||
margin-right: 0
|
||||
margin-left: 0
|
||||
|
||||
.navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse
|
||||
max-height: 340px
|
||||
|
||||
.navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse, .navbar-static-top .navbar-collapse
|
||||
@media (min-width: 768px)
|
||||
padding-right: 0
|
||||
padding-left: 0
|
||||
|
||||
.navbar-collapse.collapse
|
||||
@media (min-width: 768px)
|
||||
display: block!important
|
||||
height: auto!important
|
||||
padding-bottom: 0
|
||||
overflow: visible!important
|
||||
|
||||
.navbar-collapse
|
||||
@media (min-width: 768px)
|
||||
width: auto
|
||||
border-top: 0
|
||||
-webkit-box-shadow: none
|
||||
box-shadow: none
|
||||
|
||||
.navbar-collapse
|
||||
padding-right: 15px
|
||||
padding-left: 15px
|
||||
overflow-x: visible
|
||||
-webkit-overflow-scrolling: touch
|
||||
border-top: 1px solid transparent
|
||||
-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.1)
|
||||
box-shadow: inset 0 1px 0 rgba(255,255,255,.1)
|
||||
|
||||
.collapse
|
||||
display: none
|
||||
|
||||
.collapsing
|
||||
padding-top: 40px
|
||||
animation: 1s fadeIn
|
||||
animation-fill-mode: forwards
|
||||
|
||||
|
||||
@keyframes fadeIn
|
||||
0%
|
||||
opacity: 0
|
||||
100%
|
||||
visibility: visible
|
||||
opacity: 1
|
||||
|
||||
hr
|
||||
margin-top: 20px
|
||||
margin-bottom: 20px
|
||||
|
|
|
|||
|
|
@ -0,0 +1,161 @@
|
|||
.headroom
|
||||
will-change: transform
|
||||
transition: transform 200ms linear
|
||||
|
||||
&-pinned
|
||||
transform: translateY(0%)
|
||||
|
||||
&-unpinned
|
||||
transform: translateY(-100%)
|
||||
|
||||
|
||||
.navbar-icon
|
||||
font-size: 125%
|
||||
display: inline-block !important
|
||||
|
||||
.navbar-right
|
||||
@media (min-width: 768px)
|
||||
float: right!important
|
||||
margin-right: -15px
|
||||
|
||||
nav
|
||||
width: 100%
|
||||
position: fixed
|
||||
top: 0
|
||||
background-color: rgba(243, 243, 243, 0.8)
|
||||
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif !important
|
||||
line-height: 1.4 !important
|
||||
min-height: 50px
|
||||
margin-bottom: 0
|
||||
border-top: 5px solid var(--accent)
|
||||
|
||||
a:hover
|
||||
background-color: #e7e7e7
|
||||
text-decoration: none
|
||||
|
||||
.navbar-nav
|
||||
margin: 7.5px -15px
|
||||
@media (min-width: 768px)
|
||||
float: left
|
||||
margin: 0
|
||||
|
||||
.navbar-nav>li
|
||||
@media (min-width: 768px)
|
||||
float: left
|
||||
|
||||
.nav
|
||||
padding-left: 0
|
||||
margin-bottom: 0
|
||||
list-style: none
|
||||
|
||||
&>li
|
||||
position: relative
|
||||
display: block
|
||||
|
||||
.navbar-nav>li>a
|
||||
@media (min-width: 768px)
|
||||
padding-top: 15px
|
||||
padding-bottom: 15px
|
||||
padding: 10px 15px
|
||||
line-height: 20px
|
||||
position: relative
|
||||
display: block
|
||||
|
||||
|
||||
.navbar-brand
|
||||
float: left
|
||||
height: 50px
|
||||
font-size: 18px
|
||||
position: relative
|
||||
top: 15px
|
||||
left: 30px
|
||||
line-height: 20px
|
||||
font-weight: bold
|
||||
|
||||
|
||||
.navbar-toggle
|
||||
border-color: #ddd
|
||||
|
||||
.navbar-toggle
|
||||
@media (min-width: 768px)
|
||||
display: none
|
||||
position: relative
|
||||
float: right
|
||||
padding: 9px 10px
|
||||
margin-top: 8px
|
||||
margin-right: 15px
|
||||
margin-bottom: 8px
|
||||
background-color: transparent
|
||||
background-image: none
|
||||
border: 1px solid transparent
|
||||
border-radius: 4px
|
||||
|
||||
.icon-bar
|
||||
background-color: #888
|
||||
|
||||
.icon-bar
|
||||
display: block
|
||||
width: 22px
|
||||
height: 2px
|
||||
border-radius: 1px
|
||||
|
||||
&+.icon-bar
|
||||
margin-top: 4px
|
||||
|
||||
.navbar-collapse, .navbar-form
|
||||
border-color: #e7e7e7
|
||||
|
||||
.container-fluid>.navbar-collapse, .container-fluid>.navbar-header, .container>.navbar-collapse, .container>.navbar-header
|
||||
margin-right: -15px
|
||||
margin-left: -15px
|
||||
@media (min-width: 768px)
|
||||
margin-right: 0
|
||||
margin-left: 0
|
||||
|
||||
.navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse
|
||||
max-height: 340px
|
||||
|
||||
.navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse, .navbar-static-top .navbar-collapse
|
||||
@media (min-width: 768px)
|
||||
padding-right: 0
|
||||
padding-left: 0
|
||||
|
||||
.navbar-collapse.collapse
|
||||
@media (min-width: 768px)
|
||||
display: block!important
|
||||
height: auto!important
|
||||
padding-bottom: 0
|
||||
overflow: visible!important
|
||||
|
||||
.navbar-collapse
|
||||
@media (min-width: 768px)
|
||||
width: auto
|
||||
border-top: 0
|
||||
-webkit-box-shadow: none
|
||||
box-shadow: none
|
||||
|
||||
.navbar-collapse
|
||||
padding-right: 15px
|
||||
padding-left: 15px
|
||||
overflow-x: visible
|
||||
-webkit-overflow-scrolling: touch
|
||||
border-top: 1px solid transparent
|
||||
-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.1)
|
||||
box-shadow: inset 0 1px 0 rgba(255,255,255,.1)
|
||||
|
||||
.collapse
|
||||
display: none
|
||||
|
||||
.collapsing
|
||||
padding-top: 40px
|
||||
animation: 1s fadeIn
|
||||
animation-fill-mode: forwards
|
||||
|
||||
|
||||
@keyframes fadeIn
|
||||
0%
|
||||
opacity: 0
|
||||
100%
|
||||
visibility: visible
|
||||
opacity: 1
|
||||
|
||||
|
|
@ -2,6 +2,7 @@ $grey: #333
|
|||
|
||||
@import 'fonts'
|
||||
@import 'bootstrap-minimal'
|
||||
@import 'bootstrap-nav'
|
||||
@import 'brainbaking'
|
||||
@import 'brainbaking-intro'
|
||||
@import 'figures'
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@
|
|||
<div id="skiptocontent">
|
||||
<a href="#top">skip to main content</a>
|
||||
</div>
|
||||
<nav class="navbar navbar-default navbar-fixed-top">
|
||||
<nav class="navbar">
|
||||
<div class="container">
|
||||
<div class="navbar-header">
|
||||
<a class="navbar-brand visible-xs" href="#">{{ .Title }}</a>
|
||||
|
|
|
|||
|
|
@ -1,3 +1,4 @@
|
|||
<script defer src='/js/headroom.min.js'></script>
|
||||
<script defer src='/js/simple-lightbox.min.js'></script>
|
||||
{{- $mainScriptPath := "js/brainbaking.js" }}
|
||||
{{- $scripts := resources.Get $mainScriptPath | resources.ExecuteAsTemplate $mainScriptPath . | babel | resources.Minify | resources.Fingerprint "sha512" }}
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,7 @@
|
|||
/*!
|
||||
* headroom.js v0.11.0 - Give your page some headroom. Hide your header until you need it
|
||||
* Copyright (c) 2020 Nick Williams - http://wicky.nillia.ms/headroom.js
|
||||
* License: MIT
|
||||
*/
|
||||
|
||||
!function(t,n){"object"==typeof exports&&"undefined"!=typeof module?module.exports=n():"function"==typeof define&&define.amd?define(n):(t=t||self).Headroom=n()}(this,function(){"use strict";function t(){return"undefined"!=typeof window}function d(t){return function(t){return t&&t.document&&function(t){return 9===t.nodeType}(t.document)}(t)?function(t){var n=t.document,o=n.body,s=n.documentElement;return{scrollHeight:function(){return Math.max(o.scrollHeight,s.scrollHeight,o.offsetHeight,s.offsetHeight,o.clientHeight,s.clientHeight)},height:function(){return t.innerHeight||s.clientHeight||o.clientHeight},scrollY:function(){return void 0!==t.pageYOffset?t.pageYOffset:(s||o.parentNode||o).scrollTop}}}(t):function(t){return{scrollHeight:function(){return Math.max(t.scrollHeight,t.offsetHeight,t.clientHeight)},height:function(){return Math.max(t.offsetHeight,t.clientHeight)},scrollY:function(){return t.scrollTop}}}(t)}function n(t,s,e){var n,o=function(){var n=!1;try{var t={get passive(){n=!0}};window.addEventListener("test",t,t),window.removeEventListener("test",t,t)}catch(t){n=!1}return n}(),i=!1,r=d(t),l=r.scrollY(),a={};function c(){var t=Math.round(r.scrollY()),n=r.height(),o=r.scrollHeight();a.scrollY=t,a.lastScrollY=l,a.direction=l<t?"down":"up",a.distance=Math.abs(t-l),a.isOutOfBounds=t<0||o<t+n,a.top=t<=s.offset,a.bottom=o<=t+n,a.toleranceExceeded=a.distance>s.tolerance[a.direction],e(a),l=t,i=!1}function h(){i||(i=!0,n=requestAnimationFrame(c))}var u=!!o&&{passive:!0,capture:!1};return t.addEventListener("scroll",h,u),c(),{destroy:function(){cancelAnimationFrame(n),t.removeEventListener("scroll",h,u)}}}function o(t,n){n=n||{},Object.assign(this,o.options,n),this.classes=Object.assign({},o.options.classes,n.classes),this.elem=t,this.tolerance=function(t){return t===Object(t)?t:{down:t,up:t}}(this.tolerance),this.initialised=!1,this.frozen=!1}return o.prototype={constructor:o,init:function(){return o.cutsTheMustard&&!this.initialised&&(this.addClass("initial"),this.initialised=!0,setTimeout(function(t){t.scrollTracker=n(t.scroller,{offset:t.offset,tolerance:t.tolerance},t.update.bind(t))},100,this)),this},destroy:function(){this.initialised=!1,Object.keys(this.classes).forEach(this.removeClass,this),this.scrollTracker.destroy()},unpin:function(){!this.hasClass("pinned")&&this.hasClass("unpinned")||(this.addClass("unpinned"),this.removeClass("pinned"),this.onUnpin&&this.onUnpin.call(this))},pin:function(){this.hasClass("unpinned")&&(this.addClass("pinned"),this.removeClass("unpinned"),this.onPin&&this.onPin.call(this))},freeze:function(){this.frozen=!0,this.addClass("frozen")},unfreeze:function(){this.frozen=!1,this.removeClass("frozen")},top:function(){this.hasClass("top")||(this.addClass("top"),this.removeClass("notTop"),this.onTop&&this.onTop.call(this))},notTop:function(){this.hasClass("notTop")||(this.addClass("notTop"),this.removeClass("top"),this.onNotTop&&this.onNotTop.call(this))},bottom:function(){this.hasClass("bottom")||(this.addClass("bottom"),this.removeClass("notBottom"),this.onBottom&&this.onBottom.call(this))},notBottom:function(){this.hasClass("notBottom")||(this.addClass("notBottom"),this.removeClass("bottom"),this.onNotBottom&&this.onNotBottom.call(this))},shouldUnpin:function(t){return"down"===t.direction&&!t.top&&t.toleranceExceeded},shouldPin:function(t){return"up"===t.direction&&t.toleranceExceeded||t.top},addClass:function(t){this.elem.classList.add.apply(this.elem.classList,this.classes[t].split(" "))},removeClass:function(t){this.elem.classList.remove.apply(this.elem.classList,this.classes[t].split(" "))},hasClass:function(t){return this.classes[t].split(" ").every(function(t){return this.classList.contains(t)},this.elem)},update:function(t){t.isOutOfBounds||!0!==this.frozen&&(t.top?this.top():this.notTop(),t.bottom?this.bottom():this.notBottom(),this.shouldUnpin(t)?this.unpin():this.shouldPin(t)&&this.pin())}},o.options={tolerance:{up:0,down:0},offset:0,scroller:t()?window:null,classes:{frozen:"headroom--frozen",pinned:"headroom--pinned",unpinned:"headroom--unpinned",top:"headroom--top",notTop:"headroom--not-top",bottom:"headroom--bottom",notBottom:"headroom--not-bottom",initial:"headroom"}},o.cutsTheMustard=!!(t()&&function(){}.bind&&"classList"in document.documentElement&&Object.assign&&Object.keys&&requestAnimationFrame),o});
|
||||
File diff suppressed because one or more lines are too long
0
themes/brainbaking-minimal/static/js/simple-lightbox.min.js
vendored
Executable file → Normal file
0
themes/brainbaking-minimal/static/js/simple-lightbox.min.js
vendored
Executable file → Normal file
Loading…
Reference in New Issue