cupper-hugo-theme/public/patterns/code/index.xml

47 lines
3.1 KiB
XML
Raw Normal View History

2017-06-28 19:20:20 +02:00
<?xml version="1.0" encoding="utf-8" standalone="yes" ?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
<channel>
<title>Exhibiting code on Infusion</title>
2017-06-28 19:22:42 +02:00
<link>https://heydon.github.io/infusion/patterns/code/</link>
2017-06-28 19:20:20 +02:00
<description>Recent content in Exhibiting code on Infusion</description>
<generator>Hugo -- gohugo.io</generator>
<language>en-us</language>
2017-06-28 19:22:42 +02:00
<atom:link href="https://heydon.github.io/infusion/patterns/code/index.xml" rel="self" type="application/rss+xml" />
2017-06-28 19:20:20 +02:00
<item>
<title>Code blocks</title>
2017-06-28 19:22:42 +02:00
<link>https://heydon.github.io/infusion/patterns/code/code-blocks/</link>
2017-06-28 19:20:20 +02:00
<pubDate>Mon, 01 Jan 0001 00:00:00 +0000</pubDate>
2017-06-28 19:22:42 +02:00
<guid>https://heydon.github.io/infusion/patterns/code/code-blocks/</guid>
2017-06-28 19:20:20 +02:00
<description>Markdown already supports code samples both inline (using single backticks like `some code here`) and in blocks. Infusion will syntax highlight HTML, CSS, and JavaScript if you provide the correct language in the formulation of the block.
So, this&amp;hellip;
```html &amp;lt;button aria-pressed=&#34;false&#34;toggle me&amp;lt;/button ``` &amp;hellip; will result in this:
&amp;lt;button aria-pressed=&amp;quot;false&amp;quot;&amp;gt;toggle me&amp;lt;/button&amp;gt; Note that the syntax highlighting uses a greyscale theme. Infusion is careful not to use color as part of its own design, because these colors may clash with those of the design being illustrated and discussed.</description>
</item>
<item>
<title>CodePen embedding</title>
2017-06-28 19:22:42 +02:00
<link>https://heydon.github.io/infusion/patterns/code/codepen-embedding/</link>
2017-06-28 19:20:20 +02:00
<pubDate>Mon, 01 Jan 0001 00:00:00 +0000</pubDate>
2017-06-28 19:22:42 +02:00
<guid>https://heydon.github.io/infusion/patterns/code/codepen-embedding/</guid>
2017-06-28 19:20:20 +02:00
<description>Sometimes just pictures of the pattern you&amp;rsquo;re documenting aren&amp;rsquo;t enough. Interactive patterns benefit from live demos, so that readers can test their functionality.
Infusion offers a couple of ways to do this. The first is by embedding CodePen demos into the content. The codePen shortcode takes just one argument: the codePen&amp;rsquo;s ID.
&amp;#x7b;{% codePen VpVNKW %}} This will embed the identified codePen into the content wherever you placed the shortcode, with the result view showing by default:</description>
</item>
<item>
<title>Writing inline demos</title>
2017-06-28 19:22:42 +02:00
<link>https://heydon.github.io/infusion/patterns/code/writing-inline-demos/</link>
2017-06-28 19:20:20 +02:00
<pubDate>Mon, 01 Jan 0001 00:00:00 +0000</pubDate>
2017-06-28 19:22:42 +02:00
<guid>https://heydon.github.io/infusion/patterns/code/writing-inline-demos/</guid>
2017-06-29 10:13:39 +02:00
<description>There are some issues with CodePen embedding , like them not working offline. They also come with CodePen branding, which will clash with the pattern you&amp;rsquo;re trying to illustrate.
2017-06-28 19:20:20 +02:00
Infusion offers another option: a special demo shortcode that allows you to write HTML, CSS, and JavaScript directly into the markdown file. The outputted demo is encapsulated using Shadow DOM, so you don&amp;rsquo;t have to worry about broken styles and global JS.</description>
</item>
</channel>
</rss>