js: greedy-navigation: add changes for language selector

To reduce conflicts with upstream minimal-mistakes.

_config.yml

@@ -12,7 +12,7 @@
 
 # theme                  : "minimal-mistakes-jekyll"
 # remote_theme           : "mmistakes/minimal-mistakes"
-minimal_mistakes_skin    : "default" # "air", "aqua", "contrast", "dark", "dirt", "neon", "mint", "plum", "sunrise"
+minimal_mistakes_skin    : "dark" # "air", "aqua", "contrast", "dark", "dirt", "neon", "mint", "plum", "sunrise"
 
 # Site Settings
 locale                   : "en-US"
@@ -58,7 +58,7 @@ reCaptcha:
   secret                 :
 atom_feed:
   path                   : # blank (default) uses feed.xml
-  hide                   : # true, false (default)
+  hide                   : true # true, false (default)
 search                   : # true, false (default)
 search_full_content      : # true, false (default)
 search_provider          : # lunr (default), algolia, google
@@ -214,10 +214,10 @@ sass:
 
 
 # Outputting
-permalink: /:categories/:title/
+# permalink: /:categories/:title/
-paginate: 5 # amount of posts to show
+# paginate: 5 # amount of posts to show
-paginate_path: /page:num/
+# paginate_path: /page:num/
-timezone: # https://en.wikipedia.org/wiki/List_of_tz_database_time_zones
+# timezone: # https://en.wikipedia.org/wiki/List_of_tz_database_time_zones
 
 
 # Plugins (previously gems:)
@@ -226,7 +226,6 @@ plugins:
   - jekyll-sitemap
   - jekyll-gist
   - jekyll-feed
-  - jekyll-include-cache
 
 # mimic GitHub Pages with --safe
 whitelist:
@@ -234,7 +233,6 @@ whitelist:
   - jekyll-sitemap
   - jekyll-gist
   - jekyll-feed
-  - jekyll-include-cache
 
 
 # Archives

_includes/footer.html

@@ -18,4 +18,9 @@
   </ul>
 </div>
 
-<div class="page__footer-copyright">&copy; {{ site.time | date: '%Y' }} {{ site.name | default: site.title }}. {{ site.data.ui-text[site.locale].powered_by | default: "Powered by" }} <a href="https://jekyllrb.com" rel="nofollow">Jekyll</a> &amp; <a href="https://mademistakes.com/work/minimal-mistakes-jekyll-theme/" rel="nofollow">Minimal Mistakes</a>.</div>
+<!-- hacks-guide change start: custom footer -->
+{% assign split_path = page.path | split: "/" %}
+{% assign locale = split_path[1] %}
+{% assign titles = site.data.navigation[locale].footer %}
+<div class="page__footer-copyright">&copy; {{ site.time | date: '%Y' }} {{ site.name | default: site.title }}. - <a href="site-navigation">{{ titles[1].title }}</a> - <a href="privacy-policy">{{ titles[2].title }}</a> <!-- {{ site.data.ui-text[site.locale].powered_by | default: "Powered by" }} <a href="https://jekyllrb.com" rel="nofollow">Jekyll</a> &amp; <a href="https://mademistakes.com/work/minimal-mistakes-jekyll-theme/" rel="nofollow">Minimal Mistakes</a>.--></div>
+<!-- hacks-guide change end -->

_includes/head/custom.html

@@ -2,4 +2,53 @@
 
 <!-- insert favicons. use https://realfavicongenerator.net/ -->
 
