skip link

This commit is contained in:
Heydon Pickering 2017-07-01 12:20:18 +01:00
parent aa6c7f075d
commit ba4ab5cc8b
20 changed files with 320 additions and 269 deletions

View File

@ -53,7 +53,7 @@ figure p img {
:focus:not([tabindex="-1"]), :focus:not([tabindex="-1"]),
[data-expands]:focus svg, [data-expands]:focus svg,
.patterns a:focus span { .patterns a:focus .text {
outline: 3px solid #ccc; outline: 3px solid #ccc;
outline-offset: 2px; outline-offset: 2px;
} }
@ -148,9 +148,13 @@ main ul ul {
/* Buttons */ /* Buttons */
button { button {
font-size: inherit; font-size: 1.25rem;
font-family: inherit; font-family: inherit;
font-weight: inherit; font-weight: inherit;
background: #111;
color: #fff;
padding: 0.75rem;
border: 0;
} }
/* Tables */ /* Tables */
@ -210,6 +214,9 @@ th:empty {
.library-desc { .library-desc {
font-style: italic; font-style: italic;
margin-top: 0.25rem; margin-top: 0.25rem;
margin-left: auto;
margin-right: auto;
max-width: 30rem;
} }
.main-and-footer { .main-and-footer {
@ -279,6 +286,19 @@ th:empty {
text-decoration-skip: ink; text-decoration-skip: ink;
} }
/* menu button */
#menu-button {
display: none;
width: 100%;
text-align: center;
}
#menu-button:focus {
outline: none;
box-shadow: inset 0 0 0 0.25rem #ccc;
}
/* Pattern lists */ /* Pattern lists */
.patterns-list { .patterns-list {
@ -629,10 +649,41 @@ a .balloon {
.patterns h3 { .patterns h3 {
font-size: 1.125rem; font-size: 1.125rem;
border-top: 4px solid;
border-bottom: 4px solid;
padding: 0.75rem 0;
}
.patterns ul ul {
margin: 0;
}
.patterns li {
margin-top: 0;
} }
.pattern { .pattern {
font-size: 1rem; font-size: 1rem;
} }
.pattern a {
padding: 0.75rem 0;
}
.pattern + .pattern {
border-top: 1px solid;
}
#menu-button {
display: block;
}
#patterns-list {
display: none;
}
[aria-expanded="true"] + #patterns-list {
display: block;
}
} }

View File

@ -63,33 +63,31 @@
<p class="library-desc">Documentation for the <strong>Infusion</strong> pattern library builder. This documentation is constructed using the builder itself.</p> <p class="library-desc">Documentation for the <strong>Infusion</strong> pattern library builder. This documentation is constructed using the builder itself.</p>
</div> </div>
<nav id="patterns-nav" class="patterns" role="navigation"> <nav id="patterns-nav" class="patterns" role="navigation">
<button id="menu-button" aria-expanded="false">Menu</button>
<ul> <ul id="patterns-list">
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/installation/" > <a href="https://heydon.github.io/infusion/patterns/installation/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Installation</span> <span class="text">Installation</span>
</a> </a>
</li> </li>
</li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/library-setup/" > <a href="https://heydon.github.io/infusion/patterns/library-setup/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Library setup</span> <span class="text">Library setup</span>
</a> </a>
</li> </li>
</li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/serving/" > <a href="https://heydon.github.io/infusion/patterns/serving/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Serving</span> <span class="text">Serving</span>
</a> </a>
</li> </li>
</li>
<li> <li>
@ -99,42 +97,42 @@
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/library-structure/" > <a href="https://heydon.github.io/infusion/patterns/writing/library-structure/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Library structure</span> <span class="text">Library structure</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/markdown-and-metadata/" > <a href="https://heydon.github.io/infusion/patterns/writing/markdown-and-metadata/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Markdown &amp; metadata</span> <span class="text">Markdown &amp; metadata</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/expandable-sections/" > <a href="https://heydon.github.io/infusion/patterns/writing/expandable-sections/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Expandable sections</span> <span class="text">Expandable sections</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/including-images/" > <a href="https://heydon.github.io/infusion/patterns/writing/including-images/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Including images</span> <span class="text">Including images</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/notes-and-warnings/" > <a href="https://heydon.github.io/infusion/patterns/writing/notes-and-warnings/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Notes &amp; warnings</span> <span class="text">Notes &amp; warnings</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/references/" > <a href="https://heydon.github.io/infusion/patterns/writing/references/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>References</span> <span class="text">References</span>
</a> </a>
</li> </li>
@ -148,21 +146,21 @@
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/code-blocks/" > <a href="https://heydon.github.io/infusion/patterns/code/code-blocks/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Code blocks</span> <span class="text">Code blocks</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/codepen-embedding/" > <a href="https://heydon.github.io/infusion/patterns/code/codepen-embedding/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>CodePen embedding</span> <span class="text">CodePen embedding</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/writing-inline-demos/" > <a href="https://heydon.github.io/infusion/patterns/code/writing-inline-demos/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Writing inline demos</span> <span class="text">Writing inline demos</span>
</a> </a>
</li> </li>

View File

@ -1,7 +1,7 @@
/* expandable sections */ /* expandable sections */
(function () { (function () {
function toggle (button, target) { function toggle (button, target) {
var expanded = button.getAttribute('aria-expanded') === 'true' || false var expanded = button.getAttribute('aria-expanded') === 'true'
button.setAttribute('aria-expanded', !expanded) button.setAttribute('aria-expanded', !expanded)
target.hidden = !target.hidden target.hidden = !target.hidden
} }
@ -15,16 +15,26 @@
toggle(expander, target) toggle(expander, target)
}) })
}) })
}());
}()) /* menu button */
(function () {
var button = document.getElementById('menu-button')
var menu = document.getElementById('patterns-list')
button.addEventListener('click', function() {
var expanded = this.getAttribute('aria-expanded') === 'true'
this.setAttribute('aria-expanded', !expanded)
})
}());
/* persist navigation scroll point */ /* persist navigation scroll point */
window.addEventListener('unload', function() { (function () {
window.addEventListener('unload', function() {
var scrollPoint = document.getElementById('patterns-nav').scrollTop var scrollPoint = document.getElementById('patterns-nav').scrollTop
localStorage.setItem('scrollPoint', scrollPoint) localStorage.setItem('scrollPoint', scrollPoint)
console.log('scrollPoint:', localStorage.getItem('scrollPoint')) })
})
window.addEventListener('load', function() { window.addEventListener('load', function() {
document.getElementById('patterns-nav').scrollTop = parseInt(localStorage.getItem('scrollPoint')) document.getElementById('patterns-nav').scrollTop = parseInt(localStorage.getItem('scrollPoint'))
}) })
}());

