Merge branch 'master' into fix-duplicates-in-nav

.github/ISSUE_TEMPLATE/config.yml

@@ -0,0 +1,5 @@
+blank_issues_enabled: false
+contact_links:
+  - name: Ask a question
+    url: https://github.com/pmarsceill/just-the-docs/discussions
+    about: Ask questions and discuss with other community members

.github/workflows/ci.yml

@@ -1,11 +1,11 @@
-on: [push]
+on: [pull_request]
 
 name: CI
 
 jobs:
 
-  jekyll:
+  jekyll-latest:
-    name: Build Jekyll site
+    name: Build Jekyll site (latest)
     runs-on: ubuntu-latest
     steps:
 
@@ -15,21 +15,58 @@ jobs:
       run: |
         docker run --rm \
         --volume="${{ github.workspace }}:/srv/jekyll" \
-        jekyll/builder:3.8.5 /bin/bash -c "chmod 777 /srv/jekyll && jekyll build"
+        jekyll/builder:latest /bin/bash -c "gem install bundler && chmod -R 777 /srv/jekyll && jekyll build && bundle exec just-the-docs rake search:init"
 
-  css:
+  jekyll-3-8-5:
-    name: Stylelint
+    name: Build Jekyll site (v3.8.5)
     runs-on: ubuntu-latest
     steps:
 
     - uses: actions/checkout@master
 
-    - name: Use Node.js 10.x
+    - name: Build the site in the jekyll/builder container
+      run: |
+        docker run --rm \
+        --volume="${{ github.workspace }}:/srv/jekyll" \
+        jekyll/builder:3.8.5 /bin/bash -c "gem install bundler && chmod -R 777 /srv/jekyll && jekyll build && bundle exec just-the-docs rake search:init"
+
+  assets:
+    name: Format and test CSS and JS
+    runs-on: ubuntu-latest
+
+    steps:
+    - uses: actions/checkout@v2
+      # Using this so the this instead of GITHUB_TOKEN so that this workflow can trigger another
+      with:
+        token: ${{ secrets.PAT }} 
+    - name: Use Node.js 12.x
       uses: actions/setup-node@v1
       with:
-        version: 10.x
+        node-version: '12.x'
+    - name: Extract branch name
+      shell: bash
+      run: echo "##[set-output name=branch;]$(echo ${GITHUB_HEAD_REF#refs/heads/})"
+      id: extract_branch
 
-    - name: npm install, build, and test
+    - run: npm install
+    - run: npm run format
+    - name: Add changed files
       run: |
-        npm install
+        echo "https://$GITHUB_ACTOR:$GITHUB_TOKEN@github.com/$GITHUB_REPOSITORY.git"
-        npm test
+        git config --global user.email $GITHUB_ACTOR@users.noreply.github.com
+        git config --global user.name $GITHUB_ACTOR
+        echo "extracted branch is ${{ steps.extract_branch.outputs.branch }}"
+        git checkout -b ${{ steps.extract_branch.outputs.branch }}
+        git status
+        git add .
+    - name: Are there any updates?
+      shell: bash
+      run: echo "##[set-output name=status]$(git status -s)"
+      id: is_dirty
+    - name: Commit files
+      if: steps.is_dirty.outputs.status
+      run: |
+        echo ${{ steps.is_dirty.outputs.status }}
+        git commit -m "🎨 Prettier"
+        git push --force --set-upstream "https://${GITHUB_ACTOR}:${GITHUB_TOKEN}@github.com/${GITHUB_REPOSITORY}.git" ${{ steps.extract_branch.outputs.branch }}
+    - run: npm test

.prettierignore

@@ -0,0 +1,8 @@
+package.json
+package-lock.json
+_site
+assets/css/dark-mode-preview.scss
+assets/css/just-the-docs.scss
+assets/js/vendor/lunr.min.js
+assets/js/search-data.json
+assets/js/just-the-docs.js

.prettierrc

@@ -0,0 +1,8 @@
+{
+  "endOfLine": "lf",
+  "semi": false,
+  "singleQuote": false,
+  "tabWidth": 2,
+  "trailingComma": "es5"
+}
+

.stylelintrc.json

