Minimal-mistakes: Smooth Scroll + Gumshoe?

Created on 31 Jan 2019  ·  8Comments  ·  Source: mmistakes/minimal-mistakes

Summary

Hey!

Have you considered to use Smooth Scroll and Gumshoe instead of smooth scrolling? and scroll spy?

Motivation

The motivation is, in my site I have to switch from smooth scrolling to Smooth Scroll because I wasn't able to make it work correctly the former with bigfootjs footnotes when the original footnotes were still in place in at the bottom of the article. Every time I clicked in those clicks instead of going to the footnote it went to the top of the page.

Then I discovered Smooth Scroll and everything worked fine.

Since, you have also implemented scrool spy with the help of @edemaine I though it was a cool feature and I tried to implement myself and discovered that the same developer has Gumshoe that does similar job. I'm trying to implement on my page, but I'm missing something.

Drawbacks

I don't know... perhaps too much js plugins? and a very long uglify...

Accepted Enhancement

Most helpful comment

Updated Gumshoe to 5.1.0 in #2082, which supports headers. So now the TOC correctly highlights as you scroll. If you can test it out before I merge into master that would be much appreciated.

All 8 comments

This issue has been automatically marked as stale because it has not had recent activity.

If this is a bug and you can still reproduce this error on the master branch, please reply with any additional information you have about it in order to keep the issue open.

If this is a feature request, please consider whether it can be accomplished in another way. If it cannot, please elaborate on why it is core to this project and why you feel more than 80% of users would find this beneficial.

This issue will automatically be closed in 7 days if no further activity occurs. Thank you for all your contributions.

I put up a proof of concept that fixes the issue by using Smooth Scroll + Gumshoe. It needs some work yet as the scrollspy .active classes trigger as you scroll to a header, but turns off as you scroll pass it.

To test out the PR brand you can replace gem "minimal-mistakes-jekyll" in your Gemfile with the following:

gem 'minimal-mistakes-jekyll', :git => 'https://github.com/mmistakes/minimal-mistakes.git', :branch => 'smooth-scroll-gumshoe'

@mmistakes sounds great!! thanks a lot!

Updated Gumshoe to 5.1.0 in #2082, which supports headers. So now the TOC correctly highlights as you scroll. If you can test it out before I merge into master that would be much appreciated.

Great work!! thanks a lot I owe you a beer!

One question... One more than one question...

Wouldn't be better to use smooth-scroll.min.js and gumshoe.min.js? I'm actually using smooth-scroll.min.js and it seems fine. I really don't know if it's better or worse. I don't have that technical knowledge. I just guess that .min is easier to load.

Since I have a fixed header I have added an offset —60 in my case. This account for the masthead and a little bit more so the headers in the text aren't too close the masthead. I have this option on both gumshoe and smooth-scroll. In both of them seems that you can point to the masthead css selector and it would calculate the height. In smooth-scroll is just an option and in gumshoe is a function. The option in smooth-scroll seems to work, but I make it work in gumshoe.

Anyway, it would be great if it could be set up to calculate the height of the masthead and you can add a little bit more. I tried to accomplish it with the formula, but no luck. (I don't know java)

I'm not using the minified versions in the source folder as they're minified by the npm run build:js task that smooshes all the theme's JavaScript into a single file.

The theme isn't using a fixed header so I don't think there's a way for me to easily bake that in for users like you who have customized the theme. Those customizations would have to happen in your fork.

I'm not using the minified versions in the source folder as they're minified by the npm run build:js task that smooshes all the theme's JavaScript into a single file.

Thats true... hahaha I didn't realized that I'm double minifying. 😝

The theme isn't using a fixed header so I don't think there's a way for me to easily bake that in for users like you who have customized the theme. Those customizations would have to happen in your fork.

Yeah, I understand!

Was this page helpful?
0 / 5 - 0 ratings