+<!-- hacks-guide change start: cookie consent, favicon, locales -->
+
+<link rel="apple-touch-icon" sizes="180x180" href="{{ base_path }}/images/site-config/apple-touch-icon.png?v=PYEmwKvQAx">
+<link rel="icon" type="image/png" href="{{ base_path }}/images/site-config/favicon-16x16.png?v=PYEmwKvQAx" sizes="16x16">
+<link rel="icon" type="image/png" href="{{ base_path }}/images/site-config/favicon-32x32.png?v=PYEmwKvQAx" sizes="32x32">
+<link rel="icon" type="image/png" href="{{ base_path }}/images/site-config/favicon-194x194.png?v=PYEmwKvQAx" sizes="194x194">
+<link rel="icon" type="image/png" href="{{ base_path }}/images/site-config/android-chrome-192x192.png?v=PYEmwKvQAx" sizes="192x192">
+<link rel="manifest" href="{{ base_path }}/images/site-config/manifest.json?v=PYEmwKvQAx">
+<link rel="mask-icon" href="{{ base_path }}/images/site-config/safari-pinned-tab.svg?v=PYEmwKvQAx" color="#2E3440">
+<link rel="shortcut icon" href="{{ base_path }}/images/site-config/favicon.ico?v=PYEmwKvQAx">
+<meta name="apple-mobile-web-app-title" content="Guide">
+<meta name="application-name" content="Guide">
+<meta name="msapplication-TileColor" content="#2E3440">
+<meta name="msapplication-TileImage" content="{{ base_path }}/images/site-config/mstile-144x144.png?v=PYEmwKvQAx">
+<meta name="msapplication-config" content="{{ base_path }}/assets/xml/browserconfig.xml?v=PYEmwKvQAx">
+<meta name="theme-color" content="#2E3440">
+
+{% assign split_path = page.path | split: "/" %}
+{% assign locale = split_path[1] %}
+{% if locale == 'en_US' %}
+  {% assign locale_var = '/' %}
+{% else %}
+  {% assign locale_var = locale | prepend:'/' | append:'/' %}
+{% endif %}
+{% assign top = site.data.navigation[locale].top %}
+
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/cookieconsent2/3.1.1/cookieconsent.min.css" integrity="sha512-LQ97camar/lOliT/MqjcQs5kWgy6Qz/cCRzzRzUCfv0fotsCTC9ZHXaPQmJV8Xu/PVALfJZ7BDezl5lW3/qBxg==" crossorigin="anonymous" referrerpolicy="no-referrer" />
+<script src="https://cdnjs.cloudflare.com/ajax/libs/cookieconsent2/3.1.1/cookieconsent.min.js" integrity="sha512-yXXqOFjdjHNH1GND+1EO0jbvvebABpzGKD66djnUfiKlYME5HGMUJHoCaeE4D5PTG2YsSJf6dwqyUUvQvS0vaA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+<script>
+window.addEventListener("load", function(){
+window.cookieconsent.initialise({
+  "palette": {
+    "popup": {
+      "background": "#2e3440"
+    },
+    "button": {
+      "background": "#60818f"
+    }
+  },
+  "theme": "edgeless",
+  "position": "top",
+  "static": true,
+  "content": {
+    "message": "{{ top[0].title }}"
+  }
+})});
+</script>
+<!-- hacks-guide change end -->
+
 <!-- end custom head snippets -->

_includes/masthead.html

@@ -7,17 +7,33 @@
         {% unless logo_path == empty %}
           <a class="site-logo" href="{{ '/' | relative_url }}"><img src="{{ logo_path | relative_url }}" alt="{{ site.masthead_title | default: site.title }}"></a>
         {% endunless %}
+<!-- hacks-guide change start: disable default masthead title -->
+      <!--
         <a class="site-title" href="{{ '/' | relative_url }}">
           {{ site.masthead_title | default: site.title }}
           {% if site.subtitle %}<span class="site-subtitle">{{ site.subtitle }}</span>{% endif %}
         </a>
+      -->
+<!-- hacks-guide change end -->
         <ul class="visible-links">
-          {%- for link in site.data.navigation.main -%}
+<!-- hacks-guide change start: multi-language configuration -->
-            <li class="masthead__menu-item">
+          {% assign split_path = page.path | split: "/" %}
-              <a href="{{ link.url | relative_url }}"{% if link.description %} title="{{ link.description }}"{% endif %}>{{ link.title }}</a>
+          {% assign locale = split_path[1] %}
-            </li>
+          {% assign titles = site.data.navigation[locale].main %}
-          {%- endfor -%}
+          {% if locale == 'en_US' %}
-        </ul>
+            {% assign locale_var = '/' %}
+          {% else %}
+            {% assign locale_var = locale | prepend:'/' | append:'/' %}
+          {% endif %}
+
+          {% for link in site.data.navigation[locale].main %}
+            {% if link.url == "/" %}
+              <li class="masthead__menu-item masthead__menu-item--lg"><a href="{{ domain }}{{ locale_var }}">{{ link.title }}</a></li>
+            {% else %}
+              <li class="masthead__menu-item"><a href="{{ domain }}{{ locale_var }}{{ link.url }}">{{ link.title }}</a></li>
+            {% endif %}
+          {% endfor %}
+<!-- hacks-guide change end -->
         {% if site.search == true %}
         <button class="search__toggle" type="button">
           <span class="visually-hidden">{{ site.data.ui-text[site.locale].search_label | default: "Toggle search" }}</span>

