From b04f97f60be64549a37e0c71d676ab67e70891fa Mon Sep 17 00:00:00 2001 From: XhmikosR Date: Tue, 13 Nov 2018 16:10:43 +0200 Subject: [PATCH] Replace anchor.js with jekyll-anchor-headings. This allows us to generate the anchor links on build time. https://github.com/allejo/jekyll-anchor-headings --- package.json | 2 +- site/_includes/scripts.html | 1 - site/_includes/vendor/anchor_headings.html | 86 ++++++++++++++++++++ site/_layouts/docs.html | 2 +- site/docs/4.1/assets/js/src/application.js | 6 +- site/docs/4.1/assets/js/vendor/anchor.min.js | 6 -- site/docs/4.1/assets/scss/_anchor.scss | 13 ++- 7 files changed, 98 insertions(+), 18 deletions(-) create mode 100644 site/_includes/vendor/anchor_headings.html delete mode 100644 site/docs/4.1/assets/js/vendor/anchor.min.js diff --git a/package.json b/package.json index cd914b656bf7..8f20f36a0cc1 100644 --- a/package.json +++ b/package.json @@ -56,7 +56,7 @@ "js-minify-main": "npm-run-all js-minify-standalone js-minify-bundle", "js-minify-standalone": "uglifyjs --compress typeofs=false --mangle --comments \"/^!/\" --source-map \"content=dist/js/bootstrap.js.map,includeSources,url=bootstrap.min.js.map\" --output dist/js/bootstrap.min.js dist/js/bootstrap.js", "js-minify-bundle": "uglifyjs --compress typeofs=false --mangle --comments \"/^!/\" --source-map \"content=dist/js/bootstrap.bundle.js.map,includeSources,url=bootstrap.bundle.min.js.map\" --output dist/js/bootstrap.bundle.min.js dist/js/bootstrap.bundle.js", - "js-minify-docs": "cross-env-shell uglifyjs --mangle --comments \\\"/^!/\\\" --output site/docs/$npm_package_version_short/assets/js/docs.min.js site/docs/$npm_package_version_short/assets/js/vendor/anchor.min.js site/docs/$npm_package_version_short/assets/js/vendor/clipboard.min.js site/docs/$npm_package_version_short/assets/js/vendor/holder.min.js site/docs/$npm_package_version_short/assets/js/vendor/bs-custom-file-input.min.js \"site/docs/$npm_package_version_short/assets/js/src/*.js\"", + "js-minify-docs": "cross-env-shell uglifyjs --mangle --comments \\\"/^!/\\\" --output site/docs/$npm_package_version_short/assets/js/docs.min.js site/docs/$npm_package_version_short/assets/js/vendor/clipboard.min.js site/docs/$npm_package_version_short/assets/js/vendor/holder.min.js site/docs/$npm_package_version_short/assets/js/vendor/bs-custom-file-input.min.js \"site/docs/$npm_package_version_short/assets/js/src/*.js\"", "js-test": "npm-run-all js-test-karma*", "js-test-karma": "karma start js/tests/karma.conf.js", "js-test-karma-old": "cross-env USE_OLD_JQUERY=true npm run js-test-karma", diff --git a/site/_includes/scripts.html b/site/_includes/scripts.html index 3db172665e03..bd49ed091243 100644 --- a/site/_includes/scripts.html +++ b/site/_includes/scripts.html @@ -14,7 +14,6 @@ {%- if jekyll.environment == "production" -%} {%- else -%} - diff --git a/site/_includes/vendor/anchor_headings.html b/site/_includes/vendor/anchor_headings.html new file mode 100644 index 000000000000..65c0eed846cb --- /dev/null +++ b/site/_includes/vendor/anchor_headings.html @@ -0,0 +1,86 @@ +{% capture headingsWorkspace %} + {% comment %} + Version 1.0.0 + https://github.com/allejo/jekyll-anchor-headings + + "Be the pull request you wish to see in the world." ~Ben Balter + + Usage: + {% include anchor_headings.html html=content %} + + Parameters: + * html (string) - the HTML of compiled markdown generated by kramdown in Jekyll + + Optional Parameters: + * beforeHeading (bool) : false - Set to true if the anchor should be placed _before_ the heading's content + * anchorBody (string) : '' - The content that will be placed inside the anchor; the `%heading%` placeholder is available + * anchorClass (string) : '' - The class(es) that will be used for each anchor. Separate multiple classes with a space + * anchorTitle (string) : '' - The `title` attribute that will be used for anchors + * h_min (int) : 1 - The minimum header level to build an anchor for; any header lower than this value will be ignored + * h_max (int) : 6 - The maximum header level to build an anchor for; any header greater than this value will be ignored + + Output: + The original HTML with the addition of anchors inside of all of the h1-h6 headings. + {% endcomment %} + + {% assign minHeader = include.h_min | default: 1 %} + {% assign maxHeader = include.h_max | default: 6 %} + {% assign beforeHeading = include.beforeHeading %} + {% assign nodes = include.html | split: ' + {% if headerLevel < 1 or headerLevel > 6 %} + {% capture edited_headings %}{{ edited_headings }}{{ node }}{% endcapture %} + {% continue %} + {% endif %} + + {% assign _workspace = node | split: '' | first }}>{% endcapture %} + {% assign header = _workspace[0] | replace: _hAttrToStrip, '' %} + + + {% capture anchor %}{% endcapture %} + + {% if html_id and headerLevel >= minHeader and headerLevel <= maxHeader %} + {% capture anchor %}href="#{{ html_id}}"{% endcapture %} + + {% if include.anchorClass %} + {% capture anchor %}{{ anchor }} class="{{ include.anchorClass }}"{% endcapture %} + {% endif %} + + {% if include.anchorTitle %} + {% capture anchor %}{{ anchor }} title="{{ include.anchorTitle | replace: '%heading%', header }}"{% endcapture %} + {% endif %} + + {% capture anchor %}{{ include.anchorBody | replace: '%heading%', header | default: '' | raw }}{% endcapture %} + + {% if beforeHeading %} + {% capture anchor %}{{ anchor }} {% endcapture %} + {% else %} + {% capture anchor %} {{ anchor }}{% endcapture %} + {% endif %} + {% endif %} + + + {% if beforeHeading %} + {% capture _current %}{{ page.title | smartify }}

