parent
0db0f31953
commit
e2b50a355f
3 changed files with 40 additions and 13 deletions
|
@ -9,13 +9,13 @@
|
||||||
.sidebar {
|
.sidebar {
|
||||||
@include clearfix();
|
@include clearfix();
|
||||||
margin-bottom: 1em;
|
margin-bottom: 1em;
|
||||||
-webkit-transform: translate3d(0, 0 , 0);
|
|
||||||
transform: translate3d(0, 0 , 0);
|
|
||||||
|
|
||||||
@include breakpoint(max-width $large) {
|
@include breakpoint(max-width $large) {
|
||||||
/* fix z-index order of follow links */
|
/* fix z-index order of follow links */
|
||||||
position: relative;
|
position: relative;
|
||||||
z-index: 10;
|
z-index: 10;
|
||||||
|
-webkit-transform: translate3d(0, 0, 0);
|
||||||
|
transform: translate3d(0, 0, 0);
|
||||||
}
|
}
|
||||||
|
|
||||||
@include breakpoint($large) {
|
@include breakpoint($large) {
|
||||||
|
@ -23,7 +23,7 @@
|
||||||
width: calc(#{$right-sidebar-width-narrow} - 1em);
|
width: calc(#{$right-sidebar-width-narrow} - 1em);
|
||||||
opacity: 0.75;
|
opacity: 0.75;
|
||||||
-webkit-transition: opacity 0.2s ease-in-out;
|
-webkit-transition: opacity 0.2s ease-in-out;
|
||||||
transition: opacity 0.2s ease-in-out;
|
transition: opacity 0.2s ease-in-out;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
|
@ -32,7 +32,9 @@
|
||||||
&.sticky {
|
&.sticky {
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
/* calculate height of nav list */
|
/* calculate height of nav list */
|
||||||
height: calc(100vh - 90px - 2em); // viewport height - approx. masthead height - main content top margin
|
height: calc(
|
||||||
|
100vh - 90px - 2em
|
||||||
|
); // viewport height - approx. masthead height - main content top margin
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -40,12 +42,17 @@
|
||||||
width: calc(#{$right-sidebar-width} - 1em);
|
width: calc(#{$right-sidebar-width} - 1em);
|
||||||
}
|
}
|
||||||
|
|
||||||
h2, h3, h4, h5, h6 {
|
h2,
|
||||||
|
h3,
|
||||||
|
h4,
|
||||||
|
h5,
|
||||||
|
h6 {
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
font-family: $sans-serif-narrow;
|
font-family: $sans-serif-narrow;
|
||||||
}
|
}
|
||||||
|
|
||||||
p, li {
|
p,
|
||||||
|
li {
|
||||||
font-family: $sans-serif;
|
font-family: $sans-serif;
|
||||||
font-size: $type-size-6;
|
font-size: $type-size-6;
|
||||||
line-height: 1.5;
|
line-height: 1.5;
|
||||||
|
@ -76,7 +83,6 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.splash .sidebar__right {
|
.splash .sidebar__right {
|
||||||
|
|
||||||
@include breakpoint($large) {
|
@include breakpoint($large) {
|
||||||
position: relative;
|
position: relative;
|
||||||
float: right;
|
float: right;
|
||||||
|
|
|
@ -24,6 +24,27 @@ $(document).ready(function() {
|
||||||
// FitVids init
|
// FitVids init
|
||||||
$("#main").fitVids();
|
$("#main").fitVids();
|
||||||
|
|
||||||
|
// Sticky sidebar
|
||||||
|
var stickySideBar = function() {
|
||||||
|
var show =
|
||||||
|
$(".author__urls-wrapper button").length === 0
|
||||||
|
? $(window).width() > 1024 // width should match $large Sass variable
|
||||||
|
: !$(".author__urls-wrapper button").is(":visible");
|
||||||
|
if (show) {
|
||||||
|
// fix
|
||||||
|
$(".sidebar").addClass("sticky");
|
||||||
|
} else {
|
||||||
|
// unfix
|
||||||
|
$(".sidebar").removeClass("sticky");
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
stickySideBar();
|
||||||
|
|
||||||
|
$(window).resize(function() {
|
||||||
|
stickySideBar();
|
||||||
|
});
|
||||||
|
|
||||||
// Follow menu drop down
|
// Follow menu drop down
|
||||||
$(".author__urls-wrapper button").on("click", function() {
|
$(".author__urls-wrapper button").on("click", function() {
|
||||||
$(".author__urls").toggleClass("is--visible");
|
$(".author__urls").toggleClass("is--visible");
|
||||||
|
|
10
assets/js/main.min.js
vendored
10
assets/js/main.min.js
vendored
File diff suppressed because one or more lines are too long
Loading…
Reference in a new issue