_includes/nav_list

@@ -1,26 +1,34 @@
-{% assign navigation = site.data.navigation[include.nav] %}
+<!-- hacks-guide change start: Refactor entire subsection to allow using translations -->
+{% assign split_path = page.path | split: "/" %}
+{% assign locale = split_path[1] %}
+{% if locale == 'en_US' %}
+  {% assign locale_var = '/' %}
+{% else %}
+  {% assign locale_var = locale | prepend:'/' | append:'/' %}
+{% endif %}
+
+{% assign title = site.data.navigation[locale].sidebar_title %}
+{% assign navigation = site.data.navigation[locale].sidebar_pages %}
 
 <nav class="nav__list">
   {% if page.sidebar.title %}<h3 class="nav__title" style="padding-left: 0;">{{ page.sidebar.title }}</h3>{% endif %}
   <input id="ac-toc" name="accordion-toc" type="checkbox" />
   <label for="ac-toc">{{ site.data.ui-text[site.locale].menu_label | default: "Toggle Menu" }}</label>
   <ul class="nav__items">
-    {% for nav in navigation %}
     <li>
-        {% if nav.url %}
+      <span class="nav__sub-title">{{ title[0].title }}</span>
-          <a href="{{ nav.url | relative_url }}"><span class="nav__sub-title">{{ nav.title }}</span></a>
+      <ol>
+        {% for link in site.data.navigation[locale].sidebar_pages %}
+          {% if link.url == "/" %}
+            <li style="display: none;" data-name="home"><a href='{{ domain }}{{ locale_var }}'>{{ link.title }}</a></li>
+          {% elsif link.url == "multiple-options" %}
+            <li style="display: none;" data-name="multiple-options"><i>({{ link.title }})</i></li>
           {% else %}
-          <span class="nav__sub-title">{{ nav.title }}</span>
+            <li style="display: none;" data-name="{{ site.data.navigation.en_US.sidebar_pages[forloop.index0].url }}"><a href='{{ domain }}{{ locale_var }}{{ link.url }}'>{{ link.title }}</a></li>
           {% endif %}
-
-        {% if nav.children != null %}
-        <ul>
-          {% for child in nav.children %}
-            <li><a href="{{ child.url | relative_url }}"{% if child.url == page.url %} class="active"{% endif %}>{{ child.title }}</a></li>
         {% endfor %}
-        </ul>
+      </ol>
-        {% endif %}
     </li>
-    {% endfor %}
   </ul>
 </nav>
+<!-- hacks-guide change end -->

_includes/scripts.html

@@ -6,17 +6,19 @@
   <script src="{{ '/assets/js/main.min.js' | relative_url }}"></script>
 {% endif %}
 
+<!-- hacks-guide change start: Disable caching -->
 {% if site.search == true or page.layout == "search" %}
   {%- assign search_provider = site.search_provider | default: "lunr" -%}
   {%- case search_provider -%}
     {%- when "lunr" -%}
-      {% include_cached search/lunr-search-scripts.html %}
+      {% include search/lunr-search-scripts.html %}
     {%- when "google" -%}
-      {% include_cached search/google-search-scripts.html %}
+      {% include search/google-search-scripts.html %}
     {%- when "algolia" -%}
-      {% include_cached search/algolia-search-scripts.html %}
+      {% include search/algolia-search-scripts.html %}
   {%- endcase -%}
 {% endif %}
+<!-- hacks-guide change end -->
 
 {% include analytics.html %}
 {% include /comments-providers/scripts.html %}

