From 51d3475b1150e24584c10acf6502bc4e9206e7b5 Mon Sep 17 00:00:00 2001 From: Heydon Pickering Date: Fri, 9 Jun 2017 21:27:09 +0800 Subject: [PATCH] shortcodes and dummy structure --- content/index.md | 5 + content/patterns/example1.md | 8 + content/patterns/example2.md | 8 + content/patterns/landmarks/example1.md | 8 + content/patterns/landmarks/example2.md | 8 + content/patterns/widgets/example1.md | 10 + content/patterns/widgets/example2.md | 8 + content/test.md | 34 +++- .../layouts/_default/single.html | 13 +- .../layouts/partials/footer.html | 1 + .../layouts/partials/header.html | 3 +- .../layouts/shortcodes/codeblock.html | 1 + .../layouts/shortcodes/expandable.html | 18 ++ .../layouts/shortcodes/note.html | 9 +- .../layouts/shortcodes/warning.html | 9 +- themes/inclusive-docs/static/css/prism.css | 48 +++++ themes/inclusive-docs/static/css/styles.css | 175 ++++++++++++++++-- .../static/images/icon-info.svg | 9 + .../static/images/icon-warning.svg | 7 + .../inclusive-docs/static/js/dom-scripts.js | 22 +++ themes/inclusive-docs/static/js/prism.js | 13 +- themes/inclusive-docs/theme.toml | 7 +- 22 files changed, 383 insertions(+), 41 deletions(-) create mode 100644 content/index.md create mode 100644 content/patterns/example1.md create mode 100644 content/patterns/example2.md create mode 100644 content/patterns/landmarks/example1.md create mode 100644 content/patterns/landmarks/example2.md create mode 100644 content/patterns/widgets/example1.md create mode 100644 content/patterns/widgets/example2.md create mode 100644 themes/inclusive-docs/layouts/shortcodes/codeblock.html create mode 100644 themes/inclusive-docs/layouts/shortcodes/expandable.html create mode 100644 themes/inclusive-docs/static/images/icon-info.svg create mode 100644 themes/inclusive-docs/static/images/icon-warning.svg create mode 100644 themes/inclusive-docs/static/js/dom-scripts.js diff --git a/content/index.md b/content/index.md new file mode 100644 index 0000000..f2b4623 --- /dev/null +++ b/content/index.md @@ -0,0 +1,5 @@ ++++ +title = "The Inclusive Pattern Library Builder" ++++ + +Some introductory text. diff --git a/content/patterns/example1.md b/content/patterns/example1.md new file mode 100644 index 0000000..0dd49ac --- /dev/null +++ b/content/patterns/example1.md @@ -0,0 +1,8 @@ ++++ +title = "Example Pattern 1" +wcag = ["1-1-1"] ++++ + +

Nulla auctor eleifend turpis consequat pharetra: Cras molestie risus a enim convallis vitae luctus libero lacinia. Aliquam nisl enim, tristique tempus placerat at, posuere in lectus. Nulla auctor eleifend turpis consequat pharetra. Sed mauris arcu, aliquet ultrices malesuada sed, pretium id CTRL + V massa. Fusce ac sodales magna.

+ +

Nulla auctor eleifend turpis consequat pharetra: Sed dapibus, lectus sit amet adipiscing egestas, mauris est viverra nibh (iaculis pretium sem orci aliquet mauris). Maecenas sit amet tellus nec mi gravida posuere non pretium magna. Duis sagittis, est sit amet gravida tristique, purus lectus venenatis urna, id molestie magna risus ut nunc. Aliquam tincidunt velit sit amet ante hendrerit tempus. Vestibulum text-align : justify lacus. Donec et nisi dictum felis sollicitudin congue. Aliquam nisl enim, tristique tempus placerat at, posuere in lectus.

diff --git a/content/patterns/example2.md b/content/patterns/example2.md new file mode 100644 index 0000000..9d12018 --- /dev/null +++ b/content/patterns/example2.md @@ -0,0 +1,8 @@ ++++ +title = "Example Pattern 2" +wcag = ["1-1-1"] ++++ + +

Vestibulum sit amet ipsum lacus… Nulla lobortis tempus commodo. Maecenas sit amet tellus nec mi gravida posuere non pretium magna. Sed dapibus, lectus sit amet adipiscing egestas, mauris est viverra nibh, iaculis pretium sem orci aliquet mauris.

+ +

Sed mauris arcu, aliquet ultrices malesuada sed, pretium id CTRL + V massa. Nulla lobortis tempus commodo. Nulla vel magna sit — amet dui lobortis commodo — vitae vel nulla. Lorem ipsum dolor sit amet, — consectetur adipiscing — elit. Nulla lobortis tempus commodo.

diff --git a/content/patterns/landmarks/example1.md b/content/patterns/landmarks/example1.md new file mode 100644 index 0000000..2394192 --- /dev/null +++ b/content/patterns/landmarks/example1.md @@ -0,0 +1,8 @@ ++++ +title = "Landmark Example 1" +wcag = ["1-1-1"] ++++ + +

