search

mmistakes / minimal-mistakes

:triangular_ruler: Jekyll theme for building a personal site, blog, project documentation, or portfolio.
https://mmistakes.github.io/minimal-mistakes/
MIT License
12.33k stars 25.5k forks source link

Issue with minifying plugins #1158

Closed ashmaroli closed 7 years ago

ashmaroli commented 7 years ago

Environment

Expected behavior

Expected no visible change between vanilla site and that generated while using the above plugins.

Actual behavior

Illustrated with screenshots below

Steps to reproduce the behavior

  1. Set up a new project using jekyll 3.5.1
  2. Add a couple of dummy posts
  3. Serve and note render in browser
  4. Install and add either of the following plugins that minify HTML: jekyll-minifier / jekyll-tidy
  5. Restart Jekyll server and note render in browser

Observations

Fresh site setup from jekyll new and some additional dummy posts

mmloc

After enabling a HTML minifying / beautifying plugin:

mmloc2

mmistakes commented 7 years ago

If I had to guess it's likely screwing with assets/js/main.min.js

I've seen minifiers bork it because of the YAML Front Matter block.

---
layout:
---

Should be easy to verify by diffing the file bundled in the gem against what's in _site/assets/js/

ashmaroli commented 7 years ago

Perfect! I sensed it had something to do with main.js because of the associated console error in the browser. But forgot all about the banner text in the template script. :+1:

Removing the banner text in my installed copy of the gem fixes this issue. Also, the issue that led to the placement of the banner text in the first place has already been fixed in Jekyll 3.5..

So all is good.. N.B.: btw, should the hamburger icon be visible on a laptop? I didn't check the sass files..

mmistakes commented 7 years ago

Was thinking the same thing about the banner text. Since 3.5 fixed the issue, adding the blank front matter doesn't need to happen anymore.

The hamburger should only show when the menu items are wider than what can fit on screen. If you had one menu item that is fairly short you could potential never see a hamburger because it fits comfortability in the viewport.

Anything that overflows outside of it gets placed in the hamburger drop down with this script.

mmistakes commented 7 years ago

@ashmaroli I removed the blank YAML Front Matter --- --- from assets/js/main.min.js if you want to test out what's on master:

gem "minimal-mistakes-jekyll", :github => "mmistakes/minimal-mistakes"

Let me know if the JS is still getting mangled by those minifier plugins.

ashmaroli commented 7 years ago

This issue has been successfully resolved :clap: :smiley:

mmistakes commented 7 years ago

Sweet! Thanks for identifying the issue. Never felt great adding the blank YAML to that file to make it "overridable", glad it could be removed.

ashmaroli commented 7 years ago

My pleasure. :smiley:

I only did a superficial testing with overriding static asset files. I recommend that you carry out proper tests before releasing the next version to be more than sure it's all proper