View File

@ -62,33 +62,31 @@
<p class="library-desc">Documentation for the <strong>Infusion</strong> pattern library builder. This documentation is constructed using the builder itself.</p> <p class="library-desc">Documentation for the <strong>Infusion</strong> pattern library builder. This documentation is constructed using the builder itself.</p>
</div> </div>
<nav id="patterns-nav" class="patterns" role="navigation"> <nav id="patterns-nav" class="patterns" role="navigation">
<button id="menu-button" aria-expanded="false">Menu</button>
<ul> <ul id="patterns-list">
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/installation/" > <a href="https://heydon.github.io/infusion/patterns/installation/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Installation</span> <span class="text">Installation</span>
</a> </a>
</li> </li>
</li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/library-setup/" > <a href="https://heydon.github.io/infusion/patterns/library-setup/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Library setup</span> <span class="text">Library setup</span>
</a> </a>
</li> </li>
</li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/serving/" > <a href="https://heydon.github.io/infusion/patterns/serving/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Serving</span> <span class="text">Serving</span>
</a> </a>
</li> </li>
</li>
<li> <li>
@ -98,42 +96,42 @@
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/library-structure/" > <a href="https://heydon.github.io/infusion/patterns/writing/library-structure/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Library structure</span> <span class="text">Library structure</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/markdown-and-metadata/" > <a href="https://heydon.github.io/infusion/patterns/writing/markdown-and-metadata/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Markdown &amp; metadata</span> <span class="text">Markdown &amp; metadata</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/expandable-sections/" > <a href="https://heydon.github.io/infusion/patterns/writing/expandable-sections/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Expandable sections</span> <span class="text">Expandable sections</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/including-images/" > <a href="https://heydon.github.io/infusion/patterns/writing/including-images/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Including images</span> <span class="text">Including images</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/notes-and-warnings/" > <a href="https://heydon.github.io/infusion/patterns/writing/notes-and-warnings/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Notes &amp; warnings</span> <span class="text">Notes &amp; warnings</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/references/" > <a href="https://heydon.github.io/infusion/patterns/writing/references/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>References</span> <span class="text">References</span>
</a> </a>
</li> </li>
@ -147,21 +145,21 @@
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/code-blocks/" aria-current="page"> <a href="https://heydon.github.io/infusion/patterns/code/code-blocks/" aria-current="page">
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Code blocks</span> <span class="text">Code blocks</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/codepen-embedding/" > <a href="https://heydon.github.io/infusion/patterns/code/codepen-embedding/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>CodePen embedding</span> <span class="text">CodePen embedding</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/writing-inline-demos/" > <a href="https://heydon.github.io/infusion/patterns/code/writing-inline-demos/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Writing inline demos</span> <span class="text">Writing inline demos</span>
</a> </a>
</li> </li>

View File

@ -62,33 +62,31 @@
<p class="library-desc">Documentation for the <strong>Infusion</strong> pattern library builder. This documentation is constructed using the builder itself.</p> <p class="library-desc">Documentation for the <strong>Infusion</strong> pattern library builder. This documentation is constructed using the builder itself.</p>
</div> </div>
<nav id="patterns-nav" class="patterns" role="navigation"> <nav id="patterns-nav" class="patterns" role="navigation">
<button id="menu-button" aria-expanded="false">Menu</button>
<ul> <ul id="patterns-list">
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/installation/" > <a href="https://heydon.github.io/infusion/patterns/installation/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Installation</span> <span class="text">Installation</span>
</a> </a>
</li> </li>
</li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/library-setup/" > <a href="https://heydon.github.io/infusion/patterns/library-setup/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Library setup</span> <span class="text">Library setup</span>
</a> </a>
</li> </li>
</li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/serving/" > <a href="https://heydon.github.io/infusion/patterns/serving/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Serving</span> <span class="text">Serving</span>
</a> </a>
</li> </li>
</li>
<li> <li>
@ -98,42 +96,42 @@
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/library-structure/" > <a href="https://heydon.github.io/infusion/patterns/writing/library-structure/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Library structure</span> <span class="text">Library structure</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/markdown-and-metadata/" > <a href="https://heydon.github.io/infusion/patterns/writing/markdown-and-metadata/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Markdown &amp; metadata</span> <span class="text">Markdown &amp; metadata</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/expandable-sections/" > <a href="https://heydon.github.io/infusion/patterns/writing/expandable-sections/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Expandable sections</span> <span class="text">Expandable sections</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/including-images/" > <a href="https://heydon.github.io/infusion/patterns/writing/including-images/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Including images</span> <span class="text">Including images</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/notes-and-warnings/" > <a href="https://heydon.github.io/infusion/patterns/writing/notes-and-warnings/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Notes &amp; warnings</span> <span class="text">Notes &amp; warnings</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/references/" > <a href="https://heydon.github.io/infusion/patterns/writing/references/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>References</span> <span class="text">References</span>
</a> </a>
</li> </li>
@ -147,21 +145,21 @@
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/code-blocks/" > <a href="https://heydon.github.io/infusion/patterns/code/code-blocks/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Code blocks</span> <span class="text">Code blocks</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/codepen-embedding/" aria-current="page"> <a href="https://heydon.github.io/infusion/patterns/code/codepen-embedding/" aria-current="page">
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>CodePen embedding</span> <span class="text">CodePen embedding</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/writing-inline-demos/" > <a href="https://heydon.github.io/infusion/patterns/code/writing-inline-demos/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Writing inline demos</span> <span class="text">Writing inline demos</span>
</a> </a>
</li> </li>

View File