_includes/sidebar.html

@@ -1,3 +1,5 @@
+<!-- hacks-guide change start: Implement progress table, replace existing sidebar -->
+<!--
 {% if page.author_profile or layout.author_profile or page.sidebar %}
   <div class="sidebar sticky">
   {% if page.author_profile or layout.author_profile %}{% include author-profile.html %}{% endif %}
@@ -17,3 +19,13 @@
   {% endif %}
   </div>
 {% endif %}
+-->
+
+{% if page.sidebar %}
+
+<div class="sidebar sticky" style="display: none;">
+  {% include nav_list %}
+</div>
+
+{% endif %}
+<!-- hacks-guide change end-->

_layouts/default.html

@@ -14,10 +14,11 @@
     {% include head/custom.html %}
   </head>
 
+<!-- hacks-guide change start: Disable caching -->
   <body class="layout--{{ page.layout | default: layout.layout }}{% if page.classes or layout.classes %}{{ page.classes | default: layout.classes | join: ' ' | prepend: ' ' }}{% endif %}">
-    {% include_cached skip-links.html %}
+    {% include skip-links.html %}
-    {% include_cached browser-upgrade.html %}
+    {% include browser-upgrade.html %}
-    {% include_cached masthead.html %}
+    {% include masthead.html %}
 
     <div class="initial-content">
       {{ content }}
@@ -25,16 +26,17 @@
 
     {% if site.search == true %}
       <div class="search-content">
-        {% include_cached search/search_form.html %}
+        {% include search/search_form.html %}
       </div>
     {% endif %}
 
     <div id="footer" class="page__footer">
       <footer>
         {% include footer/custom.html %}
-        {% include_cached footer.html %}
+        {% include footer.html %}
       </footer>
     </div>
+<!-- hacks-guide change end -->
 
     {% include scripts.html %}
 

_layouts/single.html

@@ -40,6 +40,24 @@ layout: default
             </nav>
           </aside>
         {% endif %}
+<!-- hacks-guide change start -->
+        <hr>
+
+        {% assign split_path = page.path | split: "/" %}
+        {% assign locale = split_path[1] %}
+
+        {% for link in site.data.navigation[locale].bottom %}
+          {% if link.url contains 'http' %}
+            {% assign domain = '' %}
+          {% else %}
+            {% assign domain = site.url | append: site.baseurl %}
+          {% endif %}
+          <div class ="notice"><b>{{ link.title }}</b></div>
+        {% endfor %}
+
+        <hr>
+<!-- hacks-guide change end -->
+
         {{ content }}
         {% if page.link %}<div><a href="{{ page.link }}" class="btn btn--primary">{{ site.data.ui-text[site.locale].ext_link_label | default: "Direct Link" }}</a></div>{% endif %}
       </section>

_layouts/splash.html

@@ -16,6 +16,24 @@ layout: default
     {% if page.last_modified_at %}<meta itemprop="dateModified" content="{{ page.last_modified_at | date_to_xmlschema }}">{% endif %}
 
     <section class="page__content" itemprop="text">
+
+<!-- hacks-guide change start -->
+      <hr>
+
+      {% assign split_path = page.path | split: "/" %}
+      {% assign locale = split_path[1] %}
+
+      {% for link in site.data.navigation[locale].bottom %}
+        {% if link.url contains 'http' %}
+          {% assign domain = '' %}
+        {% else %}
+          {% assign domain = site.url | append: site.baseurl %}
+        {% endif %}
+        <div class ="notice"><b>{{ link.title }}</b></div>
+      {% endfor %}
+
+<hr>
+<!-- hacks-guide change end -->
       {{ content }}
     </section>
   </article>

_sass/minimal-mistakes/_base.scss

@@ -6,6 +6,12 @@ html {
   /* sticky footer fix */
   position: relative;
   min-height: 100%;
+/* hacks-guide change start: add text selection custom colours */
+::selection {
+  color: $text-color;
+  background: $text-highlight-color;
+}
+/* hacks-guide change end */
 }
 
 body {

_sass/minimal-mistakes/_navigation.scss

@@ -191,6 +191,8 @@
       color: $masthead-link-color-hover;
     }
 