{{ page.description | smartify }}

{% include ads.html %} - {{ content }} + {% include vendor/anchor_headings.html html=content h_min=2 h_max=5 anchorBody="#" anchorTitle="Permalink" anchorClass="bd-anchor" %} diff --git a/site/docs/4.1/assets/js/src/application.js b/site/docs/4.1/assets/js/src/application.js index 40c3f1e94e56..250530848efe 100644 --- a/site/docs/4.1/assets/js/src/application.js +++ b/site/docs/4.1/assets/js/src/application.js @@ -10,7 +10,7 @@ * details, see https://creativecommons.org/licenses/by/3.0/. */ -/* global ClipboardJS: false, anchors: false, Holder: false, bsCustomFileInput: false */ +/* global ClipboardJS: false, Holder: false, bsCustomFileInput: false */ (function ($) { 'use strict' @@ -101,10 +101,6 @@ .tooltip('_fixTitle') }) - anchors.options = { - icon: '#' - } - anchors.add('.bd-content > h2, .bd-content > h3, .bd-content > h4, .bd-content > h5') $('.bd-content > h2, .bd-content > h3, .bd-content > h4, .bd-content > h5').wrapInner('
') // Holder diff --git a/site/docs/4.1/assets/js/vendor/anchor.min.js b/site/docs/4.1/assets/js/vendor/anchor.min.js deleted file mode 100644 index 29a64acae6aa..000000000000 --- a/site/docs/4.1/assets/js/vendor/anchor.min.js +++ /dev/null @@ -1,6 +0,0 @@ -/** - * AnchorJS - v4.1.1 - 2018-07-01 - * https://github.com/bryanbraun/anchorjs - * Copyright (c) 2018 Bryan Braun; Licensed MIT - */ -!function(A,e){"use strict";"function"==typeof define&&define.amd?define([],e):"object"==typeof module&&module.exports?module.exports=e():(A.AnchorJS=e(),A.anchors=new A.AnchorJS)}(this,function(){"use strict";return function(A){function d(A){A.icon=A.hasOwnProperty("icon")?A.icon:"",A.visible=A.hasOwnProperty("visible")?A.visible:"hover",A.placement=A.hasOwnProperty("placement")?A.placement:"right",A.ariaLabel=A.hasOwnProperty("ariaLabel")?A.ariaLabel:"Anchor",A.class=A.hasOwnProperty("class")?A.class:"",A.truncate=A.hasOwnProperty("truncate")?Math.floor(A.truncate):64}function f(A){var e;if("string"==typeof A||A instanceof String)e=[].slice.call(document.querySelectorAll(A));else{if(!(Array.isArray(A)||A instanceof NodeList))throw new Error("The selector provided to AnchorJS was invalid.");e=[].slice.call(A)}return e}this.options=A||{},this.elements=[],d(this.options),this.isTouchDevice=function(){return!!("ontouchstart"in window||window.DocumentTouch&&document instanceof DocumentTouch)},this.add=function(A){var e,t,i,n,o,s,r,a,c,h,l,u=[];if(d(this.options),"touch"===(l=this.options.visible)&&(l=this.isTouchDevice()?"always":"hover"),A||(A="h2, h3, h4, h5, h6"),0===(e=f(A)).length)return this;for(function(){if(null===document.head.querySelector("style.anchorjs")){var A,e=document.createElement("style");e.className="anchorjs",e.appendChild(document.createTextNode("")),void 0===(A=document.head.querySelector('[rel="stylesheet"], style'))?document.head.appendChild(e):document.head.insertBefore(e,A),e.sheet.insertRule(" .anchorjs-link { opacity: 0; text-decoration: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }",e.sheet.cssRules.length),e.sheet.insertRule(" *:hover > .anchorjs-link, .anchorjs-link:focus { opacity: 1; }",e.sheet.cssRules.length),e.sheet.insertRule(" [data-anchorjs-icon]::after { content: attr(data-anchorjs-icon); }",e.sheet.cssRules.length),e.sheet.insertRule(' @font-face { font-family: "anchorjs-icons"; src: url(data:n/a;base64,AAEAAAALAIAAAwAwT1MvMg8yG2cAAAE4AAAAYGNtYXDp3gC3AAABpAAAAExnYXNwAAAAEAAAA9wAAAAIZ2x5ZlQCcfwAAAH4AAABCGhlYWQHFvHyAAAAvAAAADZoaGVhBnACFwAAAPQAAAAkaG10eASAADEAAAGYAAAADGxvY2EACACEAAAB8AAAAAhtYXhwAAYAVwAAARgAAAAgbmFtZQGOH9cAAAMAAAAAunBvc3QAAwAAAAADvAAAACAAAQAAAAEAAHzE2p9fDzz1AAkEAAAAAADRecUWAAAAANQA6R8AAAAAAoACwAAAAAgAAgAAAAAAAAABAAADwP/AAAACgAAA/9MCrQABAAAAAAAAAAAAAAAAAAAAAwABAAAAAwBVAAIAAAAAAAIAAAAAAAAAAAAAAAAAAAAAAAMCQAGQAAUAAAKZAswAAACPApkCzAAAAesAMwEJAAAAAAAAAAAAAAAAAAAAARAAAAAAAAAAAAAAAAAAAAAAQAAg//0DwP/AAEADwABAAAAAAQAAAAAAAAAAAAAAIAAAAAAAAAIAAAACgAAxAAAAAwAAAAMAAAAcAAEAAwAAABwAAwABAAAAHAAEADAAAAAIAAgAAgAAACDpy//9//8AAAAg6cv//f///+EWNwADAAEAAAAAAAAAAAAAAAAACACEAAEAAAAAAAAAAAAAAAAxAAACAAQARAKAAsAAKwBUAAABIiYnJjQ3NzY2MzIWFxYUBwcGIicmNDc3NjQnJiYjIgYHBwYUFxYUBwYGIwciJicmNDc3NjIXFhQHBwYUFxYWMzI2Nzc2NCcmNDc2MhcWFAcHBgYjARQGDAUtLXoWOR8fORYtLTgKGwoKCjgaGg0gEhIgDXoaGgkJBQwHdR85Fi0tOAobCgoKOBoaDSASEiANehoaCQkKGwotLXoWOR8BMwUFLYEuehYXFxYugC44CQkKGwo4GkoaDQ0NDXoaShoKGwoFBe8XFi6ALjgJCQobCjgaShoNDQ0NehpKGgobCgoKLYEuehYXAAAADACWAAEAAAAAAAEACAAAAAEAAAAAAAIAAwAIAAEAAAAAAAMACAAAAAEAAAAAAAQACAAAAAEAAAAAAAUAAQALAAEAAAAAAAYACAAAAAMAAQQJAAEAEAAMAAMAAQQJAAIABgAcAAMAAQQJAAMAEAAMAAMAAQQJAAQAEAAMAAMAAQQJAAUAAgAiAAMAAQQJAAYAEAAMYW5jaG9yanM0MDBAAGEAbgBjAGgAbwByAGoAcwA0ADAAMABAAAAAAwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABAAH//wAP) format("truetype"); }',e.sheet.cssRules.length)}}(),t=document.querySelectorAll("[id]"),i=[].map.call(t,function(A){return A.id}),o=0;o\]\.\/\(\)\*\\\n\t\b\v]/g,"-").replace(/-{2,}/g,"-").substring(0,this.options.truncate).replace(/^-+|-+$/gm,"").toLowerCase()},this.hasAnchorJSLink=function(A){var e=A.firstChild&&-1<(" "+A.firstChild.className+" ").indexOf(" anchorjs-link "),t=A.lastChild&&-1<(" "+A.lastChild.className+" ").indexOf(" anchorjs-link ");return e||t||!1}}}); \ No newline at end of file diff --git a/site/docs/4.1/assets/scss/_anchor.scss b/site/docs/4.1/assets/scss/_anchor.scss index 2f00424dd2b6..7f407f7c287f 100644 --- a/site/docs/4.1/assets/scss/_anchor.scss +++ b/site/docs/4.1/assets/scss/_anchor.scss @@ -1,10 +1,15 @@ -.anchorjs-link { +.bd-anchor { + padding-left: .25rem; font-weight: 400; - color: rgba($link-color, .5); - @include transition(color .16s linear); + color: $link-color; + opacity: 0; + @include transition(opacity .16s linear); - &:hover { + :hover > &, + &:hover, + &:focus { color: $link-color; text-decoration: none; + opacity: 1; } }