@ -62,33 +62,31 @@
<p class="library-desc">Documentation for the <strong>Infusion</strong> pattern library builder. This documentation is constructed using the builder itself.</p> <p class="library-desc">Documentation for the <strong>Infusion</strong> pattern library builder. This documentation is constructed using the builder itself.</p>
</div> </div>
<nav id="patterns-nav" class="patterns" role="navigation"> <nav id="patterns-nav" class="patterns" role="navigation">
<button id="menu-button" aria-expanded="false">Menu</button>
<ul> <ul id="patterns-list">
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/installation/" > <a href="https://heydon.github.io/infusion/patterns/installation/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Installation</span> <span class="text">Installation</span>
</a> </a>
</li> </li>
</li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/library-setup/" > <a href="https://heydon.github.io/infusion/patterns/library-setup/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Library setup</span> <span class="text">Library setup</span>
</a> </a>
</li> </li>
</li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/serving/" > <a href="https://heydon.github.io/infusion/patterns/serving/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Serving</span> <span class="text">Serving</span>
</a> </a>
</li> </li>
</li>
<li> <li>
@ -98,42 +96,42 @@
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/library-structure/" > <a href="https://heydon.github.io/infusion/patterns/writing/library-structure/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Library structure</span> <span class="text">Library structure</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/markdown-and-metadata/" > <a href="https://heydon.github.io/infusion/patterns/writing/markdown-and-metadata/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Markdown &amp; metadata</span> <span class="text">Markdown &amp; metadata</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/expandable-sections/" > <a href="https://heydon.github.io/infusion/patterns/writing/expandable-sections/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Expandable sections</span> <span class="text">Expandable sections</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/including-images/" > <a href="https://heydon.github.io/infusion/patterns/writing/including-images/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Including images</span> <span class="text">Including images</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/notes-and-warnings/" > <a href="https://heydon.github.io/infusion/patterns/writing/notes-and-warnings/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Notes &amp; warnings</span> <span class="text">Notes &amp; warnings</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/references/" > <a href="https://heydon.github.io/infusion/patterns/writing/references/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>References</span> <span class="text">References</span>
</a> </a>
</li> </li>
@ -147,21 +145,21 @@
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/code-blocks/" > <a href="https://heydon.github.io/infusion/patterns/code/code-blocks/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Code blocks</span> <span class="text">Code blocks</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/codepen-embedding/" > <a href="https://heydon.github.io/infusion/patterns/code/codepen-embedding/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>CodePen embedding</span> <span class="text">CodePen embedding</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/writing-inline-demos/" > <a href="https://heydon.github.io/infusion/patterns/code/writing-inline-demos/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Writing inline demos</span> <span class="text">Writing inline demos</span>
</a> </a>
</li> </li>

View File

@ -62,33 +62,31 @@
<p class="library-desc">Documentation for the <strong>Infusion</strong> pattern library builder. This documentation is constructed using the builder itself.</p> <p class="library-desc">Documentation for the <strong>Infusion</strong> pattern library builder. This documentation is constructed using the builder itself.</p>
</div> </div>
<nav id="patterns-nav" class="patterns" role="navigation"> <nav id="patterns-nav" class="patterns" role="navigation">
<button id="menu-button" aria-expanded="false">Menu</button>
<ul> <ul id="patterns-list">
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/installation/" > <a href="https://heydon.github.io/infusion/patterns/installation/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Installation</span> <span class="text">Installation</span>
</a> </a>
</li> </li>
</li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/library-setup/" > <a href="https://heydon.github.io/infusion/patterns/library-setup/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Library setup</span> <span class="text">Library setup</span>
</a> </a>
</li> </li>
</li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/serving/" > <a href="https://heydon.github.io/infusion/patterns/serving/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Serving</span> <span class="text">Serving</span>
</a> </a>
</li> </li>
</li>
<li> <li>
@ -98,42 +96,42 @@
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/library-structure/" > <a href="https://heydon.github.io/infusion/patterns/writing/library-structure/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Library structure</span> <span class="text">Library structure</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/markdown-and-metadata/" > <a href="https://heydon.github.io/infusion/patterns/writing/markdown-and-metadata/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Markdown &amp; metadata</span> <span class="text">Markdown &amp; metadata</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/expandable-sections/" > <a href="https://heydon.github.io/infusion/patterns/writing/expandable-sections/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Expandable sections</span> <span class="text">Expandable sections</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/including-images/" > <a href="https://heydon.github.io/infusion/patterns/writing/including-images/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Including images</span> <span class="text">Including images</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/notes-and-warnings/" > <a href="https://heydon.github.io/infusion/patterns/writing/notes-and-warnings/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Notes &amp; warnings</span> <span class="text">Notes &amp; warnings</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/references/" > <a href="https://heydon.github.io/infusion/patterns/writing/references/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>References</span> <span class="text">References</span>
</a> </a>
</li> </li>
@ -147,21 +145,21 @@
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/code-blocks/" > <a href="https://heydon.github.io/infusion/patterns/code/code-blocks/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Code blocks</span> <span class="text">Code blocks</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/codepen-embedding/" > <a href="https://heydon.github.io/infusion/patterns/code/codepen-embedding/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>CodePen embedding</span> <span class="text">CodePen embedding</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/writing-inline-demos/" aria-current="page"> <a href="https://heydon.github.io/infusion/patterns/code/writing-inline-demos/" aria-current="page">
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Writing inline demos</span> <span class="text">Writing inline demos</span>
</a> </a>
</li> </li>

View File