+/* hacks-guide change start: disable site logo, site title */
+    /*
     &.site-logo {
       margin-left: 0;
       margin-right: 0.5rem;
@@ -199,6 +201,8 @@
     &.site-title {
       margin-left: 0;
     }
+    */
+/* hacks-guide change end */
   }
   
   img{
@@ -216,13 +220,27 @@
     cursor: pointer;
   }
 
+/* hacks-guide change start: add language selector */
+  &__toggle_lang {
+    -ms-flex-item-align: center;
+    align-self: center;
+    height: $nav-toggle-height;
+    border: 0;
+    outline: none;
+    background-color: transparent;
+    cursor: pointer;
+  }
+/* hacks-guide change end */
+
   .visible-links {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
-    -webkit-box-pack: end;
+/* hacks-guide change start: s/end/start */
-    -ms-flex-pack: end;
+    -webkit-box-pack: start;
-    justify-content: flex-end;
+    -ms-flex-pack: start;
+    justify-content: flex-start;
+/* hacks-guide change end */
     -webkit-box-flex: 1;
     -ms-flex: 1;
     flex: 1;
@@ -322,6 +340,13 @@
       }
     }
   }
+
+/* hacks-guide change start: adjust links-menu position */
+  .links-menu {
+    right: 2rem;
+  }
+/* hacks-guide change end */
+
 }
 
 .no-js {
@@ -445,12 +470,29 @@
     color: inherit;
   }
 
+/* hacks-guide change start: Add progress table */
+  ol {
+    padding-left: 0.9rem;
+  }
+
+  li {
+    list-style: inherit;
+  }
+
+  .completed {
+    color: $gray;
+    text-decoration: line-through;
+  }
+/* hacks-guide change end */
+
+/* hacks-guide change start: disable padding on active */
   .active {
-    margin-left: -0.5em;
+    // margin-left: -0.5em;
-    padding-left: 0.5em;
+    // padding-left: 0.5em;
-    padding-right: 0.5em;
+    // padding-right: 0.5em;
     font-weight: bold;
   }