Nulla vel magna sit amet dui lobortis commodo vitae vel nulla sit amet ante hendrerit tempus. Maecenas sit amet tellus nec mi gravida posuere non pretium magna. Donec a congue leo.

+ +

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sit amet tellus nec mi gravida posuere non pretium magna. Nulla vel magna sit amet dui lobortis commodo vitae vel nulla sit amet ante hendrerit tempus. Donec tempus tempus tellus, ac HTML lacinia turpis mattis ac. Suspendisse potenti. Nunc iaculis risus vel orci ornare dignissim sed vitae nulla. Donec a congue leo? Fusce ac sodales CSS magna.

diff --git a/content/patterns/landmarks/example2.md b/content/patterns/landmarks/example2.md new file mode 100644 index 0000000..2394192 --- /dev/null +++ b/content/patterns/landmarks/example2.md @@ -0,0 +1,8 @@ ++++ +title = "Landmark Example 1" +wcag = ["1-1-1"] ++++ + +

Nulla vel magna sit amet dui lobortis commodo vitae vel nulla sit amet ante hendrerit tempus. Maecenas sit amet tellus nec mi gravida posuere non pretium magna. Donec a congue leo.

+ +

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sit amet tellus nec mi gravida posuere non pretium magna. Nulla vel magna sit amet dui lobortis commodo vitae vel nulla sit amet ante hendrerit tempus. Donec tempus tempus tellus, ac HTML lacinia turpis mattis ac. Suspendisse potenti. Nunc iaculis risus vel orci ornare dignissim sed vitae nulla. Donec a congue leo? Fusce ac sodales CSS magna.

diff --git a/content/patterns/widgets/example1.md b/content/patterns/widgets/example1.md new file mode 100644 index 0000000..ab2c7fb --- /dev/null +++ b/content/patterns/widgets/example1.md @@ -0,0 +1,10 @@ ++++ +title = "Widget 1" +wcag = ["1-1-1"] ++++ + +

Duis sagittis, est sit amet gravida tristique, purus lectus venenatis urna, id molestie magna risus ut nunc. Maecenas sit amet tellus – nec mi gravida posuere non pretium magna. Potenti et eros sed justo commodo bibendum non at nunc. Aliquam nisl enim… tristique tempus placerat at, posuere in lectus. Nulla lobortis tempus commodo. Aliquam nisl enim, tristique tempus placerat at, posuere in lectus.

+ +

Fusce ac sodales CSS magna. Maecenas sit amet tellus nec mi gravida posuere non pretium magna. Donec et nisi dictum felis sollicitudin congue. Donec tempus tempus tellus, ac lacinia turpis mattis ac. Aliquam tincidunt velit sit amet ante hendrerit tempus.

+ +

Aliquam tincidunt velit sit (amet ante hendrerit tempus). Aliquam nisl enim, tristique tempus placerat at, posuere in lectus. Donec tempus tempus tellus, ac HTML lacinia turpis mattis ac. Aliquam tincidunt velit sit amet ante hendrerit tempus. Curabitur consectetur faucibus nisl ac varius. Donec et nisi dictum felis, sollicitudin, congue Heydon™. Nulla auctor eleifend turpis consequat pharetra. Donec et nisi dictum felis sollicitudin congue.

diff --git a/content/patterns/widgets/example2.md b/content/patterns/widgets/example2.md new file mode 100644 index 0000000..ae1f551 --- /dev/null +++ b/content/patterns/widgets/example2.md @@ -0,0 +1,8 @@ ++++ +title = "Widget 2" +wcag = ["1-1-1"] ++++ + +

Duis sagittis, est sit amet gravida tristique, purus lectus venenatis urna, id molestie magna risus ut nunc. Fusce ac sodales CSS magna. Nulla auctor eleifend turpis consequat pharetra. Sed dapibus, lectus sit amet adipiscing egestas, mauris est viverra nibh, iaculis pretium sem orci aliquet mauris. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce ac sodales .generate() magna. Aliquam tincidunt velit sit amet ante hendrerit tempus. Donec et nisi dictum felis sollicitudin congue. Nulla vel magna sit — amet dui lobortis commodo — vitae vel nulla. Nulla lobortis tempus commodo.

+ +

Donec et nisi dictum felis sollicitudin congue. Potenti et eros sed justo commodo bibendum non at nunc. Nulla lobortis tempus commodo. Duis sagittis, est sit amet gravida tristique, purus lectus venenatis urna, id molestie magna risus ut nunc. Donec tempus tempus tellus, ac lacinia turpis mattis ac! Fusce ac sodales magna …