@ -62,33 +62,31 @@
<p class="library-desc">Documentation for the <strong>Infusion</strong> pattern library builder. This documentation is constructed using the builder itself.</p> <p class="library-desc">Documentation for the <strong>Infusion</strong> pattern library builder. This documentation is constructed using the builder itself.</p>
</div> </div>
<nav id="patterns-nav" class="patterns" role="navigation"> <nav id="patterns-nav" class="patterns" role="navigation">
<button id="menu-button" aria-expanded="false">Menu</button>
<ul> <ul id="patterns-list">
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/installation/" > <a href="https://heydon.github.io/infusion/patterns/installation/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Installation</span> <span class="text">Installation</span>
</a> </a>
</li> </li>
</li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/library-setup/" > <a href="https://heydon.github.io/infusion/patterns/library-setup/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Library setup</span> <span class="text">Library setup</span>
</a> </a>
</li> </li>
</li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/serving/" > <a href="https://heydon.github.io/infusion/patterns/serving/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Serving</span> <span class="text">Serving</span>
</a> </a>
</li> </li>
</li>
<li> <li>
@ -98,42 +96,42 @@
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/library-structure/" > <a href="https://heydon.github.io/infusion/patterns/writing/library-structure/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Library structure</span> <span class="text">Library structure</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/markdown-and-metadata/" > <a href="https://heydon.github.io/infusion/patterns/writing/markdown-and-metadata/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Markdown &amp; metadata</span> <span class="text">Markdown &amp; metadata</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/expandable-sections/" > <a href="https://heydon.github.io/infusion/patterns/writing/expandable-sections/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Expandable sections</span> <span class="text">Expandable sections</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/including-images/" > <a href="https://heydon.github.io/infusion/patterns/writing/including-images/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Including images</span> <span class="text">Including images</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/notes-and-warnings/" > <a href="https://heydon.github.io/infusion/patterns/writing/notes-and-warnings/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Notes &amp; warnings</span> <span class="text">Notes &amp; warnings</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/references/" > <a href="https://heydon.github.io/infusion/patterns/writing/references/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>References</span> <span class="text">References</span>
</a> </a>
</li> </li>
@ -147,21 +145,21 @@
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/code-blocks/" > <a href="https://heydon.github.io/infusion/patterns/code/code-blocks/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Code blocks</span> <span class="text">Code blocks</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/codepen-embedding/" > <a href="https://heydon.github.io/infusion/patterns/code/codepen-embedding/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>CodePen embedding</span> <span class="text">CodePen embedding</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/writing-inline-demos/" > <a href="https://heydon.github.io/infusion/patterns/code/writing-inline-demos/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Writing inline demos</span> <span class="text">Writing inline demos</span>
</a> </a>
</li> </li>

View File

@ -62,33 +62,31 @@
<p class="library-desc">Documentation for the <strong>Infusion</strong> pattern library builder. This documentation is constructed using the builder itself.</p> <p class="library-desc">Documentation for the <strong>Infusion</strong> pattern library builder. This documentation is constructed using the builder itself.</p>
</div> </div>
<nav id="patterns-nav" class="patterns" role="navigation"> <nav id="patterns-nav" class="patterns" role="navigation">
<button id="menu-button" aria-expanded="false">Menu</button>
<ul> <ul id="patterns-list">
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/installation/" aria-current="page"> <a href="https://heydon.github.io/infusion/patterns/installation/" aria-current="page">
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Installation</span> <span class="text">Installation</span>
</a> </a>
</li> </li>
</li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/library-setup/" > <a href="https://heydon.github.io/infusion/patterns/library-setup/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Library setup</span> <span class="text">Library setup</span>
</a> </a>
</li> </li>
</li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/serving/" > <a href="https://heydon.github.io/infusion/patterns/serving/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Serving</span> <span class="text">Serving</span>
</a> </a>
</li> </li>
</li>
<li> <li>
@ -98,42 +96,42 @@
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/library-structure/" > <a href="https://heydon.github.io/infusion/patterns/writing/library-structure/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Library structure</span> <span class="text">Library structure</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/markdown-and-metadata/" > <a href="https://heydon.github.io/infusion/patterns/writing/markdown-and-metadata/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Markdown &amp; metadata</span> <span class="text">Markdown &amp; metadata</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/expandable-sections/" > <a href="https://heydon.github.io/infusion/patterns/writing/expandable-sections/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Expandable sections</span> <span class="text">Expandable sections</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/including-images/" > <a href="https://heydon.github.io/infusion/patterns/writing/including-images/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Including images</span> <span class="text">Including images</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/notes-and-warnings/" > <a href="https://heydon.github.io/infusion/patterns/writing/notes-and-warnings/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Notes &amp; warnings</span> <span class="text">Notes &amp; warnings</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/references/" > <a href="https://heydon.github.io/infusion/patterns/writing/references/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>References</span> <span class="text">References</span>
</a> </a>
</li> </li>
@ -147,21 +145,21 @@
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/code-blocks/" > <a href="https://heydon.github.io/infusion/patterns/code/code-blocks/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Code blocks</span> <span class="text">Code blocks</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/codepen-embedding/" > <a href="https://heydon.github.io/infusion/patterns/code/codepen-embedding/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>CodePen embedding</span> <span class="text">CodePen embedding</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/writing-inline-demos/" > <a href="https://heydon.github.io/infusion/patterns/code/writing-inline-demos/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Writing inline demos</span> <span class="text">Writing inline demos</span>
</a> </a>
</li> </li>
@ -211,7 +209,7 @@
<p><strong>Infusion</strong> is hosted on Github. To start using it, you&rsquo;ll need to get the files from there. If you are comfortable with the command line, just fork the <a href="https://github.com/heydon/inclusive-pattern-library">github.com/heydon/inclusive-pattern-library</a> repository, then do a <code>git clone</code> to your local system. Replace <code>[your username]</code> in the following:</p> <p><strong>Infusion</strong> is hosted on Github. To start using it, you&rsquo;ll need to get the files from there. If you are comfortable with the command line, just fork the <a href="https://github.com/heydon/inclusive-pattern-library">github.com/heydon/inclusive-pattern-library</a> repository, then do a <code>git clone</code> to your local system. Replace <code>[your username]</code> in the following:</p>
<pre class="cmd"><code>git clone https://github.com/[your username]/infusion-builder.git</code></pre> <pre class="cmd"><code>git clone https://github.com/[your username]/infusion.git</code></pre>
<p>If the command line is not your thing, fork <a href="https://github.com/heydon/inclusive-pattern-library">github.com/heydon/inclusive-pattern-library</a> and choose <strong>Open in Desktop</strong> from <strong>Clone or download</strong> (see figure 1, below).</p> <p>If the command line is not your thing, fork <a href="https://github.com/heydon/inclusive-pattern-library">github.com/heydon/inclusive-pattern-library</a> and choose <strong>Open in Desktop</strong> from <strong>Clone or download</strong> (see figure 1, below).</p>

View File