@@ -4,7 +4,9 @@
     "assets/css/dark-mode-preview.scss",
     "_sass/vendor/**/*.scss"
   ],
-  "extends": [
+  "extends": ["stylelint-config-primer", "stylelint-config-prettier"],
-    "stylelint-config-primer"
+  "plugins": ["stylelint-prettier"],
-  ]
+  "rules": {
+    "prettier/prettier": true
+  }
 }

_sass/base.scss

@@ -76,9 +76,11 @@ a:not([class]) {
   background-size: 1px 1px;
 
   &:hover {
-    background-image: linear-gradient(rgba($link-color, 0.45) 0%, rgba($link-color, 0.45) 100%);
+    background-image: linear-gradient(
+      rgba($link-color, 0.45) 0%,
+      rgba($link-color, 0.45) 100%
+    );
     background-size: 1px 1px;
-
   }
 }
 

_sass/code.scss

@@ -30,74 +30,212 @@ figure.highlight {
   border-radius: $border-radius;
 }
 
-.highlight .c { color: #586e75; } // comment //
+.highlight .c {
-.highlight .err { color: #93a1a1; } // error //
+  color: #586e75;
-.highlight .g { color: #93a1a1; } // generic //
+} // comment //
-.highlight .k { color: #859900; } // keyword //
+.highlight .err {
-.highlight .l { color: #93a1a1; } // literal //
+  color: #93a1a1;
-.highlight .n { color: #93a1a1; } // name //
+} // error //
-.highlight .o { color: #859900; } // operator //
+.highlight .g {
-.highlight .x { color: #cb4b16; } // other //
+  color: #93a1a1;
-.highlight .p { color: #93a1a1; } // punctuation //
+} // generic //
-.highlight .cm { color: #586e75; } // comment.multiline //
+.highlight .k {
-.highlight .cp { color: #859900; } // comment.preproc //
+  color: #859900;
-.highlight .c1 { color: #586e75; } // comment.single //
+} // keyword //
-.highlight .cs { color: #859900; } // comment.special //
+.highlight .l {
-.highlight .gd { color: #2aa198; } // generic.deleted //
+  color: #93a1a1;
-.highlight .ge { font-style: italic; color: #93a1a1; } // generic.emph //
+} // literal //
-.highlight .gr { color: #dc322f; } // generic.error //
+.highlight .n {
-.highlight .gh { color: #cb4b16; } // generic.heading //
+  color: #93a1a1;
-.highlight .gi { color: #859900; } // generic.inserted //
+} // name //
-.highlight .go { color: #93a1a1; } // generic.output //
+.highlight .o {
-.highlight .gp { color: #93a1a1; } // generic.prompt //
+  color: #859900;
-.highlight .gs { font-weight: bold; color: #93a1a1; } // generic.strong //
+} // operator //
-.highlight .gu { color: #cb4b16; } // generic.subheading //
+.highlight .x {
-.highlight .gt { color: #93a1a1; } // generic.traceback //
+  color: #cb4b16;
-.highlight .kc { color: #cb4b16; } // keyword.constant //
+} // other //
-.highlight .kd { color: #268bd2; } // keyword.declaration //
+.highlight .p {
-.highlight .kn { color: #859900; } // keyword.namespace //
+  color: #93a1a1;
-.highlight .kp { color: #859900; } // keyword.pseudo //
+} // punctuation //
-.highlight .kr { color: #268bd2; } // keyword.reserved //
+.highlight .cm {
-.highlight .kt { color: #dc322f; } // keyword.type //
+  color: #586e75;
-.highlight .ld { color: #93a1a1; } // literal.date //
+} // comment.multiline //
-.highlight .m { color: #2aa198; } // literal.number //
+.highlight .cp {
-.highlight .s { color: #2aa198; } // literal.string //
+  color: #859900;
-.highlight .na { color: #555; } // name.attribute //
+} // comment.preproc //
-.highlight .nb { color: #b58900; } // name.builtin //
+.highlight .c1 {
-.highlight .nc { color: #268bd2; } // name.class //
+  color: #586e75;
-.highlight .no { color: #cb4b16; } // name.constant //
+} // comment.single //
-.highlight .nd { color: #268bd2; } // name.decorator //
+.highlight .cs {
-.highlight .ni { color: #cb4b16; } // name.entity //
+  color: #859900;
-.highlight .ne { color: #cb4b16; } // name.exception //
+} // comment.special //
-.highlight .nf { color: #268bd2; } // name.function //
+.highlight .gd {
-.highlight .nl { color: #555; } // name.label //
+  color: #2aa198;
-.highlight .nn { color: #93a1a1; } // name.namespace //
+} // generic.deleted //
-.highlight .nx { color: #555; } // name.other //
+.highlight .ge {
-.highlight .py { color: #93a1a1; } // name.property //
+  font-style: italic;
-.highlight .nt { color: #268bd2; } // name.tag //
+  color: #93a1a1;
-.highlight .nv { color: #268bd2; } // name.variable //
+} // generic.emph //
-.highlight .ow { color: #859900; } // operator.word //
+.highlight .gr {
-.highlight .w { color: #93a1a1; } // text.whitespace //
+  color: #dc322f;
-.highlight .mf { color: #2aa198; } // literal.number.float //
+} // generic.error //
-.highlight .mh { color: #2aa198; } // literal.number.hex //
+.highlight .gh {
-.highlight .mi { color: #2aa198; } // literal.number.integer //
+  color: #cb4b16;
-.highlight .mo { color: #2aa198; } // literal.number.oct //
+} // generic.heading //
-.highlight .sb { color: #586e75; } // literal.string.backtick //
+.highlight .gi {
-.highlight .sc { color: #2aa198; } // literal.string.char //
+  color: #859900;
-.highlight .sd { color: #93a1a1; } // literal.string.doc //
+} // generic.inserted //
-.highlight .s2 { color: #2aa198; } // literal.string.double //
+.highlight .go {
-.highlight .se { color: #cb4b16; } // literal.string.escape //
+  color: #93a1a1;
-.highlight .sh { color: #93a1a1; } // literal.string.heredoc //
+} // generic.output //
-.highlight .si { color: #2aa198; } // literal.string.interpol //
+.highlight .gp {
-.highlight .sx { color: #2aa198; } // literal.string.other //
+  color: #93a1a1;
-.highlight .sr { color: #dc322f; } // literal.string.regex //
+} // generic.prompt //
-.highlight .s1 { color: #2aa198; } // literal.string.single //
+.highlight .gs {
-.highlight .ss { color: #2aa198; } // literal.string.symbol //
+  font-weight: bold;
-.highlight .bp { color: #268bd2; } // name.builtin.pseudo //
+  color: #93a1a1;
-.highlight .vc { color: #268bd2; } // name.variable.class //
+} // generic.strong //
-.highlight .vg { color: #268bd2; } // name.variable.global //
+.highlight .gu {
-.highlight .vi { color: #268bd2; } // name.variable.instance //
+  color: #cb4b16;
-.highlight .il { color: #2aa198; } // literal.number.integer.long //
+} // generic.subheading //
+.highlight .gt {
+  color: #93a1a1;
+} // generic.traceback //
+.highlight .kc {
+  color: #cb4b16;
+} // keyword.constant //
+.highlight .kd {
+  color: #268bd2;
+} // keyword.declaration //
+.highlight .kn {
+  color: #859900;
+} // keyword.namespace //
+.highlight .kp {
+  color: #859900;
+} // keyword.pseudo //
+.highlight .kr {
+  color: #268bd2;
+} // keyword.reserved //
+.highlight .kt {
+  color: #dc322f;
+} // keyword.type //
+.highlight .ld {
+  color: #93a1a1;
+} // literal.date //
+.highlight .m {
+  color: #2aa198;
+} // literal.number //
+.highlight .s {
+  color: #2aa198;
+} // literal.string //
+.highlight .na {
+  color: #555;
+} // name.attribute //
+.highlight .nb {
+  color: #b58900;
+} // name.builtin //
+.highlight .nc {
+  color: #268bd2;
+} // name.class //
+.highlight .no {
+  color: #cb4b16;
+} // name.constant //
+.highlight .nd {
+  color: #268bd2;
+} // name.decorator //
+.highlight .ni {
+  color: #cb4b16;
+} // name.entity //
+.highlight .ne {
+  color: #cb4b16;
+} // name.exception //
+.highlight .nf {
+  color: #268bd2;
+} // name.function //
+.highlight .nl {
+  color: #555;
+} // name.label //
+.highlight .nn {
+  color: #93a1a1;
+} // name.namespace //
+.highlight .nx {
+  color: #555;
+} // name.other //
+.highlight .py {
+  color: #93a1a1;
+} // name.property //
+.highlight .nt {
+  color: #268bd2;
+} // name.tag //
+.highlight .nv {
+  color: #268bd2;
+} // name.variable //
+.highlight .ow {
+  color: #859900;
+} // operator.word //
+.highlight .w {
+  color: #93a1a1;
+} // text.whitespace //
+.highlight .mf {
+  color: #2aa198;
+} // literal.number.float //
+.highlight .mh {
+  color: #2aa198;
+} // literal.number.hex //
+.highlight .mi {
+  color: #2aa198;
+} // literal.number.integer //
+.highlight .mo {
+  color: #2aa198;
+} // literal.number.oct //
+.highlight .sb {
+  color: #586e75;
+} // literal.string.backtick //
+.highlight .sc {
+  color: #2aa198;
+} // literal.string.char //
+.highlight .sd {
+  color: #93a1a1;
+} // literal.string.doc //
+.highlight .s2 {
+  color: #2aa198;
+} // literal.string.double //
+.highlight .se {
+  color: #cb4b16;
+} // literal.string.escape //
+.highlight .sh {
+  color: #93a1a1;
+} // literal.string.heredoc //
+.highlight .si {
+  color: #2aa198;
+} // literal.string.interpol //
+.highlight .sx {
+  color: #2aa198;
+} // literal.string.other //
+.highlight .sr {
+  color: #dc322f;
+} // literal.string.regex //
+.highlight .s1 {
+  color: #2aa198;
+} // literal.string.single //
+.highlight .ss {
+  color: #2aa198;
+} // literal.string.symbol //
+.highlight .bp {
+  color: #268bd2;
+} // name.builtin.pseudo //
+.highlight .vc {
+  color: #268bd2;
+} // name.variable.class //
+.highlight .vg {
+  color: #268bd2;
+} // name.variable.global //
+.highlight .vi {
+  color: #268bd2;
+} // name.variable.instance //
+.highlight .il {
+  color: #2aa198;
+} // literal.number.integer.long //
 
 //
 // Code examples (rendered)

_sass/color_schemes/dark.scss

@@ -1,4 +1,3 @@
-
 $body-background-color: $grey-dk-300;
 $sidebar-color: $grey-dk-300;
 $border-color: $grey-dk-200;

_sass/layout.scss

@@ -58,7 +58,9 @@
   }
 
   @include mq(lg) {
-    margin-left: calc((100% - #{$nav-width + $content-width}) / 2 + #{$nav-width});
+    margin-left: calc(
+      (100% - #{$nav-width + $content-width}) / 2 + #{$nav-width}
+    );
   }
 }
 
@@ -104,7 +106,6 @@
 .navigation,
 .site-header,
 .site-footer {
-
   width: 100%;
 
   @include mq(lg) {

_sass/support/_functions.scss

@@ -3,8 +3,7 @@
 
   @if ($unit == false) {
     @return #{$remSize};
-  }
+  } @else {
-  @else {
     @return #{$remSize}rem;
   }
 }

_sass/support/_variables.scss

@@ -2,7 +2,8 @@
 // Typography
 //
 
-$body-font-family: -apple-system, BlinkMacSystemFont, "helvetica neue", helvetica, roboto, noto, "segoe ui", arial, sans-serif !default;
+$body-font-family: -apple-system, BlinkMacSystemFont, "helvetica neue",
+  helvetica, roboto, noto, "segoe ui", arial, sans-serif !default;
 $mono-font-family: "SFMono-Regular", Menlo, Consolas, Monospace !default;
 $root-font-size: 16px !default; // Base font-size for rems
 $body-line-height: 1.4 !default;
@@ -82,7 +83,7 @@ $spacers: (
   sp-7: $spacing-unit * 2.5,
   sp-8: $spacing-unit * 3,
   sp-9: $spacing-unit * 3.5,
-  sp-10: $spacing-unit * 4
+  sp-10: $spacing-unit * 4,
 ) !default;
 
 $sp-1: map-get($spacers, sp-1) !default; // 0.25 rem == 4px
@@ -125,5 +126,5 @@ $media-queries: (
   sm: 500px,
   md: $content-width,
   lg: $content-width + $nav-width,
-  xl: 1400px
+  xl: 1400px,
 ) !default;

_sass/support/mixins/_layout.scss

@@ -15,9 +15,7 @@
     @media (min-width: rem($value)) {
       @content;
     }
-  }
+  } @else {
-
-  @else {
     @warn "No value could be retrieved from `#{$media-query}`. "
       + "Please make sure it is defined in `$media-queries` map.";
   }

_sass/utilities/_layout.scss

@@ -5,11 +5,21 @@
 
 // Display
 
-.d-block { display: block !important; }
+.d-block {
-.d-flex { display: flex !important; }
+  display: block !important;
-.d-inline { display: inline !important; }
+}
-.d-inline-block { display: inline-block !important; }
+.d-flex {
-.d-none { display: none !important; }
+  display: flex !important;
+}
+.d-inline {
+  display: inline !important;
+}
+.d-inline-block {
+  display: inline-block !important;
+}
+.d-none {
+  display: none !important;
+}
 
 @each $media-query in map-keys($media-queries) {
   @for $i from 1 through length($spacers) {
@@ -18,21 +28,42 @@
       $scale: #{$i - 1};
 
       // .d-sm-block, .d-md-none, .d-lg-inline
-      .d-#{$media-query}-block { display: block !important; }
+      .d-#{$media-query}-block {
-      .d-#{$media-query}-flex { display: flex !important; }
+        display: block !important;
-      .d-#{$media-query}-inline { display: inline !important; }
+      }
-      .d-#{$media-query}-inline-block { display: inline-block !important; }
+      .d-#{$media-query}-flex {
-      .d-#{$media-query}-none { display: none !important; }
+        display: flex !important;
-
+      }
+      .d-#{$media-query}-inline {
+        display: inline !important;
+      }
+      .d-#{$media-query}-inline-block {
+        display: inline-block !important;
+      }
+      .d-#{$media-query}-none {
+        display: none !important;
+      }
     }
   }
 }
 
 // Vertical alignment
 
-.v-align-baseline { vertical-align: baseline !important; }
+.v-align-baseline {
-.v-align-bottom { vertical-align: bottom !important; }
+  vertical-align: baseline !important;
-.v-align-middle { vertical-align: middle !important; }
+}
-.v-align-text-bottom { vertical-align: text-bottom !important; }
+.v-align-bottom {
-.v-align-text-top { vertical-align: text-top !important; }
+  vertical-align: bottom !important;
-.v-align-top { vertical-align: top !important; }
+}
+.v-align-middle {
+  vertical-align: middle !important;
+}
+.v-align-text-bottom {
+  vertical-align: text-bottom !important;
+}
+.v-align-text-top {
+  vertical-align: text-top !important;
+}
+.v-align-top {
+  vertical-align: top !important;
+}

_sass/utilities/_spacing.scss

@@ -12,11 +12,21 @@
   $scale: #{$i - 1};
 
   // .m-0, .m-1, .m-2...
-  .m-#{$scale}  { margin: #{$size} !important; }
+  .m-#{$scale} {
-  .mt-#{$scale} { margin-top: #{$size} !important; }
+    margin: #{$size} !important;
-  .mr-#{$scale} { margin-right: #{$size} !important; }
+  }
-  .mb-#{$scale} { margin-bottom: #{$size} !important; }
+  .mt-#{$scale} {
-  .ml-#{$scale} { margin-left: #{$size} !important; }
+    margin-top: #{$size} !important;
+  }
+  .mr-#{$scale} {
+    margin-right: #{$size} !important;
+  }
+  .mb-#{$scale} {
+    margin-bottom: #{$size} !important;
+  }
+  .ml-#{$scale} {
+    margin-left: #{$size} !important;
+  }
 
   .mx-#{$scale} {
     margin-right: #{$size} !important;
@@ -46,11 +56,21 @@
       $scale: #{$i - 1};
 
       // .m-sm-0, .m-md-1, .m-lg-2...
-      .m-#{$media-query}-#{$scale}  { margin: #{$size} !important; }
+      .m-#{$media-query}-#{$scale} {
-      .mt-#{$media-query}-#{$scale} { margin-top: #{$size} !important; }
+        margin: #{$size} !important;
-      .mr-#{$media-query}-#{$scale} { margin-right: #{$size} !important; }
+      }
-      .mb-#{$media-query}-#{$scale} { margin-bottom: #{$size} !important; }
+      .mt-#{$media-query}-#{$scale} {
-      .ml-#{$media-query}-#{$scale} { margin-left: #{$size} !important; }
+        margin-top: #{$size} !important;
+      }
+      .mr-#{$media-query}-#{$scale} {
+        margin-right: #{$size} !important;
+      }
+      .mb-#{$media-query}-#{$scale} {
+        margin-bottom: #{$size} !important;
+      }
+      .ml-#{$media-query}-#{$scale} {
+        margin-left: #{$size} !important;
+      }
 
       .mx-#{$media-query}-#{$scale} {
         margin-right: #{$size} !important;
@@ -77,11 +97,21 @@
   $scale: #{$i - 1};
 
   // .p-0, .p-1, .p-2...
-  .p-#{$scale}  { padding: #{$size} !important; }
+  .p-#{$scale} {
-  .pt-#{$scale} { padding-top: #{$size} !important; }
+    padding: #{$size} !important;
-  .pr-#{$scale} { padding-right: #{$size} !important; }
+  }
-  .pb-#{$scale} { padding-bottom: #{$size} !important; }
+  .pt-#{$scale} {
-  .pl-#{$scale} { padding-left: #{$size} !important; }
+    padding-top: #{$size} !important;
+  }
+  .pr-#{$scale} {
+    padding-right: #{$size} !important;
+  }
+  .pb-#{$scale} {
+    padding-bottom: #{$size} !important;
+  }
+  .pl-#{$scale} {
+    padding-left: #{$size} !important;
+  }
 
   .px-#{$scale} {
     padding-right: #{$size} !important;
@@ -101,11 +131,21 @@
       $scale: #{$i - 1};
 
       // .p-sm-0, .p-md-1, .p-lg-2...
-      .p-#{$media-query}-#{$scale}  { padding: #{$size} !important; }
+      .p-#{$media-query}-#{$scale} {
-      .pt-#{$media-query}-#{$scale} { padding-top: #{$size} !important; }
+        padding: #{$size} !important;
-      .pr-#{$media-query}-#{$scale} { padding-right: #{$size} !important; }
+      }
-      .pb-#{$media-query}-#{$scale} { padding-bottom: #{$size} !important; }
+      .pt-#{$media-query}-#{$scale} {
-      .pl-#{$media-query}-#{$scale} { padding-left: #{$size} !important; }
+        padding-top: #{$size} !important;
+      }
+      .pr-#{$media-query}-#{$scale} {
+        padding-right: #{$size} !important;
+      }
+      .pb-#{$media-query}-#{$scale} {
+        padding-bottom: #{$size} !important;
+      }
+      .pl-#{$media-query}-#{$scale} {
+        padding-left: #{$size} !important;
+      }
 
       .px-#{$media-query}-#{$scale} {
         padding-right: #{$size} !important;

assets/js/dark-mode-preview.js

@@ -1,22 +1,24 @@
 document.addEventListener("DOMContentLoaded", function () {
-
+  const toggleDarkMode = document.querySelector(".js-toggle-dark-mode")
-  const toggleDarkMode = document.querySelector('.js-toggle-dark-mode')
   const cssFile = document.querySelector('[rel="stylesheet"]')
-  const originalCssRef = cssFile.getAttribute('href')
+  const originalCssRef = cssFile.getAttribute("href")
-  const darkModeCssRef = originalCssRef.replace('just-the-docs.css', 'dark-mode-preview.css')
+  const darkModeCssRef = originalCssRef.replace(
-  const buttonCopy = ['Return to the light side', 'Preview dark color scheme']
+    "just-the-docs.css",
+    "dark-mode-preview.css"
+  )
+  const buttonCopy = ["Return to the light side", "Preview dark color scheme"]
   const updateButtonText = function (toggleDarkMode) {
-    toggleDarkMode.textContent === buttonCopy[0] ?
+    toggleDarkMode.textContent === buttonCopy[0]
-      toggleDarkMode.textContent = buttonCopy[1] :
+      ? (toggleDarkMode.textContent = buttonCopy[1])
-      toggleDarkMode.textContent = buttonCopy[0]
+      : (toggleDarkMode.textContent = buttonCopy[0])
   }
 
-  jtd.addEvent(toggleDarkMode, 'click', function(){
+  jtd.addEvent(toggleDarkMode, "click", function () {
-    if (cssFile.getAttribute('href') === originalCssRef) {
+    if (cssFile.getAttribute("href") === originalCssRef) {
-      cssFile.setAttribute('href', darkModeCssRef)
+      cssFile.setAttribute("href", darkModeCssRef)
       updateButtonText(toggleDarkMode)
     } else {
-      cssFile.setAttribute('href', originalCssRef)
+      cssFile.setAttribute("href", originalCssRef)
       updateButtonText(toggleDarkMode)
     }
   })

just-the-docs.gemspec

@@ -2,7 +2,7 @@
 
 Gem::Specification.new do |spec|
   spec.name          = "just-the-docs"
-  spec.version       = "0.2.7"
+  spec.version       = "0.2.8"
   spec.authors       = ["Patrick Marsceill"]
   spec.email         = ["patrick.marsceill@gmail.com"]
 
@@ -13,9 +13,9 @@ Gem::Specification.new do |spec|
   spec.files         = `git ls-files -z`.split("\x0").select { |f| f.match(%r{^(assets|bin|_layouts|_includes|lib|Rakefile|_sass|LICENSE|README)}i) }
   spec.executables   << 'just-the-docs'
   
-  spec.add_runtime_dependency "jekyll", "~> 3.8.5"
+  spec.add_runtime_dependency "bundler", "~> 2.1.4"
+  spec.add_runtime_dependency "jekyll", ">= 3.8.5", "< 4.1.0"
   spec.add_runtime_dependency "jekyll-seo-tag", "~> 2.0"
-  spec.add_runtime_dependency "rake", "~> 12.3.1"
+  spec.add_runtime_dependency "rake", ">= 12.3.1", "< 13.1.0"
 
-  spec.add_development_dependency "bundler", "~> 2.0.1"
 end

lib/tasks/search.rake

@@ -14,8 +14,8 @@ namespace :search do
 {
   {% assign comma = false %}
   {% for page in site.html_pages %}{% if page.search_exclude != true %}{% if comma == true%},{% endif %}"{{ forloop.index0 }}": {
-    "title": "{{ page.title | replace: '&', '&' }}",
+    "title": "{{ page.title | replace: \'&\', \'&\' }}",
-    "content": "'+content+'",
+    "content": "\'+content+\'",
     "url": "{{ page.url | absolute_url }}",
     "relUrl": "{{ page.url }}"
   }{% assign comma = true %}

package.json

@@ -1,19 +1,23 @@
 {
   "name": "just-the-docs",
-  "version": "0.2.7",
+  "version": "0.2.8",
   "description": "A modern Jekyll theme for documentation",
   "repository": "pmarsceill/just-the-docs",
   "license": "MIT",
   "bugs": "https://github.com/pmarsceill/just-the-docs/issues",
   "devDependencies": {
-    "stylelint": "^10.0.1",
+    "@primer/css": "^14.3.0",
-    "stylelint-config-primer": "^8.0.0",
+    "prettier": "^2.0.5",
+    "stylelint": "^13.3.3",
+    "stylelint-config-prettier": "^8.0.1",
+    "stylelint-config-primer": "^9.0.0",
+    "stylelint-prettier": "^1.1.2",
     "stylelint-selector-no-utility": "^4.0.0"
   },
-  "dependencies": {
-    "@primer/css": "^12.7.0"
-  },
   "scripts": {
-    "test": "stylelint '**/*.scss'"
+    "test": "stylelint '**/*.scss'",
-  }
+    "format": "prettier --write '**/*.{scss,js,json}'",
+    "stylelint-check": "stylelint-config-prettier-check"
+  },
+  "dependencies": {}
 }