angle bracket expandable example
This commit is contained in:
parent
23e4bfe258
commit
534f793526
|
@ -36,3 +36,9 @@ Ut vulputate enim ut lorem iaculis, vel faucibus metus iaculis. Aliquam erat vol
|
||||||
{{% /expandable %}}
|
{{% /expandable %}}
|
||||||
|
|
||||||
Unfortunately, it is not currently possible to include shortcodes inside other shortcodes, using the "`%`" notation (which is designated for markdown content). If you use the angle brackets notation (illustrated below) it is possible, but markdown will no longer be permitted. You will have to code HTML inside such a section manually.
|
Unfortunately, it is not currently possible to include shortcodes inside other shortcodes, using the "`%`" notation (which is designated for markdown content). If you use the angle brackets notation (illustrated below) it is possible, but markdown will no longer be permitted. You will have to code HTML inside such a section manually.
|
||||||
|
|
||||||
|
{{<codeBlock>}}
|
||||||
|
{{<expandable label="A section of dummy text" level="2">}}
|
||||||
|
<p>Here is a pattern reference shortcode: {{% pattern "Writing inline demos" %}}.</p>
|
||||||
|
{{</expandable>}}
|
||||||
|
{{</codeBlock>}}
|
||||||
|
|
|
@ -224,6 +224,8 @@ th:empty {
|
||||||
|
|
||||||
[role="contentinfo"] {
|
[role="contentinfo"] {
|
||||||
font-size: 0.85rem;
|
font-size: 0.85rem;
|
||||||
|
margin-top: 4rem;
|
||||||
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Patterns navigation */
|
/* Patterns navigation */
|
||||||
|
|
|
@ -240,7 +240,8 @@
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<footer role="contentinfo">
|
<footer role="contentinfo">
|
||||||
By Heydon Pickering
|
Powered by <strong>Infusion</strong>, a <strong>The Paciello Group</strong> project<br>
|
||||||
|
For general enquiries, contact us on info@paciellogroup.com
|
||||||
</footer>
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -125,7 +125,7 @@ I can reference the &#x7b;{% pattern "Notes & warnings" %}} patt
|
||||||
<guid>https://heydon.github.io/infusion/patterns/serving/</guid>
|
<guid>https://heydon.github.io/infusion/patterns/serving/</guid>
|
||||||
<description>Serving locally While you&rsquo;re creating content for your library, you&rsquo;ll probably want to see what the finished product looks like. Fortunately, Infusion is easy to serve locally using the serve command:
|
<description>Serving locally While you&rsquo;re creating content for your library, you&rsquo;ll probably want to see what the finished product looks like. Fortunately, Infusion is easy to serve locally using the serve command:
|
||||||
npm run serve This will serve your working library on localhost:1313. Whenever you make changes to your library&rsquo;s files, the site will automatically rebuild. No need to refresh the web page!
|
npm run serve This will serve your working library on localhost:1313. Whenever you make changes to your library&rsquo;s files, the site will automatically rebuild. No need to refresh the web page!
|
||||||
Publishing on Github Pages The easiest way to host your pattern library so you have a link to share is to run the host command.</description>
|
Publishing on Github Pages There are three steps to hosting your library on Github Pages.</description>
|
||||||
</item>
|
</item>
|
||||||
|
|
||||||
<item>
|
<item>
|
||||||
|
|
|
@ -230,7 +230,8 @@ toggle.addEventListener('click', (e) => {
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<footer role="contentinfo">
|
<footer role="contentinfo">
|
||||||
By Heydon Pickering
|
Powered by <strong>Infusion</strong>, a <strong>The Paciello Group</strong> project<br>
|
||||||
|
For general enquiries, contact us on info@paciellogroup.com
|
||||||
</footer>
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -254,7 +254,8 @@
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<footer role="contentinfo">
|
<footer role="contentinfo">
|
||||||
By Heydon Pickering
|
Powered by <strong>Infusion</strong>, a <strong>The Paciello Group</strong> project<br>
|
||||||
|
For general enquiries, contact us on info@paciellogroup.com
|
||||||
</footer>
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -218,7 +218,8 @@
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<footer role="contentinfo">
|
<footer role="contentinfo">
|
||||||
By Heydon Pickering
|
Powered by <strong>Infusion</strong>, a <strong>The Paciello Group</strong> project<br>
|
||||||
|
For general enquiries, contact us on info@paciellogroup.com
|
||||||
</footer>
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -329,7 +329,8 @@ toggle.addEventListener('click', (e) => {
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<footer role="contentinfo">
|
<footer role="contentinfo">
|
||||||
By Heydon Pickering
|
Powered by <strong>Infusion</strong>, a <strong>The Paciello Group</strong> project<br>
|
||||||
|
For general enquiries, contact us on info@paciellogroup.com
|
||||||
</footer>
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -218,7 +218,8 @@
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<footer role="contentinfo">
|
<footer role="contentinfo">
|
||||||
By Heydon Pickering
|
Powered by <strong>Infusion</strong>, a <strong>The Paciello Group</strong> project<br>
|
||||||
|
For general enquiries, contact us on info@paciellogroup.com
|
||||||
</footer>
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -40,7 +40,7 @@ brew install hugo Alternatively, you can manually install Hugo from a package. Y
|
||||||
<guid>https://heydon.github.io/infusion/patterns/serving/</guid>
|
<guid>https://heydon.github.io/infusion/patterns/serving/</guid>
|
||||||
<description>Serving locally While you&rsquo;re creating content for your library, you&rsquo;ll probably want to see what the finished product looks like. Fortunately, Infusion is easy to serve locally using the serve command:
|
<description>Serving locally While you&rsquo;re creating content for your library, you&rsquo;ll probably want to see what the finished product looks like. Fortunately, Infusion is easy to serve locally using the serve command:
|
||||||
npm run serve This will serve your working library on localhost:1313. Whenever you make changes to your library&rsquo;s files, the site will automatically rebuild. No need to refresh the web page!
|
npm run serve This will serve your working library on localhost:1313. Whenever you make changes to your library&rsquo;s files, the site will automatically rebuild. No need to refresh the web page!
|
||||||
Publishing on Github Pages The easiest way to host your pattern library so you have a link to share is to run the host command.</description>
|
Publishing on Github Pages There are three steps to hosting your library on Github Pages.</description>
|
||||||
</item>
|
</item>
|
||||||
|
|
||||||
</channel>
|
</channel>
|
||||||
|
|
|
@ -286,7 +286,8 @@
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<footer role="contentinfo">
|
<footer role="contentinfo">
|
||||||
By Heydon Pickering
|
Powered by <strong>Infusion</strong>, a <strong>The Paciello Group</strong> project<br>
|
||||||
|
For general enquiries, contact us on info@paciellogroup.com
|
||||||
</footer>
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -404,7 +404,8 @@ theme = "infusion"
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<footer role="contentinfo">
|
<footer role="contentinfo">
|
||||||
By Heydon Pickering
|
Powered by <strong>Infusion</strong>, a <strong>The Paciello Group</strong> project<br>
|
||||||
|
For general enquiries, contact us on info@paciellogroup.com
|
||||||
</footer>
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -192,22 +192,36 @@
|
||||||
|
|
||||||
<h2 id="publishing-on-github-pages">Publishing on Github Pages</h2>
|
<h2 id="publishing-on-github-pages">Publishing on Github Pages</h2>
|
||||||
|
|
||||||
<p>The easiest way to host your pattern library so you have a link to share is to run the <code>host</code> command. This will build the library and push it to the local Github repository’s <code>gh-pages</code> branch. Before you can use <code>host</code> you will need to commit any changes you made on the master branch. Otherwise there’s nothing new to push over to the <code>gh-pages</code> branch.</p>
|
<p>There are three steps to hosting your library on Github Pages.</p>
|
||||||
|
|
||||||
|
<h3 id="1-edit-the-baseurl">1. Edit the baseURL</h3>
|
||||||
|
|
||||||
|
<p>Open up <code>config.toml</code> (at the root of your library project folder) and make sure <code>baseURL</code> matches your Github Pages URL.</p>
|
||||||
|
|
||||||
|
<pre><code class="language-html">baseURL = "[your user name].github.io/[your library repo name]"
|
||||||
|
</code></pre>
|
||||||
|
|
||||||
|
<p>If you are having trouble working out your Github Pages URL, <a href="https://drastudio.github.io/url-generator/">this tool may help</a>.</p>
|
||||||
|
|
||||||
|
<h3 id="2-commit-your-latest-changes">2. Commit your latest changes</h3>
|
||||||
|
|
||||||
|
<p>On the (default) master branch run:</p>
|
||||||
|
|
||||||
<pre class="cmd"><code>git commit -am "my commit message"</code></pre>
|
<pre class="cmd"><code>git commit -am "my commit message"</code></pre>
|
||||||
|
|
||||||
|
|
||||||
<p>This will ensure changes go through to <code>gh-pages</code>. Now you can run:</p>
|
<h3 id="3-run-the-host-command">3. Run the <code>host</code> command</h3>
|
||||||
|
|
||||||
<pre class="cmd"><code>npm run host</code></pre>
|
<pre class="cmd"><code>npm run host</code></pre>
|
||||||
|
|
||||||
|
|
||||||
<p>You should now be able to find a “live” version of your library at <code>github.io/[your username]/[your library repo name]</code>.</p>
|
<p>You should now be able to find a “live” version of your library at <code>[your user name].github.io/[your library repo name]</code>.</p>
|
||||||
|
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<footer role="contentinfo">
|
<footer role="contentinfo">
|
||||||
By Heydon Pickering
|
Powered by <strong>Infusion</strong>, a <strong>The Paciello Group</strong> project<br>
|
||||||
|
For general enquiries, contact us on info@paciellogroup.com
|
||||||
</footer>
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -276,7 +276,8 @@ Here is some markdown including [a link](https://twitter.com/heydonworks). Donec
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<footer role="contentinfo">
|
<footer role="contentinfo">
|
||||||
By Heydon Pickering
|
Powered by <strong>Infusion</strong>, a <strong>The Paciello Group</strong> project<br>
|
||||||
|
For general enquiries, contact us on info@paciellogroup.com
|
||||||
</footer>
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -242,7 +242,8 @@
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<footer role="contentinfo">
|
<footer role="contentinfo">
|
||||||
By Heydon Pickering
|
Powered by <strong>Infusion</strong>, a <strong>The Paciello Group</strong> project<br>
|
||||||
|
For general enquiries, contact us on info@paciellogroup.com
|
||||||
</footer>
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -248,7 +248,8 @@
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<footer role="contentinfo">
|
<footer role="contentinfo">
|
||||||
By Heydon Pickering
|
Powered by <strong>Infusion</strong>, a <strong>The Paciello Group</strong> project<br>
|
||||||
|
For general enquiries, contact us on info@paciellogroup.com
|
||||||
</footer>
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -275,7 +275,8 @@ title = "Popups"
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<footer role="contentinfo">
|
<footer role="contentinfo">
|
||||||
By Heydon Pickering
|
Powered by <strong>Infusion</strong>, a <strong>The Paciello Group</strong> project<br>
|
||||||
|
For general enquiries, contact us on info@paciellogroup.com
|
||||||
</footer>
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -229,7 +229,8 @@ weight = 1
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<footer role="contentinfo">
|
<footer role="contentinfo">
|
||||||
By Heydon Pickering
|
Powered by <strong>Infusion</strong>, a <strong>The Paciello Group</strong> project<br>
|
||||||
|
For general enquiries, contact us on info@paciellogroup.com
|
||||||
</footer>
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -230,7 +230,8 @@ This is a warning! It's about something the reader should be careful to do or to
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<footer role="contentinfo">
|
<footer role="contentinfo">
|
||||||
By Heydon Pickering
|
Powered by <strong>Infusion</strong>, a <strong>The Paciello Group</strong> project<br>
|
||||||
|
For general enquiries, contact us on info@paciellogroup.com
|
||||||
</footer>
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -627,7 +627,8 @@ I can reference the {{% pattern "Notes & warnings" %}} pattern here.
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<footer role="contentinfo">
|
<footer role="contentinfo">
|
||||||
By Heydon Pickering
|
Powered by <strong>Infusion</strong>, a <strong>The Paciello Group</strong> project<br>
|
||||||
|
For general enquiries, contact us on info@paciellogroup.com
|
||||||
</footer>
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
Loading…
Reference in New Issue
Block a user