@ -62,33 +62,31 @@
<p class="library-desc">Documentation for the <strong>Infusion</strong> pattern library builder. This documentation is constructed using the builder itself.</p> <p class="library-desc">Documentation for the <strong>Infusion</strong> pattern library builder. This documentation is constructed using the builder itself.</p>
</div> </div>
<nav id="patterns-nav" class="patterns" role="navigation"> <nav id="patterns-nav" class="patterns" role="navigation">
<button id="menu-button" aria-expanded="false">Menu</button>
<ul> <ul id="patterns-list">
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/installation/" > <a href="https://heydon.github.io/infusion/patterns/installation/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Installation</span> <span class="text">Installation</span>
</a> </a>
</li> </li>
</li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/library-setup/" aria-current="page"> <a href="https://heydon.github.io/infusion/patterns/library-setup/" aria-current="page">
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Library setup</span> <span class="text">Library setup</span>
</a> </a>
</li> </li>
</li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/serving/" > <a href="https://heydon.github.io/infusion/patterns/serving/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Serving</span> <span class="text">Serving</span>
</a> </a>
</li> </li>
</li>
<li> <li>
@ -98,42 +96,42 @@
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/library-structure/" > <a href="https://heydon.github.io/infusion/patterns/writing/library-structure/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Library structure</span> <span class="text">Library structure</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/markdown-and-metadata/" > <a href="https://heydon.github.io/infusion/patterns/writing/markdown-and-metadata/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Markdown &amp; metadata</span> <span class="text">Markdown &amp; metadata</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/expandable-sections/" > <a href="https://heydon.github.io/infusion/patterns/writing/expandable-sections/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Expandable sections</span> <span class="text">Expandable sections</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/including-images/" > <a href="https://heydon.github.io/infusion/patterns/writing/including-images/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Including images</span> <span class="text">Including images</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/notes-and-warnings/" > <a href="https://heydon.github.io/infusion/patterns/writing/notes-and-warnings/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Notes &amp; warnings</span> <span class="text">Notes &amp; warnings</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/references/" > <a href="https://heydon.github.io/infusion/patterns/writing/references/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>References</span> <span class="text">References</span>
</a> </a>
</li> </li>
@ -147,21 +145,21 @@
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/code-blocks/" > <a href="https://heydon.github.io/infusion/patterns/code/code-blocks/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Code blocks</span> <span class="text">Code blocks</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/codepen-embedding/" > <a href="https://heydon.github.io/infusion/patterns/code/codepen-embedding/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>CodePen embedding</span> <span class="text">CodePen embedding</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/writing-inline-demos/" > <a href="https://heydon.github.io/infusion/patterns/code/writing-inline-demos/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Writing inline demos</span> <span class="text">Writing inline demos</span>
</a> </a>
</li> </li>

View File

@ -62,33 +62,31 @@
<p class="library-desc">Documentation for the <strong>Infusion</strong> pattern library builder. This documentation is constructed using the builder itself.</p> <p class="library-desc">Documentation for the <strong>Infusion</strong> pattern library builder. This documentation is constructed using the builder itself.</p>
</div> </div>
<nav id="patterns-nav" class="patterns" role="navigation"> <nav id="patterns-nav" class="patterns" role="navigation">
<button id="menu-button" aria-expanded="false">Menu</button>
<ul> <ul id="patterns-list">
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/installation/" > <a href="https://heydon.github.io/infusion/patterns/installation/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Installation</span> <span class="text">Installation</span>
</a> </a>
</li> </li>
</li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/library-setup/" > <a href="https://heydon.github.io/infusion/patterns/library-setup/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Library setup</span> <span class="text">Library setup</span>
</a> </a>
</li> </li>
</li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/serving/" aria-current="page"> <a href="https://heydon.github.io/infusion/patterns/serving/" aria-current="page">
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Serving</span> <span class="text">Serving</span>
</a> </a>
</li> </li>
</li>
<li> <li>
@ -98,42 +96,42 @@
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/library-structure/" > <a href="https://heydon.github.io/infusion/patterns/writing/library-structure/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Library structure</span> <span class="text">Library structure</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/markdown-and-metadata/" > <a href="https://heydon.github.io/infusion/patterns/writing/markdown-and-metadata/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Markdown &amp; metadata</span> <span class="text">Markdown &amp; metadata</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/expandable-sections/" > <a href="https://heydon.github.io/infusion/patterns/writing/expandable-sections/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Expandable sections</span> <span class="text">Expandable sections</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/including-images/" > <a href="https://heydon.github.io/infusion/patterns/writing/including-images/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Including images</span> <span class="text">Including images</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/notes-and-warnings/" > <a href="https://heydon.github.io/infusion/patterns/writing/notes-and-warnings/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Notes &amp; warnings</span> <span class="text">Notes &amp; warnings</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/references/" > <a href="https://heydon.github.io/infusion/patterns/writing/references/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>References</span> <span class="text">References</span>
</a> </a>
</li> </li>
@ -147,21 +145,21 @@
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/code-blocks/" > <a href="https://heydon.github.io/infusion/patterns/code/code-blocks/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Code blocks</span> <span class="text">Code blocks</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/codepen-embedding/" > <a href="https://heydon.github.io/infusion/patterns/code/codepen-embedding/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>CodePen embedding</span> <span class="text">CodePen embedding</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/writing-inline-demos/" > <a href="https://heydon.github.io/infusion/patterns/code/writing-inline-demos/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Writing inline demos</span> <span class="text">Writing inline demos</span>
</a> </a>
</li> </li>

View File

@ -62,33 +62,31 @@
<p class="library-desc">Documentation for the <strong>Infusion</strong> pattern library builder. This documentation is constructed using the builder itself.</p> <p class="library-desc">Documentation for the <strong>Infusion</strong> pattern library builder. This documentation is constructed using the builder itself.</p>
</div> </div>
<nav id="patterns-nav" class="patterns" role="navigation"> <nav id="patterns-nav" class="patterns" role="navigation">
<button id="menu-button" aria-expanded="false">Menu</button>
<ul> <ul id="patterns-list">
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/installation/" > <a href="https://heydon.github.io/infusion/patterns/installation/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Installation</span> <span class="text">Installation</span>
</a> </a>
</li> </li>
</li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/library-setup/" > <a href="https://heydon.github.io/infusion/patterns/library-setup/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Library setup</span> <span class="text">Library setup</span>
</a> </a>
</li> </li>
</li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/serving/" > <a href="https://heydon.github.io/infusion/patterns/serving/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Serving</span> <span class="text">Serving</span>
</a> </a>
</li> </li>
</li>
<li> <li>
@ -98,42 +96,42 @@
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/library-structure/" > <a href="https://heydon.github.io/infusion/patterns/writing/library-structure/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Library structure</span> <span class="text">Library structure</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/markdown-and-metadata/" > <a href="https://heydon.github.io/infusion/patterns/writing/markdown-and-metadata/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Markdown &amp; metadata</span> <span class="text">Markdown &amp; metadata</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/expandable-sections/" aria-current="page"> <a href="https://heydon.github.io/infusion/patterns/writing/expandable-sections/" aria-current="page">
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Expandable sections</span> <span class="text">Expandable sections</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/including-images/" > <a href="https://heydon.github.io/infusion/patterns/writing/including-images/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Including images</span> <span class="text">Including images</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/notes-and-warnings/" > <a href="https://heydon.github.io/infusion/patterns/writing/notes-and-warnings/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Notes &amp; warnings</span> <span class="text">Notes &amp; warnings</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/references/" > <a href="https://heydon.github.io/infusion/patterns/writing/references/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>References</span> <span class="text">References</span>
</a> </a>
</li> </li>
@ -147,21 +145,21 @@
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/code-blocks/" > <a href="https://heydon.github.io/infusion/patterns/code/code-blocks/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Code blocks</span> <span class="text">Code blocks</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/codepen-embedding/" > <a href="https://heydon.github.io/infusion/patterns/code/codepen-embedding/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>CodePen embedding</span> <span class="text">CodePen embedding</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/writing-inline-demos/" > <a href="https://heydon.github.io/infusion/patterns/code/writing-inline-demos/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Writing inline demos</span> <span class="text">Writing inline demos</span>
</a> </a>
</li> </li>