+/* hacks-guide change end */
 
   @include breakpoint(max-width $large - 1px) {
     position: relative;

_sass/minimal-mistakes/_notices.scss

@@ -17,6 +17,7 @@
   font-family: $global-font-family;
   font-size: $type-size-6 !important;
   text-indent: initial; /* override*/
+  font-weight: bold; /* hacks-guide change: override font-weight on notices for readability */
   background-color: mix($background-color, $notice-color, $notice-background-mix);
   border-radius: $border-radius;
   box-shadow: 0 1px 1px rgba($notice-color, 0.25);
@@ -46,11 +47,13 @@
   }
 
   a {
-    color: mix(#000, $notice-color, 10%);
+/* hacks-guide change start: adjust colours for links in notices for readability */
+    color: mix(#fff, $notice-color, 30%);
 
     &:hover {
-      color: mix(#000, $notice-color, 50%);
+      color: mix(#fff, $notice-color, 70%);
     }
+/* hacks-guide change end */
   }
 
   code {

_sass/minimal-mistakes/_page.scss

@@ -98,6 +98,7 @@ body {
 			-moz-transition: opacity 0.2s ease-in-out 0.1s;
 			-o-transition: opacity 0.2s ease-in-out 0.1s;
 			transition: opacity 0.2s ease-in-out 0.1s;
+      user-select: none; /* hacks-guide change: do not change link colour as it hurts readability */
 		}
 
 		&:hover .header-link {

_sass/minimal-mistakes/_tables.scss

@@ -2,13 +2,14 @@
    TABLES
    ========================================================================== */
 
-table {
+  table {
-  display: block;
+  display: table; /* hacks-guide change */
   margin-bottom: 1em;
   width: 100%;
   font-family: $global-font-family;
   font-size: $type-size-6;
   border-collapse: collapse;
+  border: 1px solid $light-gray; /* hacks-guide change */
   overflow-x: auto;
 
   & + table {
@@ -18,18 +19,26 @@ table {
 
 thead {
   background-color: $border-color;
-  border-bottom: 2px solid mix(#000, $border-color, 25%);
+/* hacks-guide change start */
+  // border-bottom: 2px solid mix(#000, $border-color, 25%);
+  border-bottom: 1px solid $light-gray;
+/* hacks-guide change end */
 }
 
 th {
   padding: 0.5em;
   font-weight: bold;
   text-align: left;
+  border-right: 1px solid $light-gray; /* hacks-guide change */
 }
 
 td {
   padding: 0.5em;
-  border-bottom: 1px solid mix(#000, $border-color, 25%);
+/* hacks-guide change start */
+  // border-bottom: 1px solid mix(#000, $border-color, 25%);
+  border-bottom: 1px solid $light-gray;
+  border-right: 1px solid $light-gray;
+/* hacks-guide change end */
 }
 
 tr,

_sass/minimal-mistakes/_utilities.scss

@@ -385,6 +385,8 @@ body:hover .visually-hidden button {
   }
 }
 
+/* hacks-guide change start: disable toggle effects on navigation as it breaks the site in some cases */
+/* 
 .greedy-nav__toggle {
   &:before {
     @supports (pointer-events: none) {
@@ -425,6 +427,8 @@ body:hover .visually-hidden button {
     }
   }
 }
+*/
+/* hacks-guide change end */
 
 /*
    Sticky, fixed to top content
@@ -591,3 +595,68 @@ a.reversefootnote {
     position: static;
   }
 }
+
+/* hacks-guide change start: Add language selector */
+/*
+    Langicons
+    ========================================================================== */
+
+.langicon {
+  position: relative;
+  width: $navicon-width;
+  display: inline-block;
+  background: transparent;
+  margin: auto;
+  color: $text-color;
+
+  &:before,
+  &:after {
+    content: "";
+    position: absolute;
+    left: 0;
+    width: $navicon-width;
+    height: $navicon-height;
+    background: $text-color;
+    display: none;
+  }
+
+  &:before {
+    top: (-2 * $navicon-height);
+  }
+
+  &:after {
+    bottom: (-2 * $navicon-height);
+  }
+}
+  
+.close .langicon {
+  /* hide the middle line*/
+  background: transparent;
+
+  .fa-language {
+    display: none;
+    -webkit-transition: 0.3s;
+    transition: 0.3s;
+  }
+
+  /* overlay the lines by setting both their top values to 0*/
+  &:before, &:after{
+    -webkit-transform-origin: 50% 50%;
+        -ms-transform-origin: 50% 50%;
+            transform-origin: 50% 50%;
+    width: $navicon-width;
+    display: inherit;
+  }
+
+  /* rotate the lines to form the x shape*/
+  &:before{
+    -webkit-transform: rotate3d(0,0,1,45deg);
+            transform: rotate3d(0,0,1,45deg);
+  }
+  &:after{
+    top: (-2 * $navicon-height);
+    -webkit-transform: rotate3d(0,0,1,-45deg);
+            transform: rotate3d(0,0,1,-45deg);
+  }
+}
+/* hacks-guide change end */

_sass/minimal-mistakes/skins/_dark.scss

@@ -3,7 +3,10 @@
    ========================================================================== */
 
 /* Colors */
-$background-color: #252a34 !default;
+/* hacks guide changes begin */
+$background-color: #28282b !default;
+$text-highlight-color: #ffffff26 !default;
+/* hacks guide changes end */
 $text-color: #eaeaea !default;
 $primary-color: #00adb5 !default;
 $border-color: mix(#fff, $background-color, 20%) !default;

assets/js/plugins/jquery.greedy-navigation.js

@@ -4,15 +4,19 @@ Licensed under the MIT license - http://opensource.org/licenses/MIT
 Copyright (c) 2015 Luke Jackson
 */
 
+/* hacks-guide change: add language selector, remove logo */
+
 $(function() {
 
   var $btn = $("nav.greedy-nav .greedy-nav__toggle");
+  var $btn2 = $("nav.greedy-nav .greedy-nav__toggle_lang");
   var $vlinks = $("nav.greedy-nav .visible-links");
-  var $hlinks = $("nav.greedy-nav .hidden-links");
+  var $hlinks = $("nav.greedy-nav .hidden-links.links-menu");
+  var $hlinks2 = $("nav.greedy-nav .hidden-links.lang-menu");
   var $nav = $("nav.greedy-nav");
-  var $logo = $('nav.greedy-nav .site-logo');
+  // var $logo = $('nav.greedy-nav .site-logo');
   var $logoImg = $('nav.greedy-nav .site-logo img');
-  var $title = $("nav.greedy-nav .site-title");
+  // var $title = $("nav.greedy-nav .site-title");
   var $search = $('nav.greedy-nav button.search__toggle');
 
   var numOfItems, totalSpace, closingTime, breakWidths;
@@ -52,7 +56,7 @@ $(function() {
   // Set the last measured CSS width breakpoint: 0: <768px, 1: <1024px, 2: < 1280px, 3: >= 1280px.
   var lastBreakpoint = winWidth < 768 ? 0 : winWidth < 1024 ? 1 : winWidth < 1280 ? 2 : 3;
 
-  var availableSpace, numOfVisibleItems, requiredSpace, timer;
+  var availableSpace, numOfVisibleItems, requiredSpace, timer, timer2;
 
   function check() {
 
@@ -68,10 +72,11 @@ $(function() {
     numOfVisibleItems = $vlinks.children().length;
     // Decrease the width of visible elements from the nav innerWidth to find out the available space for navItems
     availableSpace = /* nav */ $nav.innerWidth()
-                   - /* logo */ ($logo.length !== 0 ? $logo.outerWidth(true) : 0)
+                   - /* logo */ // ($logo.length !== 0 ? $logo.outerWidth(true) : 0)
-                   - /* title */ $title.outerWidth(true)
+                   - /* title */ // $title.outerWidth(true)
                    - /* search */ ($search.length !== 0 ? $search.outerWidth(true) : 0)
-                   - /* toggle */ (numOfVisibleItems !== breakWidths.length ? $btn.outerWidth(true) : 0);
+                   - /* toggle */ (numOfVisibleItems !== breakWidths.length ? $btn.outerWidth(true) : 0)
+                   - /* toggle-lang */ ($btn2.outerWidth(true));
     requiredSpace = breakWidths[numOfVisibleItems - 1];
 
     // There is not enought space
@@ -98,9 +103,17 @@ $(function() {
   });
 
   $btn.on('click', function() {
-    $hlinks.toggleClass('hidden');
+    if($hlinks.is(":visible")){
-    $(this).toggleClass('close');
+      $hlinks.addClass('hidden');
+      $(this).removeClass('close');
       clearTimeout(timer);
+    } else {
+      $hlinks.removeClass('hidden');
+      $(this).addClass('close');
+      $hlinks2.addClass('hidden');
+      $btn2.removeClass('close');
+      clearTimeout(timer);
+    }
   });
 
   $hlinks.on('mouseleave', function() {
@@ -113,6 +126,30 @@ $(function() {
     clearTimeout(timer);
   })
 
+  $btn2.on('click', function() {
+    if($hlinks2.is(":visible")){
+      $hlinks2.addClass('hidden');
+      $(this).removeClass('close');
+      clearTimeout(timer2);
+    } else {
+      $hlinks2.removeClass('hidden');
+      $(this).addClass('close');
+      $hlinks.addClass('hidden');
+      $btn.removeClass('close');
+      clearTimeout(timer2);
+    }
+  });
+
+  $hlinks2.on('mouseleave', function() {
+    // Mouse has left, start the timer
+    timer2 = setTimeout(function() {
+      $hlinks2.addClass('hidden');
+    }, closingTime);
+  }).on('mouseenter', function() {
+    // Mouse is back, cancel the timer
+    clearTimeout(timer2);
+  })
+
   // check if page has a logo
   if($logoImg.length !== 0){
     // check if logo is not loaded

minimal-mistakes-jekyll.gemspec

@@ -1,7 +1,7 @@
 # coding: utf-8
 
 Gem::Specification.new do |spec|
-  spec.name                    = "minimal-mistakes-jekyll"
+  spec.name                    = "minimal-mistakes-hacks-guide"
   spec.version                 = "4.24.0"
   spec.authors                 = ["Michael Rose"]