software catalog
This commit is contained in:
@@ -0,0 +1,3 @@
|
||||
{{ define "main" }}
|
||||
{{ partial "render-sections.html" . }}
|
||||
{{ end }}
|
||||
@@ -0,0 +1,70 @@
|
||||
{{/*
|
||||
The software catalog: every page in content/software/, grouped by its
|
||||
`category` in the order of params.softwareGroups (hugo.toml). Each row
|
||||
links to the app's page and shows its tagline and where it's installed
|
||||
from. A filter box (progressive: hidden without JS) narrows the rows.
|
||||
*/}}
|
||||
{{ $s := . }}
|
||||
{{ $apps := (site.GetPage "/software").RegularPages }}
|
||||
{{ partial "sections/head.html" $s }}
|
||||
<div class="cat-tools">
|
||||
<nav class="cat-nav" aria-label="Software groups">
|
||||
{{ range site.Params.softwareGroups }}
|
||||
{{ $n := len (where $apps "Params.category" .name) }}
|
||||
{{ if $n }}<a href="#{{ .name | anchorize }}">{{ .name }}<span class="cat-count">{{ $n }}</span></a>{{ end }}
|
||||
{{ end }}
|
||||
</nav>
|
||||
<label class="cat-filter" hidden>
|
||||
<span class="visually-hidden">Filter the catalog</span>
|
||||
<input type="search" placeholder="Filter {{ len $apps }} titles…" autocomplete="off" spellcheck="false">
|
||||
</label>
|
||||
</div>
|
||||
<div class="catalog">
|
||||
{{ range site.Params.softwareGroups }}
|
||||
{{ $group := . }}
|
||||
{{ with where $apps "Params.category" $group.name }}
|
||||
<section class="cat-group" id="{{ $group.name | anchorize }}">
|
||||
<header class="cat-group-head">
|
||||
<h3>{{ $group.name }}</h3>
|
||||
{{ with $group.blurb }}<p>{{ . }}</p>{{ end }}
|
||||
</header>
|
||||
<ul class="cat-list">
|
||||
{{ range .ByTitle }}
|
||||
<li class="cat-row" data-search="{{ lower (delimit (slice .Title (.Params.tagline | default "") (.Params.package | default "") (delimit (.Params.replaces | default slice) " ")) " ") }}">
|
||||
<a class="cat-name" href="{{ .RelPermalink }}">{{ .Title }}</a>
|
||||
<span class="cat-desc">{{ .Params.tagline | markdownify }}</span>
|
||||
<span class="cat-src cat-src-{{ .Params.source | default "pacman" | urlize }}">{{ .Params.source | default "pacman" }}</span>
|
||||
</li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
</section>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
<p class="cat-none" hidden>Nothing matches. Try another word, or <a href="{{ "contribute/" | relURL }}">suggest a title</a>.</p>
|
||||
</div>
|
||||
{{ if $s.ctas }}<div class="cta-row">{{ partial "sections/ctas.html" $s.ctas }}</div>{{ end }}
|
||||
<script>
|
||||
(function () {
|
||||
var box = document.querySelector('.cat-filter');
|
||||
if (!box) return;
|
||||
box.hidden = false;
|
||||
var input = box.querySelector('input');
|
||||
var rows = document.querySelectorAll('.cat-row');
|
||||
var groups = document.querySelectorAll('.cat-group');
|
||||
var none = document.querySelector('.cat-none');
|
||||
input.addEventListener('input', function () {
|
||||
var words = input.value.toLowerCase().trim().split(/\s+/).filter(Boolean);
|
||||
rows.forEach(function (row) {
|
||||
var text = row.dataset.search;
|
||||
row.hidden = !words.every(function (w) { return text.indexOf(w) !== -1; });
|
||||
});
|
||||
var any = false;
|
||||
groups.forEach(function (g) {
|
||||
var shown = g.querySelector('.cat-row:not([hidden])');
|
||||
g.hidden = !shown;
|
||||
if (shown) any = true;
|
||||
});
|
||||
none.hidden = any;
|
||||
});
|
||||
})();
|
||||
</script>
|
||||
@@ -0,0 +1,63 @@
|
||||
{{/*
|
||||
One title in the software catalog (content/software/<name>.md). The
|
||||
header carries the facts from the front matter: where it's installed
|
||||
from, the package, the command, what it stands in for, and links to the
|
||||
project's website and source. The body is the page's Markdown, followed
|
||||
by the other titles in the same group.
|
||||
*/}}
|
||||
{{ define "main" }}
|
||||
{{ $p := . }}
|
||||
{{ $source := .Params.source | default "pacman" }}
|
||||
{{ $pkg := .Params.package }}
|
||||
{{ $pkgUrl := "" }}
|
||||
{{ with $pkg }}
|
||||
{{ if eq $source "pacman" }}{{ $pkgUrl = printf "https://archlinux.org/packages/?name=%s" . }}
|
||||
{{ else if eq $source "AUR" }}{{ $pkgUrl = printf "https://aur.archlinux.org/packages/%s" . }}
|
||||
{{ else if eq $source "Flathub" }}{{ $pkgUrl = printf "https://flathub.org/apps/%s" . }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
<header class="hero hero-compact has-visual app-hero">
|
||||
<div class="wrap hero-grid">
|
||||
<div class="hero-copy">
|
||||
<p class="note" data-reveal><span class="note-live" aria-hidden="true"></span><span class="note-text"><a href="{{ "software/" | relURL }}">Software</a> · {{ with .Params.category }}<a href="{{ "software/" | relURL }}#{{ . | anchorize }}">{{ . }}</a>{{ end }}</span></p>
|
||||
<h1 class="statement" data-reveal style="--d:80ms">{{ .Title }}</h1>
|
||||
{{ with .Params.tagline }}<p class="dek" data-reveal style="--d:140ms">{{ . | markdownify }}</p>{{ end }}
|
||||
{{ if or .Params.website .Params.code }}
|
||||
<div class="actions" data-reveal style="--d:200ms">
|
||||
{{ with .Params.website }}<a href="{{ . }}" class="btn btn-primary">Website<span class="arrow" aria-hidden="true">↗</span></a>{{ end }}
|
||||
{{ with .Params.code }}<a href="{{ . }}" class="btn btn-secondary">Source code<span class="arrow" aria-hidden="true">↗</span></a>{{ end }}
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
<dl class="app-facts" data-reveal style="--d:260ms">
|
||||
<div><dt>Installed from</dt><dd>{{ $source }}{{ with $pkg }} · {{ if $pkgUrl }}<a href="{{ $pkgUrl }}"><code>{{ . }}</code></a>{{ else }}<code>{{ . }}</code>{{ end }}{{ end }}</dd></div>
|
||||
{{ with .Params.command }}<div><dt>Run it</dt><dd><code>{{ . }}</code></dd></div>{{ end }}
|
||||
{{ with .Params.replaces }}<div><dt>Use instead of</dt><dd class="app-replaces">{{ range $i, $n := . }}{{ if $i }}<span class="sep">, </span>{{ end }}<s>{{ $n }}</s>{{ end }}</dd></div>{{ end }}
|
||||
{{ with .Params.website }}<div><dt>Website</dt><dd><a href="{{ . }}">{{ . | strings.TrimPrefix "https://" | strings.TrimPrefix "http://" | strings.TrimPrefix "www." | strings.TrimSuffix "/" }}</a></dd></div>{{ end }}
|
||||
{{ with .Params.code }}<div><dt>Source</dt><dd><a href="{{ . }}">{{ . | strings.TrimPrefix "https://" | strings.TrimSuffix "/" }}</a></dd></div>{{ end }}
|
||||
</dl>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<section class="section app-body">
|
||||
<div class="wrap app-layout">
|
||||
<article class="prose">
|
||||
{{ .Content }}
|
||||
{{ with .Params.links }}
|
||||
<h2 class="app-sub">Further reading</h2>
|
||||
<ul>{{ range . }}<li><a href="{{ .url }}">{{ .name }}</a></li>{{ end }}</ul>
|
||||
{{ end }}
|
||||
</article>
|
||||
{{ $others := where (where site.RegularPages "Section" "software") "Params.category" .Params.category }}
|
||||
<aside class="app-aside" aria-labelledby="more-in-group">
|
||||
<p class="eyebrow" id="more-in-group">More in {{ .Params.category }}</p>
|
||||
<ul class="app-others">
|
||||
{{ range $others.ByTitle }}
|
||||
<li{{ if eq .RelPermalink $p.RelPermalink }} aria-current="page"{{ end }}><a href="{{ .RelPermalink }}">{{ .Title }}</a></li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
<a class="more" href="{{ "software/" | relURL }}#catalog">The whole catalog<span class="arrow" aria-hidden="true">→</span></a>
|
||||
</aside>
|
||||
</div>
|
||||
</section>
|
||||
{{ end }}
|
||||
Reference in New Issue
Block a user