View File

@ -62,33 +62,31 @@
<p class="library-desc">Documentation for the <strong>Infusion</strong> pattern library builder. This documentation is constructed using the builder itself.</p> <p class="library-desc">Documentation for the <strong>Infusion</strong> pattern library builder. This documentation is constructed using the builder itself.</p>
</div> </div>
<nav id="patterns-nav" class="patterns" role="navigation"> <nav id="patterns-nav" class="patterns" role="navigation">
<button id="menu-button" aria-expanded="false">Menu</button>
<ul> <ul id="patterns-list">
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/installation/" > <a href="https://heydon.github.io/infusion/patterns/installation/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Installation</span> <span class="text">Installation</span>
</a> </a>
</li> </li>
</li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/library-setup/" > <a href="https://heydon.github.io/infusion/patterns/library-setup/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Library setup</span> <span class="text">Library setup</span>
</a> </a>
</li> </li>
</li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/serving/" > <a href="https://heydon.github.io/infusion/patterns/serving/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Serving</span> <span class="text">Serving</span>
</a> </a>
</li> </li>
</li>
<li> <li>
@ -98,42 +96,42 @@
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/library-structure/" > <a href="https://heydon.github.io/infusion/patterns/writing/library-structure/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Library structure</span> <span class="text">Library structure</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/markdown-and-metadata/" > <a href="https://heydon.github.io/infusion/patterns/writing/markdown-and-metadata/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Markdown &amp; metadata</span> <span class="text">Markdown &amp; metadata</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/expandable-sections/" > <a href="https://heydon.github.io/infusion/patterns/writing/expandable-sections/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Expandable sections</span> <span class="text">Expandable sections</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/including-images/" aria-current="page"> <a href="https://heydon.github.io/infusion/patterns/writing/including-images/" aria-current="page">
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Including images</span> <span class="text">Including images</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/notes-and-warnings/" > <a href="https://heydon.github.io/infusion/patterns/writing/notes-and-warnings/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Notes &amp; warnings</span> <span class="text">Notes &amp; warnings</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/references/" > <a href="https://heydon.github.io/infusion/patterns/writing/references/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>References</span> <span class="text">References</span>
</a> </a>
</li> </li>
@ -147,21 +145,21 @@
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/code-blocks/" > <a href="https://heydon.github.io/infusion/patterns/code/code-blocks/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Code blocks</span> <span class="text">Code blocks</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/codepen-embedding/" > <a href="https://heydon.github.io/infusion/patterns/code/codepen-embedding/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>CodePen embedding</span> <span class="text">CodePen embedding</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/writing-inline-demos/" > <a href="https://heydon.github.io/infusion/patterns/code/writing-inline-demos/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Writing inline demos</span> <span class="text">Writing inline demos</span>
</a> </a>
</li> </li>

View File

@ -62,33 +62,31 @@
<p class="library-desc">Documentation for the <strong>Infusion</strong> pattern library builder. This documentation is constructed using the builder itself.</p> <p class="library-desc">Documentation for the <strong>Infusion</strong> pattern library builder. This documentation is constructed using the builder itself.</p>
</div> </div>
<nav id="patterns-nav" class="patterns" role="navigation"> <nav id="patterns-nav" class="patterns" role="navigation">
<button id="menu-button" aria-expanded="false">Menu</button>
<ul> <ul id="patterns-list">
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/installation/" > <a href="https://heydon.github.io/infusion/patterns/installation/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Installation</span> <span class="text">Installation</span>
</a> </a>
</li> </li>
</li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/library-setup/" > <a href="https://heydon.github.io/infusion/patterns/library-setup/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Library setup</span> <span class="text">Library setup</span>
</a> </a>
</li> </li>
</li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/serving/" > <a href="https://heydon.github.io/infusion/patterns/serving/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Serving</span> <span class="text">Serving</span>
</a> </a>
</li> </li>
</li>
<li> <li>
@ -98,42 +96,42 @@
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/library-structure/" > <a href="https://heydon.github.io/infusion/patterns/writing/library-structure/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Library structure</span> <span class="text">Library structure</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/markdown-and-metadata/" > <a href="https://heydon.github.io/infusion/patterns/writing/markdown-and-metadata/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Markdown &amp; metadata</span> <span class="text">Markdown &amp; metadata</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/expandable-sections/" > <a href="https://heydon.github.io/infusion/patterns/writing/expandable-sections/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Expandable sections</span> <span class="text">Expandable sections</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/including-images/" > <a href="https://heydon.github.io/infusion/patterns/writing/including-images/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Including images</span> <span class="text">Including images</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/notes-and-warnings/" > <a href="https://heydon.github.io/infusion/patterns/writing/notes-and-warnings/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Notes &amp; warnings</span> <span class="text">Notes &amp; warnings</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/references/" > <a href="https://heydon.github.io/infusion/patterns/writing/references/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>References</span> <span class="text">References</span>
</a> </a>
</li> </li>
@ -147,21 +145,21 @@
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/code-blocks/" > <a href="https://heydon.github.io/infusion/patterns/code/code-blocks/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Code blocks</span> <span class="text">Code blocks</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/codepen-embedding/" > <a href="https://heydon.github.io/infusion/patterns/code/codepen-embedding/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>CodePen embedding</span> <span class="text">CodePen embedding</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/writing-inline-demos/" > <a href="https://heydon.github.io/infusion/patterns/code/writing-inline-demos/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Writing inline demos</span> <span class="text">Writing inline demos</span>
</a> </a>
</li> </li>

