mirror of
https://github.com/McShelby/hugo-theme-relearn.git
synced 2024-11-24 00:03:10 +00:00
364 lines
23 KiB
HTML
364 lines
23 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en" dir="ltr">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="height=device-height, width=device-width, initial-scale=1.0, minimum-scale=1.0">
|
|
<meta name="generator" content="Hugo 0.125.3">
|
|
<meta name="generator" content="Relearn 5.27.0+tip">
|
|
<meta name="description" content="List of files attached to a page">
|
|
<meta name="author" content="Sören Weber">
|
|
<meta name="twitter:card" content="summary_large_image">
|
|
<meta name="twitter:image" content="https://mcshelby.github.io/hugo-theme-relearn/images/hero.png">
|
|
<meta name="twitter:title" content="Attachments :: Hugo Relearn Theme">
|
|
<meta name="twitter:description" content="List of files attached to a page">
|
|
<meta property="og:url" content="https://mcshelby.github.io/hugo-theme-relearn/shortcodes/attachments/index.html">
|
|
<meta property="og:site_name" content="Hugo Relearn Theme">
|
|
<meta property="og:title" content="Attachments :: Hugo Relearn Theme">
|
|
<meta property="og:description" content="List of files attached to a page">
|
|
<meta property="og:locale" content="en">
|
|
<meta property="og:type" content="article">
|
|
<meta property="article:section" content="Shortcodes :: Hugo Relearn Theme">
|
|
<meta property="og:image" content="https://mcshelby.github.io/hugo-theme-relearn/images/hero.png">
|
|
<title>Attachments :: Hugo Relearn Theme</title>
|
|
<link href="https://mcshelby.github.io/hugo-theme-relearn/shortcodes/attachments/index.html" rel="alternate" hreflang="x-default">
|
|
<link href="https://mcshelby.github.io/hugo-theme-relearn/shortcodes/attachments/index.html" rel="alternate" hreflang="en">
|
|
<link href="https://mcshelby.github.io/hugo-theme-relearn/pir/shortcodes/attachments/index.html" rel="alternate" hreflang="art-pir">
|
|
<link href="https://mcshelby.github.io/hugo-theme-relearn/shortcodes/attachments/index.html" rel="canonical" type="text/html" title="Attachments :: Hugo Relearn Theme">
|
|
<link href="/hugo-theme-relearn/shortcodes/attachments/index.xml" rel="alternate" type="application/rss+xml" title="Attachments :: Hugo Relearn Theme">
|
|
<link href="/hugo-theme-relearn/images/logo.svg?1713911100" rel="icon" type="image/svg+xml">
|
|
<!-- https://github.com/filamentgroup/loadCSS/blob/master/README.md#how-to-use -->
|
|
<link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1713911101" rel="stylesheet" media="print" onload="this.media='all';this.onload=null;"><noscript><link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1713911101" rel="stylesheet"></noscript>
|
|
<link href="/hugo-theme-relearn/css/nucleus.css?1713911101" rel="stylesheet">
|
|
<link href="/hugo-theme-relearn/css/auto-complete.css?1713911101" rel="stylesheet" media="print" onload="this.media='all';this.onload=null;"><noscript><link href="/hugo-theme-relearn/css/auto-complete.css?1713911101" rel="stylesheet"></noscript>
|
|
<link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1713911101" rel="stylesheet">
|
|
<link href="/hugo-theme-relearn/css/fonts.css?1713911101" rel="stylesheet" media="print" onload="this.media='all';this.onload=null;"><noscript><link href="/hugo-theme-relearn/css/fonts.css?1713911101" rel="stylesheet"></noscript>
|
|
<link href="/hugo-theme-relearn/css/theme.css?1713911101" rel="stylesheet">
|
|
<link href="/hugo-theme-relearn/css/theme-relearn-auto.css?1713911101" rel="stylesheet" id="R-variant-style">
|
|
<link href="/hugo-theme-relearn/css/chroma-relearn-auto.css?1713911101" rel="stylesheet" id="R-variant-chroma-style">
|
|
<link href="/hugo-theme-relearn/css/variant.css?1713911101" rel="stylesheet">
|
|
<link href="/hugo-theme-relearn/css/print.css?1713911101" rel="stylesheet" media="print">
|
|
<link href="/hugo-theme-relearn/css/format-print.css?1713911101" rel="stylesheet">
|
|
<script src="/hugo-theme-relearn/js/variant.js?1713911101"></script>
|
|
<script>
|
|
window.relearn = window.relearn || {};
|
|
window.relearn.relBasePath='..\/..';
|
|
window.relearn.relBaseUri='..\/..\/..';
|
|
window.relearn.absBaseUri='https:\/\/mcshelby.github.io\/hugo-theme-relearn';
|
|
window.index_js_url="/hugo-theme-relearn/index.search.js";
|
|
// variant stuff
|
|
window.variants && variants.init( [ 'relearn-auto', 'relearn-light', 'relearn-dark', 'relearn-bright', 'zen-auto', 'zen-light', 'zen-dark', 'retro-auto', 'neon', 'learn', 'blue', 'green', 'red' ] );
|
|
// translations
|
|
window.T_Copy_to_clipboard = `Copy to clipboard`;
|
|
window.T_Copied_to_clipboard = `Copied to clipboard!`;
|
|
window.T_Copy_link_to_clipboard = `Copy link to clipboard`;
|
|
window.T_Link_copied_to_clipboard = `Copied link to clipboard!`;
|
|
window.T_Reset_view = `Reset view`;
|
|
window.T_View_reset = `View reset!`;
|
|
window.T_No_results_found = `No results found for "{0}"`;
|
|
window.T_N_results_found = `{1} results found for "{0}"`;
|
|
</script>
|
|
<style>
|
|
#R-body img.bg-white {
|
|
background-color: white;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body class="mobile-support print disableInlineCopyToClipboard" data-url="/hugo-theme-relearn/shortcodes/attachments/index.html">
|
|
<div id="R-body" class="default-animation">
|
|
<div id="R-body-overlay"></div>
|
|
<nav id="R-topbar">
|
|
<div class="topbar-wrapper">
|
|
<div class="topbar-sidebar-divider"></div>
|
|
<div class="topbar-area topbar-area-start" data-area="start">
|
|
<div class="topbar-button topbar-button-sidebar" data-content-empty="disable" data-width-s="show" data-width-m="hide" data-width-l="hide"><button class="topbar-control" onclick="toggleNav()" type="button" title="Menu (CTRL+ALT+n)"><i class="fa-fw fas fa-bars"></i></button>
|
|
</div>
|
|
</div>
|
|
<ol class="topbar-breadcrumbs breadcrumbs highlightable" itemscope itemtype="http://schema.org/BreadcrumbList"><li
|
|
itemscope itemtype="https://schema.org/ListItem" itemprop="itemListElement"><a itemprop="item" href="/hugo-theme-relearn/shortcodes/index.html"><span itemprop="name">Shortcodes</span></a><meta itemprop="position" content="1"> > </li><li
|
|
itemscope itemtype="https://schema.org/ListItem" itemprop="itemListElement"><span itemprop="name">Attachments</span><meta itemprop="position" content="2"></li>
|
|
</ol>
|
|
<div class="topbar-area topbar-area-end" data-area="end">
|
|
<div class="topbar-button topbar-button-prev" data-content-empty="disable" data-width-s="show" data-width-m="show" data-width-l="show"><a class="topbar-control" href="/hugo-theme-relearn/shortcodes/index.html" title="Shortcodes (🡐)"><i class="fa-fw fas fa-chevron-left"></i></a>
|
|
</div>
|
|
<div class="topbar-button topbar-button-next" data-content-empty="disable" data-width-s="show" data-width-m="show" data-width-l="show"><a class="topbar-control" href="/hugo-theme-relearn/shortcodes/badge/index.html" title="Badge (🡒)"><i class="fa-fw fas fa-chevron-right"></i></a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
<div id="R-main-overlay"></div>
|
|
<main id="R-body-inner" class="highlightable default" tabindex="-1">
|
|
<div class="flex-block-wrapper">
|
|
<article class="default">
|
|
<header class="headline">
|
|
</header>
|
|
|
|
<h1 id="attachments">Attachments</h1>
|
|
|
|
<p>The <code>attachments</code> shortcode displays a list of files attached to a page with adjustable color, title and icon.</p>
|
|
|
|
|
|
<div class="box attachments cstyle transparent">
|
|
<div class="box-label"><i class="fa-fw fas fa-paperclip"></i> Attachments</div>
|
|
<ul class="box-content attachments-files">
|
|
<li><a href="/hugo-theme-relearn/shortcodes/attachments/index.en.files/adivorciarsetoca00cape.pdf">adivorciarsetoca00cape.pdf</a> (361 KB)</li>
|
|
<li><a href="/hugo-theme-relearn/shortcodes/attachments/index.en.files/BachGavotteShort.mp3">BachGavotteShort.mp3</a> (357 KB)</li>
|
|
<li><a href="/hugo-theme-relearn/shortcodes/attachments/index.en.files/Carroll_AliceAuPaysDesMerveilles.pdf">Carroll_AliceAuPaysDesMerveilles.pdf</a> (175 KB)</li>
|
|
<li><a href="/hugo-theme-relearn/shortcodes/attachments/index.en.files/hugo.png">hugo.png</a> (17 KB)</li>
|
|
<li><a href="/hugo-theme-relearn/shortcodes/attachments/index.en.files/hugo.txt">hugo.txt</a> (20 B)</li>
|
|
<li><a href="/hugo-theme-relearn/shortcodes/attachments/index.en.files/movieselectricsheep-flock-244-32500-2.mp4">movieselectricsheep-flock-244-32500-2.mp4</a> (340 KB)</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="box notices cstyle warning">
|
|
<div class="box-label"><i class="fa-fw fas fa-exclamation-triangle"></i> Warning</div>
|
|
<div class="box-content">
|
|
|
|
<p>This shortcode is deprecated in favor of the new <a href="/hugo-theme-relearn/shortcodes/resources/index.html"><code>resources</code> shortcode</a>. See <a href="/hugo-theme-relearn/shortcodes/attachments/index.html#migration">migration instructions</a> below.</p>
|
|
</div>
|
|
</div>
|
|
<h2 id="migration">Migration</h2>
|
|
<p>While this shortcode will still be available for some time, it does not receive support anymore. Start to migrate early, as it will be removed with the next major update of the theme.</p>
|
|
<p>The <code>resources</code> shortcode leverages Hugo’s resource feature for page bundles. It has all the same parameter as the <code>attachments</code> shortcode but applies the <code>pattern</code> directly on a resources <code>Name</code> attribute.</p>
|
|
<p>To migrate your pages apply the following steps:</p>
|
|
<ol>
|
|
<li>If a page is not already a <a href="https://gohugo.io/content-management/page-bundles/" rel="external" target="_self">page bundle</a> convert it</li>
|
|
<li>Move your files to a valid destination inside of your page bundle (depending if you have a branch or a leaf bundle)</li>
|
|
<li>Change the calls from the <code>attachments</code> shortcode to the <a href="/hugo-theme-relearn/shortcodes/resources/index.html"><code>resources</code> shortcode</a> and adjust the <code>pattern</code> parameter to the new directory layout and the resources <a href="https://gohugo.io/methods/resource/name/" rel="external" target="_self"><code>Name</code> attribute</a>.</li>
|
|
</ol>
|
|
<p>Multilanguage features are not supported directly by the shortcode anymore but rely on Hugo’s handling for resource translations.</p>
|
|
<h2 id="usage">Usage</h2>
|
|
<p>While the examples are using shortcodes with named parameter you are free to also call this shortcode from your own partials.</p>
|
|
|
|
<div class="tab-panel" data-tab-group="shortcode-parameter">
|
|
<div class="tab-nav">
|
|
<div class="tab-nav-title">​</div>
|
|
<button
|
|
data-tab-item="shortcode"
|
|
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
|
|
onclick="switchTab('shortcode-parameter','shortcode')"
|
|
>
|
|
<span class="tab-nav-text">shortcode</span>
|
|
</button>
|
|
<button
|
|
data-tab-item="partial"
|
|
class="tab-nav-button tab-panel-style cstyle initial"
|
|
onclick="switchTab('shortcode-parameter','partial')"
|
|
>
|
|
<span class="tab-nav-text">partial</span>
|
|
</button>
|
|
</div>
|
|
<div class="tab-content-container">
|
|
<div
|
|
data-tab-item="shortcode"
|
|
class="tab-content tab-panel-style cstyle initial active">
|
|
<div class="tab-content-text">
|
|
|
|
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-go" data-lang="go"><span class="line"><span class="cl"><span class="p">{{</span><span class="o">%</span> <span class="nx">attachments</span> <span class="nx">sort</span><span class="p">=</span><span class="s">"asc"</span> <span class="o">/%</span><span class="p">}}</span></span></span></code></pre></div></div>
|
|
</div>
|
|
<div
|
|
data-tab-item="partial"
|
|
class="tab-content tab-panel-style cstyle initial">
|
|
<div class="tab-content-text">
|
|
|
|
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-go" data-lang="go"><span class="line"><span class="cl"><span class="p">{{</span> <span class="nx">partial</span> <span class="s">"shortcodes/attachments.html"</span> <span class="p">(</span><span class="nx">dict</span>
|
|
</span></span><span class="line"><span class="cl"> <span class="s">"page"</span> <span class="p">.</span>
|
|
</span></span><span class="line"><span class="cl"> <span class="s">"sort"</span> <span class="s">"asc"</span>
|
|
</span></span><span class="line"><span class="cl"><span class="p">)}}</span></span></span></code></pre></div></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h3 id="parameter">Parameter</h3>
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>Name</th>
|
|
<th>Default</th>
|
|
<th>Notes</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td><strong>style</strong></td>
|
|
<td><code>transparent</code></td>
|
|
<td>The style scheme used for the box.<br><br>- by severity: <code>info</code>, <code>note</code>, <code>tip</code>, <code>warning</code><br>- by brand color: <code>primary</code>, <code>secondary</code>, <code>accent</code><br>- by color: <code>blue</code>, <code>green</code>, <code>grey</code>, <code>orange</code>, <code>red</code><br>- by special color: <code>default</code>, <code>transparent</code>, <code>code</code></td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>color</strong></td>
|
|
<td>see notes</td>
|
|
<td>The <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/color_value" rel="external" target="_self">CSS color value</a> to be used. If not set, the chosen color depends on the <strong>style</strong>. Any given value will overwrite the default.<br><br>- for severity styles: a nice matching color for the severity<br>- for all other styles: the corresponding color</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>title</strong></td>
|
|
<td>see notes</td>
|
|
<td>Arbitrary text for the box title. Depending on the <strong>style</strong> there may be a default title. Any given value will overwrite the default.<br><br>- for severity styles: the matching title for the severity<br>- for all other styles: <code>Attachments</code><br><br>If you want no title for a severity style, you have to set this parameter to <code>" "</code> (a non empty string filled with spaces)</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>icon</strong></td>
|
|
<td>see notes</td>
|
|
<td><a href="/hugo-theme-relearn/shortcodes/icon/index.html#finding-an-icon">Font Awesome icon name</a> set to the left of the title. Depending on the <strong>style</strong> there may be a default icon. Any given value will overwrite the default.<br><br>- for severity styles: a nice matching icon for the severity<br>- for all other styles: <code>paperclip</code><br><br>If you want no icon, you have to set this parameter to <code>" "</code> (a non empty d with spaces)</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>sort</strong></td>
|
|
<td><code>asc</code></td>
|
|
<td>Sorting the output in <code>asc</code>ending or <code>desc</code>ending order.</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>pattern</strong></td>
|
|
<td><code>.*</code></td>
|
|
<td>A <a href="https://en.wikipedia.org/wiki/Regular_expression" rel="external" target="_self">regular expressions</a>, used to filter the attachments by file name. For example:<br><br>- to match a file suffix of ‘jpg’, use <code>.*\.jpg</code> (not <code>*.\.jpg</code>)<br>- to match file names ending in <code>jpg</code> or <code>png</code>, use <code>.*\.(jpg|png)</code></td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
<h2 id="setup">Setup</h2>
|
|
<h3 id="single-language">Single language</h3>
|
|
<p>The shortcode lists files found in a specific folder. The name of the folder depends on your page type (either branch bundle, leaf bundle or page).</p>
|
|
<ol>
|
|
<li>
|
|
<p>If your page is a leaf bundle, attachments must be placed in a nested <code>index.files</code> folder, accordingly.</p>
|
|
<blockquote>
|
|
<ul>
|
|
<li>content
|
|
<ul>
|
|
<li>_index.md</li>
|
|
<li>page
|
|
<ul>
|
|
<li>index.md</li>
|
|
<li><strong>index.files</strong>
|
|
<ul>
|
|
<li>attachment.pdf</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</blockquote>
|
|
</li>
|
|
<li>
|
|
<p>If your page is a branch bundle, attachments must be placed in a nested <code>_index.files</code> folder, accordingly.</p>
|
|
<p><span class="badge cstyle warning badge-with-title"><span class="badge-title"><i class="fa-fw fas fa-exclamation-triangle"></i></span><span class="badge-content">Warning</span></span> This is only available for Hugo < <code>0.112.0</code></p>
|
|
<blockquote>
|
|
<ul>
|
|
<li>content
|
|
<ul>
|
|
<li>_index.md</li>
|
|
<li>page
|
|
<ul>
|
|
<li>_index.md</li>
|
|
<li><strong>_index.files</strong>
|
|
<ul>
|
|
<li>attachment.pdf</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</blockquote>
|
|
</li>
|
|
<li>
|
|
<p>For simple pages, attachments must be placed in a folder named like your page and ending with <code>.files</code>.</p>
|
|
<p><span class="badge cstyle warning badge-with-title"><span class="badge-title"><i class="fa-fw fas fa-exclamation-triangle"></i></span><span class="badge-content">Warning</span></span> This is only available for Hugo < <code>0.112.0</code></p>
|
|
<blockquote>
|
|
<ul>
|
|
<li>content
|
|
<ul>
|
|
<li>_index.md</li>
|
|
<li><strong>page.files</strong>
|
|
<ul>
|
|
<li>attachment.pdf</li>
|
|
</ul>
|
|
</li>
|
|
<li>page.md</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</blockquote>
|
|
</li>
|
|
</ol>
|
|
<h3 id="multilingual">Multilingual</h3>
|
|
<p>Be aware that if you use a multilingual website, you will need to have as many folders as languages and the language code must be part of the folder name.</p>
|
|
<p>Eg. for a site in English and Piratish:</p>
|
|
<blockquote>
|
|
<ul>
|
|
<li>content
|
|
<ul>
|
|
<li>index.en.md</li>
|
|
<li>index.pir.md</li>
|
|
<li>page
|
|
<ul>
|
|
<li>index.en.md</li>
|
|
<li>index.pir.md</li>
|
|
<li><strong>index.en.files</strong>
|
|
<ul>
|
|
<li>attachment.pdf</li>
|
|
</ul>
|
|
</li>
|
|
<li><strong>index.pir.files</strong>
|
|
<ul>
|
|
<li>attachment.pdf</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</blockquote>
|
|
<h2 id="examples">Examples</h2>
|
|
<h3 id="custom-title-list-of-attachments-ending-in-pdf-or-mp4">Custom Title, List of Attachments Ending in pdf or mp4</h3>
|
|
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-go" data-lang="go"><span class="line"><span class="cl"><span class="p">{{</span><span class="o">%</span> <span class="nx">attachments</span> <span class="nx">title</span><span class="p">=</span><span class="s">"Related **files**"</span> <span class="nx">pattern</span><span class="p">=</span><span class="s">".*\.(pdf|mp4)"</span> <span class="o">/%</span><span class="p">}}</span></span></span></code></pre></div>
|
|
|
|
<div class="box attachments cstyle transparent">
|
|
<div class="box-label"><i class="fa-fw fas fa-paperclip"></i> Related <strong>files</strong></div>
|
|
<ul class="box-content attachments-files">
|
|
<li><a href="/hugo-theme-relearn/shortcodes/attachments/index.en.files/adivorciarsetoca00cape.pdf">adivorciarsetoca00cape.pdf</a> (361 KB)</li>
|
|
<li><a href="/hugo-theme-relearn/shortcodes/attachments/index.en.files/Carroll_AliceAuPaysDesMerveilles.pdf">Carroll_AliceAuPaysDesMerveilles.pdf</a> (175 KB)</li>
|
|
<li><a href="/hugo-theme-relearn/shortcodes/attachments/index.en.files/movieselectricsheep-flock-244-32500-2.mp4">movieselectricsheep-flock-244-32500-2.mp4</a> (340 KB)</li>
|
|
</ul>
|
|
</div>
|
|
<h3 id="info-styled-box-descending-sort-order">Info Styled Box, Descending Sort Order</h3>
|
|
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-go" data-lang="go"><span class="line"><span class="cl"><span class="p">{{</span><span class="o">%</span> <span class="nx">attachments</span> <span class="nx">style</span><span class="p">=</span><span class="s">"info"</span> <span class="nx">sort</span><span class="p">=</span><span class="s">"desc"</span> <span class="o">/%</span><span class="p">}}</span></span></span></code></pre></div>
|
|
|
|
<div class="box attachments cstyle info">
|
|
<div class="box-label"><i class="fa-fw fas fa-info-circle"></i> Info</div>
|
|
<ul class="box-content attachments-files">
|
|
<li><a href="/hugo-theme-relearn/shortcodes/attachments/index.en.files/movieselectricsheep-flock-244-32500-2.mp4">movieselectricsheep-flock-244-32500-2.mp4</a> (340 KB)</li>
|
|
<li><a href="/hugo-theme-relearn/shortcodes/attachments/index.en.files/hugo.txt">hugo.txt</a> (20 B)</li>
|
|
<li><a href="/hugo-theme-relearn/shortcodes/attachments/index.en.files/hugo.png">hugo.png</a> (17 KB)</li>
|
|
<li><a href="/hugo-theme-relearn/shortcodes/attachments/index.en.files/Carroll_AliceAuPaysDesMerveilles.pdf">Carroll_AliceAuPaysDesMerveilles.pdf</a> (175 KB)</li>
|
|
<li><a href="/hugo-theme-relearn/shortcodes/attachments/index.en.files/BachGavotteShort.mp3">BachGavotteShort.mp3</a> (357 KB)</li>
|
|
<li><a href="/hugo-theme-relearn/shortcodes/attachments/index.en.files/adivorciarsetoca00cape.pdf">adivorciarsetoca00cape.pdf</a> (361 KB)</li>
|
|
</ul>
|
|
</div>
|
|
<h3 id="with-user-defined-color-and-font-awesome-brand-icon">With User-Defined Color and Font Awesome Brand Icon</h3>
|
|
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-go" data-lang="go"><span class="line"><span class="cl"><span class="p">{{</span><span class="o">%</span> <span class="nx">attachments</span> <span class="nx">color</span><span class="p">=</span><span class="s">"fuchsia"</span> <span class="nx">icon</span><span class="p">=</span><span class="s">"fa-fw fab fa-hackerrank"</span> <span class="o">/%</span><span class="p">}}</span></span></span></code></pre></div>
|
|
|
|
<div class="box attachments cstyle default" style="--VARIABLE-BOX-color: fuchsia;">
|
|
<div class="box-label"><i class="fa-fw fab fa-hackerrank"></i> Attachments</div>
|
|
<ul class="box-content attachments-files">
|
|
<li><a href="/hugo-theme-relearn/shortcodes/attachments/index.en.files/adivorciarsetoca00cape.pdf">adivorciarsetoca00cape.pdf</a> (361 KB)</li>
|
|
<li><a href="/hugo-theme-relearn/shortcodes/attachments/index.en.files/BachGavotteShort.mp3">BachGavotteShort.mp3</a> (357 KB)</li>
|
|
<li><a href="/hugo-theme-relearn/shortcodes/attachments/index.en.files/Carroll_AliceAuPaysDesMerveilles.pdf">Carroll_AliceAuPaysDesMerveilles.pdf</a> (175 KB)</li>
|
|
<li><a href="/hugo-theme-relearn/shortcodes/attachments/index.en.files/hugo.png">hugo.png</a> (17 KB)</li>
|
|
<li><a href="/hugo-theme-relearn/shortcodes/attachments/index.en.files/hugo.txt">hugo.txt</a> (20 B)</li>
|
|
<li><a href="/hugo-theme-relearn/shortcodes/attachments/index.en.files/movieselectricsheep-flock-244-32500-2.mp4">movieselectricsheep-flock-244-32500-2.mp4</a> (340 KB)</li>
|
|
</ul>
|
|
</div>
|
|
<h3 id="style-color-title-and-icons">Style, Color, Title and Icons</h3>
|
|
<p>For further examples for <strong>style</strong>, <strong>color</strong>, <strong>title</strong> and <strong>icon</strong>, see the <a href="/hugo-theme-relearn/shortcodes/notice/index.html"><code>notice</code> shortcode</a> documentation. The parameter are working the same way for both shortcodes, besides having different defaults.</p>
|
|
|
|
<footer class="footline">
|
|
</footer>
|
|
</article>
|
|
|
|
</div>
|
|
</main>
|
|
</div>
|
|
<script src="/hugo-theme-relearn/js/clipboard.min.js?1713911101" defer></script>
|
|
<script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1713911101" defer></script>
|
|
<script src="/hugo-theme-relearn/js/theme.js?1713911101" defer></script>
|
|
</body>
|
|
</html>
|