hugo-theme-more-contentful/articles/asciidoctor-article-template/index.html

615 lines
19 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="en-us">
<head><title>Asciidoctor Article Template | More Contentful</title>
<link rel="stylesheet" href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/css/main.min.53a06f6951ce4ff305c20e7c07c32335e9494f58b5035ef6869e0f557248247c.css" />
<link rel="shortcut icon" href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/favicon.png" /><meta name="generator" content="Hugo 0.96.0" />
<meta charset="utf-8">
<meta name="author" content="John Doe" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="referrer" content="no-referrer" />
<meta name="description" content="Content entered directly below the header but before the first section heading is called the preamble.
First level heading This is a paragraph with a bold word and an italicized word.
Figure 1. Image caption This is another paragraph.[1]
Second level heading Unordered list title list item 1
nested list item
nested nested list item 1" /><meta name="twitter:card" content="summary"/>
<meta name="twitter:title" content="Asciidoctor Article Template"/>
<meta name="twitter:description" content="Content entered directly below the header but before the first section heading is called the preamble.
First level heading This is a paragraph with a bold word and an italicized word.
Figure 1. Image caption This is another paragraph.[1]
Second level heading Unordered list title list item 1
nested list item
nested nested list item 1"/>
<meta property="og:title" content="Asciidoctor Article Template" />
<meta property="og:description" content="Content entered directly below the header but before the first section heading is called the preamble.
First level heading This is a paragraph with a bold word and an italicized word.
Figure 1. Image caption This is another paragraph.[1]
Second level heading Unordered list title list item 1
nested list item
nested nested list item 1" />
<meta property="og:type" content="article" />
<meta property="og:url" content="https://foo-dogsquared.github.io/hugo-theme-more-contentful/articles/asciidoctor-article-template/" /><meta property="article:section" content="articles" />
<meta property="article:published_time" content="2019-08-25T21:06:56+08:00" />
<meta property="article:modified_time" content="2023-02-24T20:23:27+08:00" />
<meta itemprop="name" content="Asciidoctor Article Template">
<meta itemprop="description" content="Content entered directly below the header but before the first section heading is called the preamble.
First level heading This is a paragraph with a bold word and an italicized word.
Figure 1. Image caption This is another paragraph.[1]
Second level heading Unordered list title list item 1
nested list item
nested nested list item 1"><meta itemprop="datePublished" content="2019-08-25T21:06:56+08:00" />
<meta itemprop="dateModified" content="2023-02-24T20:23:27+08:00" />
<meta itemprop="wordCount" content="381">
<meta itemprop="keywords" content="asciidoctor,guide," /><link rel="canonical" type="text/html" href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/articles/asciidoctor-article-template/" />
<script>
let theme = window.localStorage.getItem('theme');
if (theme) {
document.documentElement.dataset.theme = theme;
}
</script>
</head>
<body><div aria-label="Site header">
<nav>
<a class="site__title" href="https://foo-dogsquared.github.io/hugo-theme-more-contentful">More Contentful</a>
<div class="list site__links">
<a href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/about/">About</a>
<a href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/categories/">Categories</a>
<a href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/recipes/">Recipes</a>
<a href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/tags/">Tags</a>
</div>
</nav>
<div class="site__theme-btn" aria-label="Theme toggle" aria-hidden="true">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/generic/swatch.svg#swatch"></use>
</svg>
<div class="site__theme-dropdown">
<div class="site__theme-dropdown-list">
<div class="site__theme-item"
data-theme="Default Dark"
data-theme-dark
>Dark</div>
<div class="site__theme-item"
data-theme="Default Light"
data-theme-light
>Light</div>
<div class="site__theme-item"
data-theme="Dracula"
>Dracula</div>
<div class="site__theme-item"
data-theme="Gruvbox dark, hard"
>Gruvbox dark, hard</div>
<div class="site__theme-item"
data-theme="Gruvbox light, hard"
>Gruvbox light, hard</div>
<div class="site__theme-item"
data-theme="Nord"
>Nord</div>
<div class="site__theme-item"
data-theme="Solarized Dark"
>Solarized Dark</div>
<div class="site__theme-item"
data-theme="Solarized Light"
>Solarized Light</div>
<div class="site__theme-item" data-theme-system>
OS default
</div>
</div>
</div>
</div>
<script>
function styleTheme() {
const selectedTheme = window.localStorage.getItem("theme");
for (const el of document.querySelectorAll(".site__theme-item")) {
if (el.dataset.theme == selectedTheme) {
el.classList.add("site__theme-item--selected");
} else {
el.classList.remove("site__theme-item--selected");
}
}
}
const themeDropdown = document.querySelector('.site__theme-btn');
themeDropdown.addEventListener('click', (event) => {
const { target } = event;
if (target.classList.contains("site__theme-item")) {
if (target.dataset.theme) {
theme = target.dataset.theme;
window.localStorage.setItem("theme", theme);
document.documentElement.dataset.theme = theme;
} else {
window.localStorage.removeItem("theme");
delete document.documentElement.dataset.theme;
}
}
styleTheme();
});
styleTheme();
</script>
</div>
<hr aria-hidden="true"/>
<div class="post--single">
<main>
<article>
<header>
<h1>Asciidoctor Article Template</h1>
<div class="list post__meta" aria-hidden="true"><time datetime="2019-08-25 21:06:56 &#43;0800 &#43;0800" title="Created">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/generic/calendar.svg#calendar"></use>
</svg>
<span style="margin-left: 0.5em;">2019-08-25</span>
</time>
<time datetime="2023-02-24 20:23:27 &#43;0800 &#43;0800" title="Updated">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/generic/arrow-path.svg#arrow-path"></use>
</svg>
<span style="margin-left: 0.5em;">2023-02-24</span>
</time>
</div>
</header>
<style>
#TableOfContents:not(:empty)::before {
content: "Table of contents";
font-weight: bold;
}
</style>
<nav id="TableOfContents">
<ul>
<li><a href="#_first_level_heading">First level heading</a>
<ul>
<li><a href="#_second_level_heading">Second level heading</a></li>
</ul>
</li>
<li><a href="#_first_level_heading_2">First level heading</a></li>
<li><a href="#_first_level_heading_3">First level heading</a></li>
</ul>
</nav>
<div id="preamble">
<div class="sectionbody">
<div class="paragraph">
<p>Content entered directly below the header but before the first section heading is called the preamble.</p>
</div>
</div>
</div>
<div class="sect1">
<h2 id="_first_level_heading">First level heading</h2>
<div class="sectionbody">
<div class="paragraph">
<p>This is a paragraph with a <strong>bold</strong> word and an <em>italicized</em> word.</p>
</div>
<div class="imageblock">
<div class="content">
<img src="https://source.unsplash.com/random" alt="I am the image alt text."/>
</div>
<div class="title">Figure 1. Image caption</div>
</div>
<div class="paragraph">
<p>This is another paragraph.<sup class="footnote">[<a id="_footnoteref_1" class="footnote" href="#_footnotedef_1" title="View footnote.">1</a>]</sup></p>
</div>
<div class="sect2">
<h3 id="_second_level_heading">Second level heading</h3>
<div class="ulist">
<div class="title">Unordered list title</div>
<ul>
<li>
<p>list item 1</p>
<div class="ulist">
<ul>
<li>
<p>nested list item</p>
<div class="ulist">
<ul>
<li>
<p>nested nested list item 1</p>
</li>
<li>
<p>nested nested list item 2</p>
</li>
</ul>
</div>
</li>
</ul>
</div>
</li>
<li>
<p>list item 2</p>
</li>
</ul>
</div>
<div class="paragraph">
<p>This is a paragraph.</p>
</div>
<div class="exampleblock">
<div class="title">Example 1. title</div>
<div class="content">
<div class="paragraph">
<p>Content in an example block is subject to normal substitutions.</p>
</div>
</div>
</div>
<div class="paragraph">
<p>The test.</p>
</div>
<div class="sidebarblock">
<div class="content">
<div class="title">Sidebar title</div>
<div class="paragraph">
<p>Sidebars contain aside text and are subject to normal substitutions.</p>
</div>
</div>
</div>
<div class="sect3">
<h4 id="_third_level_heading">Third level heading</h4>
<div id="id-for-listing-block" class="listingblock">
<div class="title">Listing block title</div>
<div class="content">
<pre>Content in a listing block is subject to verbatim substitutions.
Listing block content is commonly used to preserve code input.</pre>
</div>
</div>
<div class="imageblock">
<div class="content">
<img src="https://images.unsplash.com/photo-1565645359958-700098a0a5aa?ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=500&amp;q=60" alt="photo 1565645359958 700098a0a5aa?ixlib=rb 1.2"/>
</div>
</div>
<div class="paragraph">
<p>You could also do source code inputs with the following syntax.</p>
</div>
<div class="literalblock">
<div class="content">
<pre>[source,lang]
----
// source code here
----</pre>
</div>
</div>
<div class="sect4">
<h5 id="_fourth_level_heading">Fourth level heading</h5>
<table class="tableblock frame-all grid-all stretch">
<caption class="title">Table 1. Table title</caption>
<colgroup>
<col style="width: 25%;"/>
<col style="width: 25%;"/>
<col style="width: 25%;"/>
<col style="width: 25%;"/>
</colgroup>
<thead>
<tr>
<th class="tableblock halign-left valign-top">Column heading 1</th>
<th class="tableblock halign-left valign-top">Column heading 2</th>
<th class="tableblock halign-left valign-top">Column heading 3</th>
<th class="tableblock halign-left valign-top">Column heading 4</th>
</tr>
</thead>
<tbody>
<tr>
<td class="tableblock halign-left valign-top"><p class="tableblock">Column 1, row 1</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">Column 2, row 1</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">Column 3, row 1</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">Column 4, row 1</p></td>
</tr>
<tr>
<td class="tableblock halign-left valign-top"><p class="tableblock">Column 1, row 2</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">Column 2, row 2</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">Column 3, row 2</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">Column 4, row 2</p></td>
</tr>
<tr>
<td class="tableblock halign-left valign-top"><p class="tableblock">Column 1, row 3</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">Column 2, row 3</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">Column 3, row 3</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">Column 4, row 3</p></td>
</tr>
<tr>
<td class="tableblock halign-left valign-top"><p class="tableblock">Column 1, row 4</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">Column 2, row 4</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">Column 3, row 4</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">Column 4, row 4</p></td>
</tr>
</tbody>
</table>
<div class="paragraph">
<p>Heres another table.</p>
</div>
<table class="tableblock frame-all grid-all stretch">
<colgroup>
<col style="width: 50%;"/>
<col style="width: 50%;"/>
</colgroup>
<thead>
<tr>
<th class="tableblock halign-left valign-top">Column heading 1</th>
<th class="tableblock halign-left valign-top">Column heading 2</th>
</tr>
</thead>
<tbody>
<tr>
<td class="tableblock halign-left valign-top"><p class="tableblock">Column 1, row 1</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">Column 2, row 1</p></td>
</tr>
<tr>
<td class="tableblock halign-left valign-top"><p class="tableblock">Column 1, row 2</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">Column 2, row 2</p></td>
</tr>
<tr>
<td class="tableblock halign-left valign-top"><p class="tableblock">Column 1, row 3</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">Column 2, row 3</p></td>
</tr>
</tbody>
</table>
<div class="sect5">
<h6 id="_fifth_level_heading">Fifth level heading</h6>
<div class="quoteblock">
<blockquote>
<div class="paragraph">
<p>I am a block quote or a prose excerpt.
I am subject to normal substitutions.</p>
</div>
</blockquote>
<div class="attribution">
— firstname lastname<br/>
<cite>movie title</cite>
</div>
</div>
<div class="verseblock">
<pre class="content">I am a verse block.
Indents and endlines are preserved in verse blocks.</pre>
<div class="attribution">
— firstname lastname<br/>
<cite>poem title and more</cite>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="sect1">
<h2 id="_first_level_heading_2">First level heading</h2>
<div class="sectionbody">
<div class="admonitionblock tip">
<table>
<tbody><tr>
<td class="icon">
<div class="title">Tip</div>
</td>
<td class="content">
There are five admonition labels: Tip, Note, Important, Caution and Warning.
</td>
</tr>
</tbody></table>
</div>
<div class="olist arabic">
<ol class="arabic">
<li>
<p>ordered list item</p>
<div class="olist loweralpha">
<ol class="loweralpha" type="a">
<li>
<p>nested ordered list item</p>
</li>
</ol>
</div>
</li>
<li>
<p>ordered list item</p>
</li>
</ol>
</div>
<div class="paragraph">
<p>The text at the end of this sentence is cross referenced to <a href="#_third_level_heading">the third level heading</a></p>
</div>
</div>
</div>
<div class="sect1">
<h2 id="_first_level_heading_3">First level heading</h2>
<div class="sectionbody">
<div class="paragraph">
<p>This is a link to the <a href="https://asciidoctor.org/docs/user-manual/">Asciidoctor User Manual</a>.
This is an attribute reference <a href="https://asciidoctor.org/docs/asciidoc-syntax-quick-reference/">which links this text to the Asciidoctor Quick Reference Guide</a>.</p>
</div>
</div>
</div>
<div id="footnotes">
<hr/>
<div class="footnote" id="_footnotedef_1">
<a href="#_footnoteref_1">1</a>. I am footnote text and will be displayed at the bottom of the article.
</div>
</div>
</article>
</main>
<hr aria-hidden="true"/>
<div class="post__meta--single" aria-hidden="true">
<p data-content-publication-date="2019-08-25 21:06:56 &#43;0800 &#43;0800">Created: <time datetime="2019-08-25">2019-08-25</time></p>
<p data-content-modification-date="2023-02-24 20:23:27 &#43;0800 &#43;0800">Updated: <time datetime="2023-02-24">2023-02-24</time></p>
</div>
</div>
<hr aria-hidden="true"/><footer aria-label="Site footer">
<a href="#top">Back to top</a>
<p>Available in other languages:
<span class="list site__languages">
<a href="/hugo-theme-more-contentful/en" hreflang="en">English</a>
<a href="/hugo-theme-more-contentful/tl" hreflang="tl">Tagalog</a>
</span>
</p>
<ul class="list site__socials">
<li>
<a class="site__social-icon" rel="me" href="https://example.org/gmail" aria-label="E-mail">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/gmail.svg#gmail"></use>
</svg>
</a>
</li><li>
<a class="site__social-icon" rel="me" href="https://example.org/keybase" aria-label="Keybase">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/keybase.svg#keybase"></use>
</svg>
</a>
</li><li>
<a class="site__social-icon" rel="me" href="https://example.org/devdotto" aria-label="Dev.to">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/devdotto.svg#devdotto"></use>
</svg>
</a>
</li><li>
<a class="site__social-icon" rel="me" href="https://example.org/github/" aria-label="GitHub">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/github.svg#github"></use>
</svg>
</a>
</li><li>
<a class="site__social-icon" rel="me" href="https://example.org/gitlab" aria-label="GitLab">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/gitlab.svg#gitlab"></use>
</svg>
</a>
</li><li>
<a class="site__social-icon" rel="me" href="https://example.org/lichess" aria-label="Lichess">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/lichess.svg#lichess"></use>
</svg>
</a>
</li><li>
<a class="site__social-icon" rel="me" href="https://example.org/picartodottv" aria-label="Picarto.tv">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/picartodottv.svg#picartodottv"></use>
</svg>
</a>
</li><li>
<a class="site__social-icon" rel="me" href="https://example.org/pixiv" aria-label="Pixiv">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/pixiv.svg#pixiv"></use>
</svg>
</a>
</li><li>
<a class="site__social-icon" rel="me" href="https://example.org/twitch" aria-label="Twitch">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/twitch.svg#twitch"></use>
</svg>
</a>
</li><li>
<a class="site__social-icon" rel="me" href="https://example.org/twitter" aria-label="Twitter">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/twitter.svg#twitter"></use>
</svg>
</a>
</li><li>
<a class="site__social-icon" rel="me" href="https://example.org/youtube" aria-label="YouTube">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/youtube.svg#youtube"></use>
</svg>
</a>
</li></ul>
<p>© 2023 More Contentful</p>
</footer>
</body>
</html>