View File

@ -62,33 +62,31 @@
<p class="library-desc">Documentation for the <strong>Infusion</strong> pattern library builder. This documentation is constructed using the builder itself.</p> <p class="library-desc">Documentation for the <strong>Infusion</strong> pattern library builder. This documentation is constructed using the builder itself.</p>
</div> </div>
<nav id="patterns-nav" class="patterns" role="navigation"> <nav id="patterns-nav" class="patterns" role="navigation">
<button id="menu-button" aria-expanded="false">Menu</button>
<ul> <ul id="patterns-list">
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/installation/" > <a href="https://heydon.github.io/infusion/patterns/installation/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Installation</span> <span class="text">Installation</span>
</a> </a>
</li> </li>
</li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/library-setup/" > <a href="https://heydon.github.io/infusion/patterns/library-setup/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Library setup</span> <span class="text">Library setup</span>
</a> </a>
</li> </li>
</li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/serving/" > <a href="https://heydon.github.io/infusion/patterns/serving/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Serving</span> <span class="text">Serving</span>
</a> </a>
</li> </li>
</li>
<li> <li>
@ -98,42 +96,42 @@
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/library-structure/" aria-current="page"> <a href="https://heydon.github.io/infusion/patterns/writing/library-structure/" aria-current="page">
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Library structure</span> <span class="text">Library structure</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/markdown-and-metadata/" > <a href="https://heydon.github.io/infusion/patterns/writing/markdown-and-metadata/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Markdown &amp; metadata</span> <span class="text">Markdown &amp; metadata</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/expandable-sections/" > <a href="https://heydon.github.io/infusion/patterns/writing/expandable-sections/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Expandable sections</span> <span class="text">Expandable sections</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/including-images/" > <a href="https://heydon.github.io/infusion/patterns/writing/including-images/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Including images</span> <span class="text">Including images</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/notes-and-warnings/" > <a href="https://heydon.github.io/infusion/patterns/writing/notes-and-warnings/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Notes &amp; warnings</span> <span class="text">Notes &amp; warnings</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/references/" > <a href="https://heydon.github.io/infusion/patterns/writing/references/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>References</span> <span class="text">References</span>
</a> </a>
</li> </li>
@ -147,21 +145,21 @@
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/code-blocks/" > <a href="https://heydon.github.io/infusion/patterns/code/code-blocks/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Code blocks</span> <span class="text">Code blocks</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/codepen-embedding/" > <a href="https://heydon.github.io/infusion/patterns/code/codepen-embedding/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>CodePen embedding</span> <span class="text">CodePen embedding</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/writing-inline-demos/" > <a href="https://heydon.github.io/infusion/patterns/code/writing-inline-demos/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Writing inline demos</span> <span class="text">Writing inline demos</span>
</a> </a>
</li> </li>

View File

@ -62,33 +62,31 @@
<p class="library-desc">Documentation for the <strong>Infusion</strong> pattern library builder. This documentation is constructed using the builder itself.</p> <p class="library-desc">Documentation for the <strong>Infusion</strong> pattern library builder. This documentation is constructed using the builder itself.</p>
</div> </div>
<nav id="patterns-nav" class="patterns" role="navigation"> <nav id="patterns-nav" class="patterns" role="navigation">
<button id="menu-button" aria-expanded="false">Menu</button>
<ul> <ul id="patterns-list">
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/installation/" > <a href="https://heydon.github.io/infusion/patterns/installation/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Installation</span> <span class="text">Installation</span>
</a> </a>
</li> </li>
</li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/library-setup/" > <a href="https://heydon.github.io/infusion/patterns/library-setup/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Library setup</span> <span class="text">Library setup</span>
</a> </a>
</li> </li>
</li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/serving/" > <a href="https://heydon.github.io/infusion/patterns/serving/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Serving</span> <span class="text">Serving</span>
</a> </a>
</li> </li>
</li>
<li> <li>
@ -98,42 +96,42 @@
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/library-structure/" > <a href="https://heydon.github.io/infusion/patterns/writing/library-structure/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Library structure</span> <span class="text">Library structure</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/markdown-and-metadata/" aria-current="page"> <a href="https://heydon.github.io/infusion/patterns/writing/markdown-and-metadata/" aria-current="page">
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Markdown &amp; metadata</span> <span class="text">Markdown &amp; metadata</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/expandable-sections/" > <a href="https://heydon.github.io/infusion/patterns/writing/expandable-sections/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Expandable sections</span> <span class="text">Expandable sections</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/including-images/" > <a href="https://heydon.github.io/infusion/patterns/writing/including-images/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Including images</span> <span class="text">Including images</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/notes-and-warnings/" > <a href="https://heydon.github.io/infusion/patterns/writing/notes-and-warnings/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Notes &amp; warnings</span> <span class="text">Notes &amp; warnings</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/references/" > <a href="https://heydon.github.io/infusion/patterns/writing/references/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>References</span> <span class="text">References</span>
</a> </a>
</li> </li>
@ -147,21 +145,21 @@
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/code-blocks/" > <a href="https://heydon.github.io/infusion/patterns/code/code-blocks/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Code blocks</span> <span class="text">Code blocks</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/codepen-embedding/" > <a href="https://heydon.github.io/infusion/patterns/code/codepen-embedding/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>CodePen embedding</span> <span class="text">CodePen embedding</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/writing-inline-demos/" > <a href="https://heydon.github.io/infusion/patterns/code/writing-inline-demos/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Writing inline demos</span> <span class="text">Writing inline demos</span>
</a> </a>
</li> </li>

View File