diff --git a/content/test.md b/content/test.md index 30b1917..c98874a 100644 --- a/content/test.md +++ b/content/test.md @@ -1,12 +1,14 @@ +++ title = "Test content node" -wcag = ["1-1-1", "1-3-1"] +wcag = ["1-1-1"] +++ -Here is the content of "test content node". Below is the use of a special shortcode for providing a note: +Here is the content of "test content node", including a `code` example and a Space key mention. Below is the use of a special shortcode for providing a note: {{% note %}} I just wanted to say… yeah, **why not**! + + Here is the content of "test content node", including a `code` example and a Space key mention. Below is the use of a special shortcode for providing a note: {{% /note %}} The following is similar, but a warning: @@ -14,3 +16,31 @@ The following is similar, but a warning: {{% warning %}} I just wanted to say… **NO NO NO**! {{% /warning %}} + +## Code block + +### Markdown version + +```js +var button = document.getElementById('button') + +button.addEventListener('click', function() { + alert('well hey') +}) +``` + +### Shortcode version + +{{}} +var button = document.getElementById('button') + +button.addEventListener('click', function() { + alert('well hey') +}) +{{}} + +## Expandable sections + +{{% expandable level="2" open="true" %}} +Here it is then! +{{% /expandable %}} diff --git a/themes/inclusive-docs/layouts/_default/single.html b/themes/inclusive-docs/layouts/_default/single.html index 8968f39..749de40 100644 --- a/themes/inclusive-docs/layouts/_default/single.html +++ b/themes/inclusive-docs/layouts/_default/single.html @@ -1,14 +1,15 @@ {{ partial "header.html" . }}
+

{{ .Title }}

{{ .Content }} - - {{if .Params.wcag}} + {{ if .Params.wcag }} +

Relevant WCAG References

