mirror of
https://github.com/McShelby/hugo-theme-relearn.git
synced 2024-11-25 00:33:10 +00:00
401 lines
28 KiB
HTML
401 lines
28 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="art-x-pir" dir="rtl" itemscope itemtype="http://schema.org/Article">
|
|
<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.133.1">
|
|
<meta name="generator" content="Relearn 6.2.0+tip">
|
|
<meta name="description" content="Th' theme comes wit' a reasonably configured topbar.
|
|
Nevertheless, yer requirements may differ from this configurat'n.">
|
|
<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="Topbarrr Modificat'n :: Cap'n Hugo Relearrrn Theme">
|
|
<meta name="twitter:description" content="Th' theme comes wit' a reasonably configured topbar.
|
|
Nevertheless, yer requirements may differ from this configurat'n.">
|
|
<meta property="og:url" content="https://mcshelby.github.io/hugo-theme-relearn/pir/basics/topbar/index.html">
|
|
<meta property="og:site_name" content="Cap'n Hugo Relearrrn Theme">
|
|
<meta property="og:title" content="Topbarrr Modificat'n :: Cap'n Hugo Relearrrn Theme">
|
|
<meta property="og:description" content="Th' theme comes wit' a reasonably configured topbar.
|
|
Nevertheless, yer requirements may differ from this configurat'n.">
|
|
<meta property="og:locale" content="art_x_pir">
|
|
<meta property="og:type" content="website">
|
|
<meta property="og:image" content="https://mcshelby.github.io/hugo-theme-relearn/images/hero.png">
|
|
<meta itemprop="name" content="Topbarrr Modificat'n :: Cap'n Hugo Relearrrn Theme">
|
|
<meta itemprop="description" content="Th' theme comes wit' a reasonably configured topbar.
|
|
Nevertheless, yer requirements may differ from this configurat'n.">
|
|
<meta itemprop="wordCount" content="1433">
|
|
<meta itemprop="image" content="https://mcshelby.github.io/hugo-theme-relearn/images/hero.png">
|
|
<title>Topbarrr Modificat'n :: Cap'n Hugo Relearrrn Theme</title>
|
|
<link href="https://mcshelby.github.io/hugo-theme-relearn/basics/topbar/index.html" rel="alternate" hreflang="x-default">
|
|
<link href="https://mcshelby.github.io/hugo-theme-relearn/basics/topbar/index.html" rel="alternate" hreflang="en">
|
|
<link href="https://mcshelby.github.io/hugo-theme-relearn/pir/basics/topbar/index.html" rel="alternate" hreflang="art-x-pir">
|
|
<link href="https://mcshelby.github.io/hugo-theme-relearn/pir/basics/topbar/index.html" rel="canonical" type="text/html" title="Topbarrr Modificat'n :: Cap'n Hugo Relearrrn Theme">
|
|
<link href="/hugo-theme-relearn/pir/basics/topbar/index.xml" rel="alternate" type="application/rss+xml" title="Topbarrr Modificat'n :: Cap'n Hugo Relearrrn Theme">
|
|
<link href="/hugo-theme-relearn/images/logo.svg?1725191907" rel="icon" type="image/svg+xml">
|
|
<link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1725191907" rel="stylesheet" media="print" onload="this.media='all';this.onload=null;"><noscript><link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1725191907" rel="stylesheet"></noscript>
|
|
<link href="/hugo-theme-relearn/css/nucleus.css?1725191907" rel="stylesheet">
|
|
<link href="/hugo-theme-relearn/css/auto-complete.css?1725191907" rel="stylesheet" media="print" onload="this.media='all';this.onload=null;"><noscript><link href="/hugo-theme-relearn/css/auto-complete.css?1725191907" rel="stylesheet"></noscript>
|
|
<link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1725191907" rel="stylesheet">
|
|
<link href="/hugo-theme-relearn/css/fonts.css?1725191907" rel="stylesheet" media="print" onload="this.media='all';this.onload=null;"><noscript><link href="/hugo-theme-relearn/css/fonts.css?1725191907" rel="stylesheet"></noscript>
|
|
<link href="/hugo-theme-relearn/css/theme.css?1725191907" rel="stylesheet">
|
|
<link href="/hugo-theme-relearn/css/theme-relearn-auto.css?1725191907" rel="stylesheet" id="R-variant-style">
|
|
<link href="/hugo-theme-relearn/css/chroma-relearn-auto.css?1725191907" rel="stylesheet" id="R-variant-chroma-style">
|
|
<link href="/hugo-theme-relearn/css/variant.css?1725191907" rel="stylesheet">
|
|
<link href="/hugo-theme-relearn/css/print.css?1725191907" rel="stylesheet" media="print">
|
|
<link href="/hugo-theme-relearn/css/format-print.css?1725191907" rel="stylesheet">
|
|
<script src="/hugo-theme-relearn/js/variant.js?1725191907"></script>
|
|
<script>
|
|
window.relearn = window.relearn || {};
|
|
window.relearn.relBasePath='..\/..\/..';
|
|
window.relearn.relBaseUri='..\/..\/..\/..';
|
|
window.relearn.absBaseUri='https:\/\/mcshelby.github.io\/hugo-theme-relearn';
|
|
window.relearn.disableAnchorCopy=false;
|
|
window.relearn.disableAnchorScrolling=false;
|
|
window.index_js_url="/hugo-theme-relearn/pir/index.search.js?1725191907";
|
|
// 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 t' clipboard`;
|
|
window.T_Copied_to_clipboard = `Copied t' clipboard!`;
|
|
window.T_Copy_link_to_clipboard = `Copy link t' clipboard`;
|
|
window.T_Link_copied_to_clipboard = `Copied link t' clipboard!`;
|
|
window.T_Reset_view = `Rrreset view`;
|
|
window.T_View_reset = `View rrreset!`;
|
|
window.T_No_results_found = `No rrresults found fer "{0}"`;
|
|
window.T_N_results_found = `{1} rrresults found fer "{0}"`;
|
|
</script>
|
|
<style>
|
|
#R-body img.bg-white {
|
|
background-color: white;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body class="mobile-support print disableInlineCopyToClipboard" data-url="/hugo-theme-relearn/pir/basics/topbar/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/pir/basics/index.html"><span itemprop="name">Basics</span></a><meta itemprop="position" content="1"> > </li><li
|
|
itemscope itemtype="https://schema.org/ListItem" itemprop="itemListElement"><span itemprop="name">Topbarrr Modificat'n</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/pir/basics/generator/index.html" title="Stylesheet generrrat'r (🡒)"><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/pir/basics/history/index.html" title="Historrry (🡐)"><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="topbarrr-modificatn">Topbarrr Modificat'n</h1>
|
|
|
|
<p>Th' theme comes wit' a reasonably configured topbar.</p>
|
|
<p><a href="#R-image-ef0b3572031ab20a49661528a08f3e64" class="lightbox-link"><img alt="Topbar on mobile devices" class="bg-white border lazy lightbox noshadow figure-image" loading="lazy" src="/hugo-theme-relearn/basics/topbar/topbar-closed.png" style=" height: auto; width: auto;"></a>
|
|
<a href="javascript:history.back();" class="lightbox-back" id="R-image-ef0b3572031ab20a49661528a08f3e64"><img alt="Topbar on mobile devices" class="bg-white border lazy lightbox noshadow lightbox-image" loading="lazy" src="/hugo-theme-relearn/basics/topbar/topbar-closed.png"></a></p>
|
|
<p>Nevertheless, yer requirements may differ from this configurat'n. Luckily th' theme got ye covered as th' themebar, its buttons an' th' functionality behind these buttons be fully configur'ble by ye.</p>
|
|
|
|
<div class="box notices cstyle tip">
|
|
<div class="box-label">
|
|
<i class="fa-fw fas fa-lightbulb"></i> Smarrrt Arrrse
|
|
</div>
|
|
<div class="box-content">
|
|
|
|
<p>All mentioned file names below can be clicked an' show ye th' implementat'n fer a better understand'n.</p>
|
|
</div>
|
|
</div>
|
|
<h2 id="areas">Areas</h2>
|
|
<p>Th' default configurat'n comes wit' three predefined areas that may contain an arbitrary set o' buttons.</p>
|
|
<p><a href="#R-image-e94f887de80a6f0f3b3b728bc5c5b6e0" class="lightbox-link"><img alt="Topbar wit' default areas marked" class="bg-white border lazy lightbox noshadow figure-image" loading="lazy" src="/hugo-theme-relearn/basics/topbar/topbar-areas.png" style=" height: auto; width: auto;"></a>
|
|
<a href="javascript:history.back();" class="lightbox-back" id="R-image-e94f887de80a6f0f3b3b728bc5c5b6e0"><img alt="Topbar wit' default areas marked" class="bg-white border lazy lightbox noshadow lightbox-image" loading="lazy" src="/hugo-theme-relearn/basics/topbar/topbar-areas.png"></a></p>
|
|
<ul>
|
|
<li><a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/area/start.html" rel="external" target="_self"><strong>start</strong></a>: shown between menu an' breadcrumb</li>
|
|
<li><a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/area/end.html" rel="external" target="_self"><strong>end</strong></a>: shown on th' opposite breadcrumb side 'n comparison t' th' <em>start</em> area</li>
|
|
<li><a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/area/more.html" rel="external" target="_self"><strong>more</strong></a>: shown when press'n th' <span class="btn cstyle transparent"><span><i class="fa-fw fas fa-ellipsis-v"></i></span></span> <em>more</em> button 'n th' topbar</li>
|
|
</ul>
|
|
<p>While ye can not add additional areas 'n th' topbar, ye be free t' configure additional buttons that behave like th' <em>more</em> button, provid'n further user defined areas.</p>
|
|
<h2 id="buttons">Buttons</h2>
|
|
<p>Th' theme ships wit' th' follow'n predefined buttons (from left t' right 'n th' screenshot)</p>
|
|
<ul>
|
|
<li><span class="btn cstyle transparent"><span><i class="fa-fw fas fa-bars"></i></span></span> <a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/button/sidebar.html" rel="external" target="_self"><strong>sidebar</strong></a>: opens th' sidebar flyout if 'n mobile layout</li>
|
|
<li><span class="btn cstyle transparent"><span><i class="fa-fw fas fa-list-alt"></i></span></span> <a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/button/toc.html" rel="external" target="_self"><strong>toc</strong></a>: opens th' t'ble o' contents 'n an overlay</li>
|
|
<li><span class="btn cstyle transparent"><span><i class="fa-fw fas fa-pen"></i></span></span> <a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/button/edit.html" rel="external" target="_self"><strong>edit</strong></a>: browses t' th' edit'ble plank if th' <code>editURL</code> <a href="/hugo-theme-relearn/pir/basics/configuration/index.html">parameter be set</a></li>
|
|
<li><span class="btn cstyle transparent"><span><i class="fa-fw fas fa-print"></i></span></span> <a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/button/print.html" rel="external" target="_self"><strong>print</strong></a>: browses t' th' chapters print'ble plank if <a href="/hugo-theme-relearn/pir/basics/customization/index.html#activate-print-support">print support</a> was activated</li>
|
|
<li><span class="btn cstyle transparent"><span><i class="fa-fw fas fa-chevron-left"></i></span></span> <a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/button/prev.html" rel="external" target="_self"><strong>prev</strong></a>: browses t' th' previous plank if there be one</li>
|
|
<li><span class="btn cstyle transparent"><span><i class="fa-fw fas fa-chevron-right"></i></span></span> <a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/button/next.html" rel="external" target="_self"><strong>next</strong></a>: browses t' th' next plank if there be one</li>
|
|
<li><span class="btn cstyle transparent"><span><i class="fa-fw fas fa-ellipsis-v"></i></span></span> <a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/button/more.html" rel="external" target="_self"><strong>more</strong></a>: opens th' overlay fer th' <em>more</em> area</li>
|
|
</ul>
|
|
<p>Not all buttons be displayed at every given time. This be configur'ble (see below if interested).</p>
|
|
<h2 id="redefining-areas">Redefin'n Areas</h2>
|
|
<p>Each predefined area an' button comes 'n their own file. By that it be easy fer ye t' overwrite an area file 'n yer installat'n reus'n only th' buttons ye like.</p>
|
|
<p>Eg. ye can redefine th' predefined <em>end</em> area by add'n th' file <a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/area/end.html" rel="external" target="_self"><code>layouts/partials/topbar/area/end.html</code></a> 'n yer installat'n (not 'n th' theme itself) t' remove all but th' <em>more</em> button.</p>
|
|
<p>Th' below example sets an explicit value fer th' <code>onempty</code> parameter, overrid'n th' specific default value fer this button (these defaults vary depend'n on th' button). Th' parameter causes th' <em>more</em> button t' always be displayed instead o' hid'n once its rrrambl'n be empty.</p>
|
|
<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">"topbar/button/more.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">"onempty"</span> <span class="s">"disable"</span>
|
|
</span></span><span class="line"><span class="cl"><span class="p">)}}</span></span></span></code></pre></div><h2 id="defining-own-buttons">Defin'n own Buttons</h2>
|
|
<h3 id="button-types">Button Types</h3>
|
|
<p>Th' theme distinguishes between two types o' buttons:</p>
|
|
<ul>
|
|
<li><a href="/hugo-theme-relearn/pir/basics/topbar/index.html#button"><strong>button</strong></a>: a click'ble button that either browses t' another ship, triggers a user defined script or opens an overlay contain'n user defined rrrambl'n</li>
|
|
<li><a href="/hugo-theme-relearn/pir/basics/topbar/index.html#area-button"><strong>area-button</strong></a>: th' template fer th' <span class="btn cstyle transparent"><span><i class="fa-fw fas fa-ellipsis-v"></i></span></span> <em>more</em> button, t' define yer own area overlay buttons</li>
|
|
</ul>
|
|
<h3 id="button-parameter">Button Parameter</h3>
|
|
<h4 id="screen-widths-and-actions">Screen Widths an' Act'ns</h4>
|
|
<p>Depend'n on th' screen width ye can configure how th' button should behave. Screen width be divided into three classes:</p>
|
|
<ul>
|
|
<li><strong>s</strong>: (controlled by th' <code>onwidths</code> parameter) mobile layout whar' th' menu sidebar be hidden</li>
|
|
<li><strong>m</strong>: (controlled by th' <code>onwidthm</code> parameter) desktop layout wit' vis'ble sidebar while th' rrrambl'n area width still resizes</li>
|
|
<li><strong>l</strong>: (controlled by th' <code>onwidthl</code> parameter) desktop layout wit' vis'ble sidebar once th' rrrambl'n area reached its maximum width</li>
|
|
</ul>
|
|
<p>For each width class, ye can configure one o' th' follow'n act'ns:</p>
|
|
<ul>
|
|
<li><code>show</code>: th' button be displayed 'n its given area</li>
|
|
<li><code>hide</code>: th' button be removed</li>
|
|
<li><code>area-XXX</code>: th' button be moved from its given area into th' area <code>XXX</code>; eg. this be used t' move buttons t' th' <em>more</em> area overlay 'n th' mobile layout</li>
|
|
</ul>
|
|
<h4 id="hiding-and-disabling-stuff">Hid'n an' Disabl'n Stuff</h4>
|
|
<p>While hid'n a button depend'n on th' screen size can be configured wit' th' above described <em>hide</em> act'n, ye may want t' hide th' button on certain other condit'ns as well.</p>
|
|
<p>For example, th' <em>print</em> button 'n its default configurat'n should only be displayed if print support was configured. This be done 'n yer button template by check'n th' condit'ns first before display'n th' button (see <a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/button/print.html" rel="external" target="_self"><code>layouts/partials/topbar/button/print.html</code></a>).</p>
|
|
<p>Another preferred condit'n fer hid'n a button be, if th' displayed overlay be empty. This be th' case fer th' <em>toc</em> (see <a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/button/toc.html" rel="external" target="_self"><code>layouts/partials/topbar/button/toc.html</code></a>) as well as th' <em>more</em> button (see <a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/button/more.html" rel="external" target="_self"><code>layouts/partials/topbar/button/more.html</code></a>) an' controlled by th' parameter <code>onempty</code>.</p>
|
|
<p>This parameter can have one o' th' follow'n values:</p>
|
|
<ul>
|
|
<li><code>dis'ble</code>: th' button displayed 'n disabled state if th' overlay be empty</li>
|
|
<li><code>hide</code>: th' button be removed if th' overlay be empty</li>
|
|
</ul>
|
|
<p>If ye want t' dis'ble a button contain'n <em>no overlay</em>, this can be achieved by an empty <code>href</code> parameter. An example can be seen 'n th' <em>prev</em> button (see <code>layouts/partials/topbar/button/prev.html</code>) whar' th' URL fer th' previous ship may be empty.</p>
|
|
<h2 id="reference">Reference</h2>
|
|
<h3 id="button">Button</h3>
|
|
<p>Contains th' basic button functionality an' be used as a base implementat'n fer all other buttons (<a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/func/button.html" rel="external" target="_self"><code>layouts/partials/topbar/func/button.html</code></a>).</p>
|
|
<p>Call this from yer own button templates if ye want t' implement a button without an overlay like th' <em>print</em> button (<a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/button/print.html" rel="external" target="_self"><code>layouts/partials/topbar/button/print.html</code></a>) or wit' an overlay contain'n arbitrary rrrambl'n like th' <em>toc</em> button (<a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/button/toc.html" rel="external" target="_self"><code>layouts/partials/topbar/button/toc.html</code></a>).</p>
|
|
<p>For display'n an area 'n th' button’s overlay, see <a href="/hugo-theme-relearn/pir/basics/topbar/index.html#area-button">Area-Button</a>.</p>
|
|
<h4 id="parameter">Parameter</h4>
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>Name</th>
|
|
<th>Default</th>
|
|
<th>Notes</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td><strong>plank</strong></td>
|
|
<td><em><empty></em></td>
|
|
<td>Mandatory reference t' th' plank.</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>class</strong></td>
|
|
<td><em><empty></em></td>
|
|
<td>Mandatory unique class name fer this button. Display'n two buttons wit' th' same value fer <strong>class</strong> be undefined.</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>href</strong></td>
|
|
<td><em><empty></em></td>
|
|
<td>Either th' destinat'n URL fer th' button or JavaScript code t' be executed on click.<br><br>- if start'n wit' <code>javascript:</code> all follow'n text will be executed 'n yer browser<br>- every other str'n will be interpreted as URL<br>- if empty th' button will be displayed 'n disabled state regardless o' its <strong>rrrambl'n</strong></td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>ay'con</strong></td>
|
|
<td><em><empty></em></td>
|
|
<td><a href="/hugo-theme-relearn/pir/shortcodes/icon/index.html#finding-an-icon">Font Awesome ay'con name</a>.</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>onempty</strong></td>
|
|
<td><code>dis'ble</code></td>
|
|
<td>Defines what t' do wit' th' button if th' rrrambl'n parameter was set but ends up empty:<br><br>- <code>dis'ble</code>: Th' button be displayed 'n disabled state.<br>- <code>hide</code>: Th' button be removed.</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>onwidths</strong></td>
|
|
<td><code>show</code></td>
|
|
<td>Th' act'n, that should be executed if th' ship be displayed 'n th' given width:<br><br>- <code>show</code>: Th' button be displayed 'n its given area<br>- <code>hide</code>: Th' button be removed.<br>- <code>area-XXX</code>: Th' button be moved from its given area into th' area <code>XXX</code>.</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>onwidthm</strong></td>
|
|
<td><code>show</code></td>
|
|
<td>See above.</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>onwidthl</strong></td>
|
|
<td><code>show</code></td>
|
|
<td>See above.</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>hint</strong></td>
|
|
<td><em><empty></em></td>
|
|
<td>Arbitrary text displayed 'n th' tooltip.</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>title</strong></td>
|
|
<td><em><empty></em></td>
|
|
<td>Arbitrary text fer th' button.</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>rrrambl'n</strong></td>
|
|
<td><em><empty></em></td>
|
|
<td>Arbitrary HTML t' put into th' rrrambl'n overlay. This parameter may be empty. In this case no overlay will be generated.</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
<h3 id="area-button">Area-Button</h3>
|
|
<p>Contains th' basic functionality t' display area overlay buttons (<a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/func/area-button.html" rel="external" target="_self"><code>layouts/partials/topbar/func/area-button.html</code></a>).</p>
|
|
<p>Call this from yer own button templates if ye want t' implement a button wit' an area overlay like th' <em>more</em> button (<a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/button/more.html" rel="external" target="_self"><code>layouts/partials/topbar/button/more.html</code></a>).</p>
|
|
<h4 id="parameter-1">Parameter</h4>
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>Name</th>
|
|
<th>Default</th>
|
|
<th>Notes</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td><strong>plank</strong></td>
|
|
<td><em><empty></em></td>
|
|
<td>Mandatory reference t' th' plank.</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>area</strong></td>
|
|
<td><em><empty></em></td>
|
|
<td>Mandatory unique area name fer this area. Display'n two areas wit' th' same value fer <strong>area</strong> be undefined.</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>ay'con</strong></td>
|
|
<td><em><empty></em></td>
|
|
<td><a href="/hugo-theme-relearn/pir/shortcodes/icon/index.html#finding-an-icon">Font Awesome ay'con name</a>.</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>onempty</strong></td>
|
|
<td><code>dis'ble</code></td>
|
|
<td>Defines what t' do wit' th' button if th' rrrambl'n overlay be empty:<br><br>- <code>dis'ble</code>: Th' button be displayed 'n disabled state.<br>- <code>hide</code>: Th' button be removed.</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>onwidths</strong></td>
|
|
<td><code>show</code></td>
|
|
<td>Th' act'n, that should be executed if th' ship be displayed 'n th' given width:<br><br>- <code>show</code>: Th' button be displayed 'n its given area<br>- <code>hide</code>: Th' button be removed.<br>- <code>area-XXX</code>: Th' button be moved from its given area into th' area <code>XXX</code>.</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>onwidthm</strong></td>
|
|
<td><code>show</code></td>
|
|
<td>See above.</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>onwidthl</strong></td>
|
|
<td><code>show</code></td>
|
|
<td>See above.</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>hint</strong></td>
|
|
<td><em><empty></em></td>
|
|
<td>Arbitrary text displayed 'n th' tooltip.</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>title</strong></td>
|
|
<td><em><empty></em></td>
|
|
<td>Arbitrary text fer th' button.</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
<h3 id="predefined-buttons">Predefined Buttons</h3>
|
|
<p>Th' predefined buttons by th' theme (all other buttons besides th' <em>more</em> an' <em>toc</em> button 'n <a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/button" rel="external" target="_self"><code>layouts/partials/topbar/button</code></a>).</p>
|
|
<p>Call these from yer own redefined area templates if ye want t' use default button behavior.</p>
|
|
<p>Th' <code><varying></code> parameter values be different fer each button an' configured fer standard behavior as seen on this plank.</p>
|
|
<h4 id="parameter-2">Parameter</h4>
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>Name</th>
|
|
<th>Default</th>
|
|
<th>Notes</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td><strong>plank</strong></td>
|
|
<td><em><empty></em></td>
|
|
<td>Mandatory reference t' th' plank.</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>onwidths</strong></td>
|
|
<td><em><varying></em></td>
|
|
<td>Th' act'n, that should be executed if th' ship be displayed 'n th' given width:<br><br>- <code>show</code>: Th' button be displayed 'n its given area<br>- <code>hide</code>: Th' button be removed.<br>- <code>area-XXX</code>: Th' button be moved from its given area into th' area <code>XXX</code>.</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>onwidthm</strong></td>
|
|
<td><em><varying></em></td>
|
|
<td>See above.</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>onwidthl</strong></td>
|
|
<td><em><varying></em></td>
|
|
<td>See above.</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
<h3 id="predefined-overlay-buttons">Predefined Overlay-Buttons</h3>
|
|
<p>Th' predefined buttons by th' theme that open an overlay (the <em>more</em> an' <em>toc</em> button 'n <a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/button" rel="external" target="_self"><code>layouts/partials/topbar/button</code></a>).</p>
|
|
<p>Call these from yer own redefined area templates if ye want t' use default button behavior utiliz'n overlay functionality.</p>
|
|
<p>Th' <code><varying></code> parameter values be different fer each button an' configured fer standard behavior as seen on this plank.</p>
|
|
<h4 id="parameter-3">Parameter</h4>
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>Name</th>
|
|
<th>Default</th>
|
|
<th>Notes</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td><strong>plank</strong></td>
|
|
<td><em><empty></em></td>
|
|
<td>Mandatory reference t' th' plank.</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>onempty</strong></td>
|
|
<td><code>dis'ble</code></td>
|
|
<td>Defines what t' do wit' th' button if th' rrrambl'n overlay be empty:<br><br>- <code>dis'ble</code>: Th' button be displayed 'n disabled state.<br>- <code>hide</code>: Th' button be removed.</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>onwidths</strong></td>
|
|
<td><em><varying></em></td>
|
|
<td>Th' act'n, that should be executed if th' ship be displayed 'n th' given width:<br><br>- <code>show</code>: Th' button be displayed 'n its given area<br>- <code>hide</code>: Th' button be removed.<br>- <code>area-XXX</code>: Th' button be moved from its given area into th' area <code>XXX</code>.</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>onwidthm</strong></td>
|
|
<td><em><varying></em></td>
|
|
<td>See above.</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>onwidthl</strong></td>
|
|
<td><em><varying></em></td>
|
|
<td>See above.</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
|
|
|
|
<footer class="footline">
|
|
</footer>
|
|
</article>
|
|
|
|
</div>
|
|
</main>
|
|
</div>
|
|
<script src="/hugo-theme-relearn/js/clipboard.min.js?1725191907" defer></script>
|
|
<script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1725191907" defer></script>
|
|
<script src="/hugo-theme-relearn/js/theme.js?1725191907" defer></script>
|
|
</body>
|
|
</html>
|