@ -62,33 +62,31 @@
<p class="library-desc">Documentation for the <strong>Infusion</strong> pattern library builder. This documentation is constructed using the builder itself.</p> <p class="library-desc">Documentation for the <strong>Infusion</strong> pattern library builder. This documentation is constructed using the builder itself.</p>
</div> </div>
<nav id="patterns-nav" class="patterns" role="navigation"> <nav id="patterns-nav" class="patterns" role="navigation">
<button id="menu-button" aria-expanded="false">Menu</button>
<ul> <ul id="patterns-list">
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/installation/" > <a href="https://heydon.github.io/infusion/patterns/installation/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Installation</span> <span class="text">Installation</span>
</a> </a>
</li> </li>
</li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/library-setup/" > <a href="https://heydon.github.io/infusion/patterns/library-setup/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Library setup</span> <span class="text">Library setup</span>
</a> </a>
</li> </li>
</li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/serving/" > <a href="https://heydon.github.io/infusion/patterns/serving/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Serving</span> <span class="text">Serving</span>
</a> </a>
</li> </li>
</li>
<li> <li>
@ -98,42 +96,42 @@
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/library-structure/" > <a href="https://heydon.github.io/infusion/patterns/writing/library-structure/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Library structure</span> <span class="text">Library structure</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/markdown-and-metadata/" > <a href="https://heydon.github.io/infusion/patterns/writing/markdown-and-metadata/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Markdown &amp; metadata</span> <span class="text">Markdown &amp; metadata</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/expandable-sections/" > <a href="https://heydon.github.io/infusion/patterns/writing/expandable-sections/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Expandable sections</span> <span class="text">Expandable sections</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/including-images/" > <a href="https://heydon.github.io/infusion/patterns/writing/including-images/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Including images</span> <span class="text">Including images</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/notes-and-warnings/" aria-current="page"> <a href="https://heydon.github.io/infusion/patterns/writing/notes-and-warnings/" aria-current="page">
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Notes &amp; warnings</span> <span class="text">Notes &amp; warnings</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/references/" > <a href="https://heydon.github.io/infusion/patterns/writing/references/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>References</span> <span class="text">References</span>
</a> </a>
</li> </li>
@ -147,21 +145,21 @@
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/code-blocks/" > <a href="https://heydon.github.io/infusion/patterns/code/code-blocks/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Code blocks</span> <span class="text">Code blocks</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/codepen-embedding/" > <a href="https://heydon.github.io/infusion/patterns/code/codepen-embedding/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>CodePen embedding</span> <span class="text">CodePen embedding</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/writing-inline-demos/" > <a href="https://heydon.github.io/infusion/patterns/code/writing-inline-demos/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Writing inline demos</span> <span class="text">Writing inline demos</span>
</a> </a>
</li> </li>

View File

@ -62,33 +62,31 @@
<p class="library-desc">Documentation for the <strong>Infusion</strong> pattern library builder. This documentation is constructed using the builder itself.</p> <p class="library-desc">Documentation for the <strong>Infusion</strong> pattern library builder. This documentation is constructed using the builder itself.</p>
</div> </div>
<nav id="patterns-nav" class="patterns" role="navigation"> <nav id="patterns-nav" class="patterns" role="navigation">
<button id="menu-button" aria-expanded="false">Menu</button>
<ul> <ul id="patterns-list">
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/installation/" > <a href="https://heydon.github.io/infusion/patterns/installation/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Installation</span> <span class="text">Installation</span>
</a> </a>
</li> </li>
</li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/library-setup/" > <a href="https://heydon.github.io/infusion/patterns/library-setup/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Library setup</span> <span class="text">Library setup</span>
</a> </a>
</li> </li>
</li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/serving/" > <a href="https://heydon.github.io/infusion/patterns/serving/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Serving</span> <span class="text">Serving</span>
</a> </a>
</li> </li>
</li>
<li> <li>
@ -98,42 +96,42 @@
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/library-structure/" > <a href="https://heydon.github.io/infusion/patterns/writing/library-structure/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Library structure</span> <span class="text">Library structure</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/markdown-and-metadata/" > <a href="https://heydon.github.io/infusion/patterns/writing/markdown-and-metadata/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Markdown &amp; metadata</span> <span class="text">Markdown &amp; metadata</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/expandable-sections/" > <a href="https://heydon.github.io/infusion/patterns/writing/expandable-sections/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Expandable sections</span> <span class="text">Expandable sections</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/including-images/" > <a href="https://heydon.github.io/infusion/patterns/writing/including-images/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Including images</span> <span class="text">Including images</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/notes-and-warnings/" > <a href="https://heydon.github.io/infusion/patterns/writing/notes-and-warnings/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Notes &amp; warnings</span> <span class="text">Notes &amp; warnings</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/writing/references/" aria-current="page"> <a href="https://heydon.github.io/infusion/patterns/writing/references/" aria-current="page">
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>References</span> <span class="text">References</span>
</a> </a>
</li> </li>
@ -147,21 +145,21 @@
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/code-blocks/" > <a href="https://heydon.github.io/infusion/patterns/code/code-blocks/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Code blocks</span> <span class="text">Code blocks</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/codepen-embedding/" > <a href="https://heydon.github.io/infusion/patterns/code/codepen-embedding/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>CodePen embedding</span> <span class="text">CodePen embedding</span>
</a> </a>
</li> </li>
<li class="pattern"> <li class="pattern">
<a href="https://heydon.github.io/infusion/patterns/code/writing-inline-demos/" > <a href="https://heydon.github.io/infusion/patterns/code/writing-inline-demos/" >
<svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg> <svg class="bookmark" aria-hidden="true" height="50" width="40" viewBox="0 0 40 50"><use xlink:href="#bookmark"></use></svg>
<span>Writing inline demos</span> <span class="text">Writing inline demos</span>
</a> </a>
</li> </li>

View File

@ -16,6 +16,7 @@
</title> </title>
</head> </head>
<body> <body>
<a href="#main">skip to content</a>
{{ partial "svg.html" . }} {{ partial "svg.html" . }}
<div class="wrapper"> <div class="wrapper">
<header class="intro-and-nav" role="banner"> <header class="intro-and-nav" role="banner">

View File

@ -63,6 +63,27 @@ div:not([tabindex]):focus {
outline: none; outline: none;
} }
/* skip link */
[href="#main"] {
display: block;
width: 100%;
padding: 0.75rem;
color: #fff;
background: #000;
position: absolute;
top: -3rem;
text-align: center;
z-index: 1;
}
[href="#main"]:focus {
top: 0;
outline: none;
}
/* text styles */
h1, h2, h3, h4 { h1, h2, h3, h4 {
font-family: Miriam Libre, serif; font-family: Miriam Libre, serif;
line-height: 1.125; line-height: 1.125;