Feature: Incorporate site search into masthead (#1383)

* Integrate search into masthead
* Fix cutoff descenders in archive article titles
* Remove search page from `/test` site
* Enable masthead search
* Remove dedicated search page
* Fix masthead search form padding
* Improve insertion of search content
* Speed up page transition
* Add fade transition to search content
* Rename visibility class names
* Add `site.search` to _config.yml
* Document site search feature
* Update CHANGELOG and history
This commit is contained in:
Michael Rose
2017-12-07 08:56:14 -05:00
committed by GitHub
parent 973520759c
commit 7eb00bbd61
28 changed files with 755 additions and 600 deletions

View File

@@ -2,11 +2,10 @@
jQuery plugin settings and other scripts
========================================================================== */
$(document).ready(function(){
$(document).ready(function() {
// Sticky footer
var bumpIt = function() {
$('body').css('margin-bottom', $('.page__footer').outerHeight(true));
$("body").css("margin-bottom", $(".page__footer").outerHeight(true));
},
didResize = false;
@@ -16,7 +15,7 @@ $(document).ready(function(){
didResize = true;
});
setInterval(function() {
if(didResize) {
if (didResize) {
didResize = false;
bumpIt();
}
@@ -31,11 +30,23 @@ $(document).ready(function(){
$(".author__urls-wrapper button").toggleClass("open");
});
// Search toggle
$(".search__toggle").on("click", function() {
$(".search-content").toggleClass("is--visible");
$(".initial-content").toggleClass("is--hidden");
// set focus on input
setTimeout(function() {
$("#search").focus();
}, 400);
});
// init smooth scroll
$("a").smoothScroll({offset: -20});
$("a").smoothScroll({ offset: -20 });
// add lightbox class to all image links
$("a[href$='.jpg'],a[href$='.jpeg'],a[href$='.JPG'],a[href$='.png'],a[href$='.gif']").addClass("image-popup");
$(
"a[href$='.jpg'],a[href$='.jpeg'],a[href$='.JPG'],a[href$='.png'],a[href$='.gif']"
).addClass("image-popup");
// Magnific-Popup options
$(".image-popup").magnificPopup({
@@ -45,28 +56,30 @@ $(document).ready(function(){
// }
// return true;
// },
type: 'image',
tLoading: 'Loading image #%curr%...',
type: "image",
tLoading: "Loading image #%curr%...",
gallery: {
enabled: true,
navigateByImgClick: true,
preload: [0,1] // Will preload 0 - before current, and 1 after the current image
preload: [0, 1] // Will preload 0 - before current, and 1 after the current image
},
image: {
tError: '<a href="%url%">Image #%curr%</a> could not be loaded.',
tError: '<a href="%url%">Image #%curr%</a> could not be loaded.'
},
removalDelay: 500, // Delay in milliseconds before popup is removed
// Class that is added to body when popup is open.
// make it unique to apply your CSS animations just to this exact popup
mainClass: 'mfp-zoom-in',
mainClass: "mfp-zoom-in",
callbacks: {
beforeOpen: function() {
// just a hack that adds mfp-anim class to markup
this.st.image.markup = this.st.image.markup.replace('mfp-figure', 'mfp-figure mfp-with-anim');
this.st.image.markup = this.st.image.markup.replace(
"mfp-figure",
"mfp-figure mfp-with-anim"
);
}
},
closeOnContentClick: true,
midClick: true // allow opening popup on middle mouse click. Always set it to true if you don't provide alternative source.
});
});