- {{end}} + {{ end }}
{{ partial "footer.html" . }} diff --git a/themes/inclusive-docs/layouts/partials/footer.html b/themes/inclusive-docs/layouts/partials/footer.html index 823b7dc..be79fac 100644 --- a/themes/inclusive-docs/layouts/partials/footer.html +++ b/themes/inclusive-docs/layouts/partials/footer.html @@ -1,3 +1,4 @@ + diff --git a/themes/inclusive-docs/layouts/partials/header.html b/themes/inclusive-docs/layouts/partials/header.html index 6c88a0a..2b9471a 100644 --- a/themes/inclusive-docs/layouts/partials/header.html +++ b/themes/inclusive-docs/layouts/partials/header.html @@ -8,9 +8,10 @@ {{ if .RSSLink }} {{ end }} + - {{ .Title }} + {{ .Title }} | {{ .Site.Title }} diff --git a/themes/inclusive-docs/layouts/shortcodes/codeblock.html b/themes/inclusive-docs/layouts/shortcodes/codeblock.html new file mode 100644 index 0000000..d1ac10c --- /dev/null +++ b/themes/inclusive-docs/layouts/shortcodes/codeblock.html @@ -0,0 +1 @@ +
{{ .Inner }}
diff --git a/themes/inclusive-docs/layouts/shortcodes/expandable.html b/themes/inclusive-docs/layouts/shortcodes/expandable.html new file mode 100644 index 0000000..c3b8c57 --- /dev/null +++ b/themes/inclusive-docs/layouts/shortcodes/expandable.html @@ -0,0 +1,18 @@ +{{ if .Get "level" }} + +{{ end }} + +{{ if .Get "level" }} + +{{ end }} +
+ {{ .Inner }} +
diff --git a/themes/inclusive-docs/layouts/shortcodes/note.html b/themes/inclusive-docs/layouts/shortcodes/note.html index b821237..f9d8802 100644 --- a/themes/inclusive-docs/layouts/shortcodes/note.html +++ b/themes/inclusive-docs/layouts/shortcodes/note.html @@ -1,3 +1,6 @@ -
- {{ .Inner }} -
+ diff --git a/themes/inclusive-docs/layouts/shortcodes/warning.html b/themes/inclusive-docs/layouts/shortcodes/warning.html index eb0b6bb..3ba62be 100644 --- a/themes/inclusive-docs/layouts/shortcodes/warning.html +++ b/themes/inclusive-docs/layouts/shortcodes/warning.html @@ -1,3 +1,6 @@ -
- {{ .Inner }} -
+ diff --git a/themes/inclusive-docs/static/css/prism.css b/themes/inclusive-docs/static/css/prism.css index 3483c7a..7dc9a0a 100644 --- a/themes/inclusive-docs/static/css/prism.css +++ b/themes/inclusive-docs/static/css/prism.css @@ -1,3 +1,10 @@ +/* http://prismjs.com/download.html?themes=prism&languages=markup+css+clike+javascript&plugins=line-numbers */ +/** + * prism.js default theme for JavaScript, CSS and HTML + * Based on dabblet (http://dabblet.com) + * @author Lea Verou + */ + code[class*="language-"], pre[class*="language-"] { color: black; @@ -129,3 +136,44 @@ pre[class*="language-"] { .token.entity { cursor: help; } + +pre.line-numbers { + position: relative; + padding-left: 3.8em; + counter-reset: linenumber; +} + +pre.line-numbers > code { + position: relative; +} + +.line-numbers .line-numbers-rows { + position: absolute; + pointer-events: none; + top: 0; + font-size: 100%; + left: -3.8em; + width: 3em; /* works for line-numbers below 1000 lines */ + letter-spacing: -1px; + border-right: 1px solid #999; + + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + +} + + .line-numbers-rows > span { + pointer-events: none; + display: block; + counter-increment: linenumber; + } + + .line-numbers-rows > span:before { + content: counter(linenumber); + color: #999; + display: block; + padding-right: 0.8em; + text-align: right; + } diff --git a/themes/inclusive-docs/static/css/styles.css b/themes/inclusive-docs/static/css/styles.css index e0c83d4..b35900d 100644 --- a/themes/inclusive-docs/static/css/styles.css +++ b/themes/inclusive-docs/static/css/styles.css @@ -1,9 +1,14 @@ -/**************** -Notes: -Brand color = #58068C +/* -*****************/ +Colors: +Blue color = #38608F +Dark blue color = #153B62 +Gold color = #FCB316 +Grey color = #707174 +Red color = #C83737 + +*/ *, *::before, *::after { font-family: inherit; @@ -14,13 +19,19 @@ Brand color = #58068C } html { - font-size: 100%; + font-size: calc(1em + 0.33vw); font-family: PT Sans, sans-serif; line-height: 1.5; + color: #111; +} + +body { + max-width: 30rem; + margin: 0 auto; } * + * { - margin-top: 1.5rem; + margin-top: 2.25rem; } br, @@ -57,39 +68,50 @@ div:not([tabindex]):focus { } h1, h2, h3, h4 { + font-family: Miriam Libre, serif; line-height: 1.125; } h1 { - font-size: 2.5rem; + font-size: 2.25rem; } h2 { - font-size: 1.75rem; + font-size: 1.66rem; } h3 { - font-size: 1.33rem; + font-size: 1.25rem; +} + +h4 { + font-size: 1rem; + font-family: PT Sans, sans-serif; } kbd { line-height: 1; - font-size: 0.8rem; - padding: 0.25rem 0.33rem; + font-size: 0.66rem; + padding: 0.1rem 0.25rem; border-radius: 0.25rem; - background: #ddd; - box-shadow: 0.125rem 0.125rem 0 #bbb; + border: 2px solid; + box-shadow: 0.125rem 0.125rem 0 #111; } code { font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace; -} - -p code { font-size: 0.85rem; } -/* tables */ +/* Buttons */ + +button { + font-size: inherit; + font-family: inherit; + font-weight: inherit; +} + +/* Tables */ table { text-align: left; @@ -114,3 +136,122 @@ caption { th:empty { border: 0; } + +/* Notes and warnings */ + +.note { + border-left: 0.5rem solid #FCB316; + font-size: 0.85rem; +} + +.note > div { + margin-left: 0.75rem; +} + +.note > div > img:first-child { + height: 1.5rem; +} + +.note.warning { + border-color: #C83737; +} + +.note > div > :first-child + * { + margin-top: 0; +} + +/* Code blocks */ + +pre[class*=language-] { + padding: 1rem; + background: none; + border: 0.125rem solid #eee; + margin-top: 2.25rem; +} + +pre[class*=language-][data-line] { + padding: 1em 0 1em 2.25rem; +} + +pre[class*=language-] code * { + margin-top: 0 !important; +} + +[data-codeblock-shortcode] { + display: block; + margin-top: -1rem; +} + +.token.property, +.token.tag, +.token.boolean, +.token.number, +.token.constant, +.token.symbol, +.token.deleted { + color: #38608F; +} + +.token.selector, +.token.attr-name, +.token.string, +.token.char, +.token.builtin, +.token.inserted { + color: #EBA205; +} + +.token.operator, +.token.entity, +.token.url, +.language-css .token.string, +.style .token.string { + color: #a67f59; + background: hsla(0, 0%, 100%, .5); +} + +.token.atrule, +.token.attr-value, +.token.keyword { + color: #07a; +} + +.token.function { + color: #375D84; +} + +.line-numbers code { + padding-left: 2.25rem; + margin-top: -1rem; +} + +.line-numbers { + padding-bottom: 2.25rem !important; +} + +.line-numbers .line-numbers-rows { + margin-left: 2.25rem; + top: 1.25rem; +} + +/* Expandable sections */ + +[data-expands] { + text-align: left; + border: 0; + background: none; + display: block; + width: 100%; + padding: 0; + margin: 0; +} + +[data-expands] svg { + width: 1em; + height: 1em; + vertical-align: middle; +} + +[data-expands][aria-expanded="true"] svg .up-strut { + display: none; +} diff --git a/themes/inclusive-docs/static/images/icon-info.svg b/themes/inclusive-docs/static/images/icon-info.svg new file mode 100644 index 0000000..a6b1a0f --- /dev/null +++ b/themes/inclusive-docs/static/images/icon-info.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/themes/inclusive-docs/static/images/icon-warning.svg b/themes/inclusive-docs/static/images/icon-warning.svg new file mode 100644 index 0000000..d0895b4 --- /dev/null +++ b/themes/inclusive-docs/static/images/icon-warning.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/themes/inclusive-docs/static/js/dom-scripts.js b/themes/inclusive-docs/static/js/dom-scripts.js new file mode 100644 index 0000000..0f666a6 --- /dev/null +++ b/themes/inclusive-docs/static/js/dom-scripts.js @@ -0,0 +1,22 @@ +/* expandable sections */ +(function () { + 'use strict' + + function toggle (button, target) { + var expanded = button.getAttribute('aria-expanded') === 'true' || false + button.setAttribute('aria-expanded', !expanded) + target.hidden = !target.hidden + } + + var expanders = document.querySelectorAll('[data-expands]') + + Array.prototype.forEach.call(expanders, function (expander) { + console.log(expander) + var target = document.getElementById(expander.getAttribute('data-expands')) + + expander.addEventListener('click', function () { + toggle(expander, target) + }) + }) + +}()) diff --git a/themes/inclusive-docs/static/js/prism.js b/themes/inclusive-docs/static/js/prism.js index 8d62d4e..8e2ab17 100644 --- a/themes/inclusive-docs/static/js/prism.js +++ b/themes/inclusive-docs/static/js/prism.js @@ -1,6 +1,7 @@ -/* http://prismjs.com/download.html?themes=prism&languages=markup+css+clike+javascript */ -var _self="undefined"!=typeof window?window:"undefined"!=typeof WorkerGlobalScope&&self instanceof WorkerGlobalScope?self:{},Prism=function(){var e=/\blang(?:uage)?-(\w+)\b/i,t=0,n=_self.Prism={manual:_self.Prism&&_self.Prism.manual,util:{encode:function(e){return e instanceof a?new a(e.type,n.util.encode(e.content),e.alias):"Array"===n.util.type(e)?e.map(n.util.encode):e.replace(/&/g,"&").replace(/e.length)break e;if(!(v instanceof a)){u.lastIndex=0;var b=u.exec(v),k=1;if(!b&&h&&m!=r.length-1){if(u.lastIndex=y,b=u.exec(e),!b)break;for(var w=b.index+(c?b[1].length:0),_=b.index+b[0].length,P=m,A=y,j=r.length;j>P&&_>A;++P)A+=r[P].length,w>=A&&(++m,y=A);if(r[m]instanceof a||r[P-1].greedy)continue;k=P-m,v=e.slice(y,A),b.index-=y}if(b){c&&(f=b[1].length);var w=b.index+f,b=b[0].slice(f),_=w+b.length,x=v.slice(0,w),O=v.slice(_),S=[m,k];x&&S.push(x);var N=new a(i,g?n.tokenize(b,g):b,d,b,h);S.push(N),O&&S.push(O),Array.prototype.splice.apply(r,S)}}}}}return r},hooks:{all:{},add:function(e,t){var a=n.hooks.all;a[e]=a[e]||[],a[e].push(t)},run:function(e,t){var a=n.hooks.all[e];if(a&&a.length)for(var r,l=0;r=a[l++];)r(t)}}},a=n.Token=function(e,t,n,a,r){this.type=e,this.content=t,this.alias=n,this.length=0|(a||"").length,this.greedy=!!r};if(a.stringify=function(e,t,r){if("string"==typeof e)return e;if("Array"===n.util.type(e))return e.map(function(n){return a.stringify(n,t,e)}).join("");var l={type:e.type,content:a.stringify(e.content,t,r),tag:"span",classes:["token",e.type],attributes:{},language:t,parent:r};if("comment"==l.type&&(l.attributes.spellcheck="true"),e.alias){var i="Array"===n.util.type(e.alias)?e.alias:[e.alias];Array.prototype.push.apply(l.classes,i)}n.hooks.run("wrap",l);var o=Object.keys(l.attributes).map(function(e){return e+'="'+(l.attributes[e]||"").replace(/"/g,""")+'"'}).join(" ");return"<"+l.tag+' class="'+l.classes.join(" ")+'"'+(o?" "+o:"")+">"+l.content+""},!_self.document)return _self.addEventListener?(_self.addEventListener("message",function(e){var t=JSON.parse(e.data),a=t.language,r=t.code,l=t.immediateClose;_self.postMessage(n.highlight(r,n.languages[a],a)),l&&_self.close()},!1),_self.Prism):_self.Prism;var r=document.currentScript||[].slice.call(document.getElementsByTagName("script")).pop();return r&&(n.filename=r.src,!document.addEventListener||n.manual||r.hasAttribute("data-manual")||("loading"!==document.readyState?window.requestAnimationFrame?window.requestAnimationFrame(n.highlightAll):window.setTimeout(n.highlightAll,16):document.addEventListener("DOMContentLoaded",n.highlightAll))),_self.Prism}();"undefined"!=typeof module&&module.exports&&(module.exports=Prism),"undefined"!=typeof global&&(global.Prism=Prism); -Prism.languages.markup={comment://,prolog:/<\?[\w\W]+?\?>/,doctype://i,cdata://i,tag:{pattern:/<\/?(?!\d)[^\s>\/=$<]+(?:\s+[^\s>\/=]+(?:=(?:("|')(?:\\\1|\\?(?!\1)[\w\W])*\1|[^\s'">=]+))?)*\s*\/?>/i,inside:{tag:{pattern:/^<\/?[^\s>\/]+/i,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"attr-value":{pattern:/=(?:('|")[\w\W]*?(\1)|[^\s>]+)/i,inside:{punctuation:/[=>"']/}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:/&#?[\da-z]{1,8};/i},Prism.hooks.add("wrap",function(a){"entity"===a.type&&(a.attributes.title=a.content.replace(/&/,"&"))}),Prism.languages.xml=Prism.languages.markup,Prism.languages.html=Prism.languages.markup,Prism.languages.mathml=Prism.languages.markup,Prism.languages.svg=Prism.languages.markup; -Prism.languages.css={comment:/\/\*[\w\W]*?\*\//,atrule:{pattern:/@[\w-]+?.*?(;|(?=\s*\{))/i,inside:{rule:/@[\w-]+/}},url:/url\((?:(["'])(\\(?:\r\n|[\w\W])|(?!\1)[^\\\r\n])*\1|.*?)\)/i,selector:/[^\{\}\s][^\{\};]*?(?=\s*\{)/,string:{pattern:/("|')(\\(?:\r\n|[\w\W])|(?!\1)[^\\\r\n])*\1/,greedy:!0},property:/(\b|\B)[\w-]+(?=\s*:)/i,important:/\B!important\b/i,"function":/[-a-z0-9]+(?=\()/i,punctuation:/[(){};:]/},Prism.languages.css.atrule.inside.rest=Prism.util.clone(Prism.languages.css),Prism.languages.markup&&(Prism.languages.insertBefore("markup","tag",{style:{pattern:/()[\w\W]*?(?=<\/style>)/i,lookbehind:!0,inside:Prism.languages.css,alias:"language-css"}}),Prism.languages.insertBefore("inside","attr-value",{"style-attr":{pattern:/\s*style=("|').*?\1/i,inside:{"attr-name":{pattern:/^\s*style/i,inside:Prism.languages.markup.tag.inside},punctuation:/^\s*=\s*['"]|['"]\s*$/,"attr-value":{pattern:/.+/i,inside:Prism.languages.css}},alias:"language-css"}},Prism.languages.markup.tag)); -Prism.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\w\W]*?\*\//,lookbehind:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0}],string:{pattern:/(["'])(\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/((?:\b(?:class|interface|extends|implements|trait|instanceof|new)\s+)|(?:catch\s+\())[a-z0-9_\.\\]+/i,lookbehind:!0,inside:{punctuation:/(\.|\\)/}},keyword:/\b(if|else|while|do|for|return|in|instanceof|function|new|try|throw|catch|finally|null|break|continue)\b/,"boolean":/\b(true|false)\b/,"function":/[a-z0-9_]+(?=\()/i,number:/\b-?(?:0x[\da-f]+|\d*\.?\d+(?:e[+-]?\d+)?)\b/i,operator:/--?|\+\+?|!=?=?|<=?|>=?|==?=?|&&?|\|\|?|\?|\*|\/|~|\^|%/,punctuation:/[{}[\];(),.:]/}; -Prism.languages.javascript=Prism.languages.extend("clike",{keyword:/\b(as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|var|void|while|with|yield)\b/,number:/\b-?(0x[\dA-Fa-f]+|0b[01]+|0o[0-7]+|\d*\.?\d+([Ee][+-]?\d+)?|NaN|Infinity)\b/,"function":/[_$a-zA-Z\xA0-\uFFFF][_$a-zA-Z0-9\xA0-\uFFFF]*(?=\()/i,operator:/--?|\+\+?|!=?=?|<=?|>=?|==?=?|&&?|\|\|?|\?|\*\*?|\/|~|\^|%|\.{3}/}),Prism.languages.insertBefore("javascript","keyword",{regex:{pattern:/(^|[^\/])\/(?!\/)(\[.+?]|\\.|[^\/\\\r\n])+\/[gimyu]{0,5}(?=\s*($|[\r\n,.;})]))/,lookbehind:!0,greedy:!0}}),Prism.languages.insertBefore("javascript","string",{"template-string":{pattern:/`(?:\\\\|\\?[^\\])*?`/,greedy:!0,inside:{interpolation:{pattern:/\$\{[^}]+\}/,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:Prism.languages.javascript}},string:/[\s\S]+/}}}),Prism.languages.markup&&Prism.languages.insertBefore("markup","tag",{script:{pattern:/()[\w\W]*?(?=<\/script>)/i,lookbehind:!0,inside:Prism.languages.javascript,alias:"language-javascript"}}),Prism.languages.js=Prism.languages.javascript; +/* http://prismjs.com/download.html?themes=prism&languages=markup+css+clike+javascript&plugins=line-numbers */ +var _self="undefined"!=typeof window?window:"undefined"!=typeof WorkerGlobalScope&&self instanceof WorkerGlobalScope?self:{},Prism=function(){var e=/\blang(?:uage)?-(\w+)\b/i,t=0,n=_self.Prism={manual:_self.Prism&&_self.Prism.manual,util:{encode:function(e){return e instanceof a?new a(e.type,n.util.encode(e.content),e.alias):"Array"===n.util.type(e)?e.map(n.util.encode):e.replace(/&/g,"&").replace(/e.length)return;if(!(w instanceof s)){h.lastIndex=0;var _=h.exec(w),P=1;if(!_&&m&&b!=t.length-1){if(h.lastIndex=k,_=h.exec(e),!_)break;for(var A=_.index+(d?_[1].length:0),j=_.index+_[0].length,x=b,O=k,S=t.length;S>x&&(j>O||!t[x].type&&!t[x-1].greedy);++x)O+=t[x].length,A>=O&&(++b,k=O);if(t[b]instanceof s||t[x-1].greedy)continue;P=x-b,w=e.slice(k,O),_.index-=k}if(_){d&&(p=_[1].length);var A=_.index+p,_=_[0].slice(p),j=A+_.length,N=w.slice(0,A),C=w.slice(j),E=[b,P];N&&(++b,k+=N.length,E.push(N));var L=new s(u,f?n.tokenize(_,f):_,y,_,m);if(E.push(L),C&&E.push(C),Array.prototype.splice.apply(t,E),1!=P&&n.matchGrammar(e,t,a,b,k,!0,u),l)break}else if(l)break}}}}},tokenize:function(e,t){var a=[e],r=t.rest;if(r){for(var i in r)t[i]=r[i];delete t.rest}return n.matchGrammar(e,a,t,0,0,!1),a},hooks:{all:{},add:function(e,t){var a=n.hooks.all;a[e]=a[e]||[],a[e].push(t)},run:function(e,t){var a=n.hooks.all[e];if(a&&a.length)for(var r,i=0;r=a[i++];)r(t)}}},a=n.Token=function(e,t,n,a,r){this.type=e,this.content=t,this.alias=n,this.length=0|(a||"").length,this.greedy=!!r};if(a.stringify=function(e,t,r){if("string"==typeof e)return e;if("Array"===n.util.type(e))return e.map(function(n){return a.stringify(n,t,e)}).join("");var i={type:e.type,content:a.stringify(e.content,t,r),tag:"span",classes:["token",e.type],attributes:{},language:t,parent:r};if("comment"==i.type&&(i.attributes.spellcheck="true"),e.alias){var l="Array"===n.util.type(e.alias)?e.alias:[e.alias];Array.prototype.push.apply(i.classes,l)}n.hooks.run("wrap",i);var o=Object.keys(i.attributes).map(function(e){return e+'="'+(i.attributes[e]||"").replace(/"/g,""")+'"'}).join(" ");return"<"+i.tag+' class="'+i.classes.join(" ")+'"'+(o?" "+o:"")+">"+i.content+""},!_self.document)return _self.addEventListener?(_self.addEventListener("message",function(e){var t=JSON.parse(e.data),a=t.language,r=t.code,i=t.immediateClose;_self.postMessage(n.highlight(r,n.languages[a],a)),i&&_self.close()},!1),_self.Prism):_self.Prism;var r=document.currentScript||[].slice.call(document.getElementsByTagName("script")).pop();return r&&(n.filename=r.src,!document.addEventListener||n.manual||r.hasAttribute("data-manual")||("loading"!==document.readyState?window.requestAnimationFrame?window.requestAnimationFrame(n.highlightAll):window.setTimeout(n.highlightAll,16):document.addEventListener("DOMContentLoaded",n.highlightAll))),_self.Prism}();"undefined"!=typeof module&&module.exports&&(module.exports=Prism),"undefined"!=typeof global&&(global.Prism=Prism); +Prism.languages.markup={comment://,prolog:/<\?[\s\S]+?\?>/,doctype://i,cdata://i,tag:{pattern:/<\/?(?!\d)[^\s>\/=$<]+(?:\s+[^\s>\/=]+(?:=(?:("|')(?:\\\1|\\?(?!\1)[\s\S])*\1|[^\s'">=]+))?)*\s*\/?>/i,inside:{tag:{pattern:/^<\/?[^\s>\/]+/i,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"attr-value":{pattern:/=(?:('|")[\s\S]*?(\1)|[^\s>]+)/i,inside:{punctuation:/[=>"']/}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:/&#?[\da-z]{1,8};/i},Prism.hooks.add("wrap",function(a){"entity"===a.type&&(a.attributes.title=a.content.replace(/&/,"&"))}),Prism.languages.xml=Prism.languages.markup,Prism.languages.html=Prism.languages.markup,Prism.languages.mathml=Prism.languages.markup,Prism.languages.svg=Prism.languages.markup; +Prism.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:/@[\w-]+?.*?(;|(?=\s*\{))/i,inside:{rule:/@[\w-]+/}},url:/url\((?:(["'])(\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1|.*?)\)/i,selector:/[^\{\}\s][^\{\};]*?(?=\s*\{)/,string:{pattern:/("|')(\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},property:/(\b|\B)[\w-]+(?=\s*:)/i,important:/\B!important\b/i,"function":/[-a-z0-9]+(?=\()/i,punctuation:/[(){};:]/},Prism.languages.css.atrule.inside.rest=Prism.util.clone(Prism.languages.css),Prism.languages.markup&&(Prism.languages.insertBefore("markup","tag",{style:{pattern:/()[\s\S]*?(?=<\/style>)/i,lookbehind:!0,inside:Prism.languages.css,alias:"language-css"}}),Prism.languages.insertBefore("inside","attr-value",{"style-attr":{pattern:/\s*style=("|').*?\1/i,inside:{"attr-name":{pattern:/^\s*style/i,inside:Prism.languages.markup.tag.inside},punctuation:/^\s*=\s*['"]|['"]\s*$/,"attr-value":{pattern:/.+/i,inside:Prism.languages.css}},alias:"language-css"}},Prism.languages.markup.tag)); +Prism.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?\*\//,lookbehind:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0}],string:{pattern:/(["'])(\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/((?:\b(?:class|interface|extends|implements|trait|instanceof|new)\s+)|(?:catch\s+\())[a-z0-9_\.\\]+/i,lookbehind:!0,inside:{punctuation:/(\.|\\)/}},keyword:/\b(if|else|while|do|for|return|in|instanceof|function|new|try|throw|catch|finally|null|break|continue)\b/,"boolean":/\b(true|false)\b/,"function":/[a-z0-9_]+(?=\()/i,number:/\b-?(?:0x[\da-f]+|\d*\.?\d+(?:e[+-]?\d+)?)\b/i,operator:/--?|\+\+?|!=?=?|<=?|>=?|==?=?|&&?|\|\|?|\?|\*|\/|~|\^|%/,punctuation:/[{}[\];(),.:]/}; +Prism.languages.javascript=Prism.languages.extend("clike",{keyword:/\b(as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|var|void|while|with|yield)\b/,number:/\b-?(0x[\dA-Fa-f]+|0b[01]+|0o[0-7]+|\d*\.?\d+([Ee][+-]?\d+)?|NaN|Infinity)\b/,"function":/[_$a-zA-Z\xA0-\uFFFF][_$a-zA-Z0-9\xA0-\uFFFF]*(?=\()/i,operator:/-[-=]?|\+[+=]?|!=?=?|<>?>?=?|=(?:==?|>)?|&[&=]?|\|[|=]?|\*\*?=?|\/=?|~|\^=?|%=?|\?|\.{3}/}),Prism.languages.insertBefore("javascript","keyword",{regex:{pattern:/(^|[^\/])\/(?!\/)(\[.+?]|\\.|[^\/\\\r\n])+\/[gimyu]{0,5}(?=\s*($|[\r\n,.;})]))/,lookbehind:!0,greedy:!0}}),Prism.languages.insertBefore("javascript","string",{"template-string":{pattern:/`(?:\\\\|\\?[^\\])*?`/,greedy:!0,inside:{interpolation:{pattern:/\$\{[^}]+\}/,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:Prism.languages.javascript}},string:/[\s\S]+/}}}),Prism.languages.markup&&Prism.languages.insertBefore("markup","tag",{script:{pattern:/()[\s\S]*?(?=<\/script>)/i,lookbehind:!0,inside:Prism.languages.javascript,alias:"language-javascript"}}),Prism.languages.js=Prism.languages.javascript; +!function(){"undefined"!=typeof self&&self.Prism&&self.document&&Prism.hooks.add("complete",function(e){if(e.code){var t=e.element.parentNode,s=/\s*\bline-numbers\b\s*/;if(t&&/pre/i.test(t.nodeName)&&(s.test(t.className)||s.test(e.element.className))&&!e.element.querySelector(".line-numbers-rows")){s.test(e.element.className)&&(e.element.className=e.element.className.replace(s,"")),s.test(t.className)||(t.className+=" line-numbers");var n,a=e.code.match(/\n(?!$)/g),l=a?a.length+1:1,r=new Array(l+1);r=r.join(""),n=document.createElement("span"),n.setAttribute("aria-hidden","true"),n.className="line-numbers-rows",n.innerHTML=r,t.hasAttribute("data-start")&&(t.style.counterReset="linenumber "+(parseInt(t.getAttribute("data-start"),10)-1)),e.element.appendChild(n)}}})}(); diff --git a/themes/inclusive-docs/theme.toml b/themes/inclusive-docs/theme.toml index 345ecf1..20e443e 100644 --- a/themes/inclusive-docs/theme.toml +++ b/themes/inclusive-docs/theme.toml @@ -7,9 +7,10 @@ homepage = "https://www.paciellogroup.com/" tags = ["inclusive design", "accessibility"] min_version = 0.1 -[taxonomies] - wcag = "wcag" - [author] name = "Heydon Pickering" homepage = "https://inclusive-components.design" + +[taxonomies] + wcag = "wcag" + principle = "principles"