Breadcrumb en kanarie-functie

This commit is contained in:
Michael Boelen 2023-05-15 15:26:10 +02:00
parent 6e9a89786e
commit 35d03b27ac
5 changed files with 39 additions and 2 deletions

View file

@ -9,5 +9,7 @@
timeZone = "Europe/Amsterdam"
# Grafisch
logo = "/assets/favicon.ico"
# Kanarie: Deze tekst (en vogel) gebruiken we om lege waardes op te sporen in output
textNoTitle = "Geen titel 🐦"
# EOF

View file

@ -0,0 +1,16 @@
.breadcrumb {
list-style: none;
display: flex;
flex-wrap: wrap;
align-items: baseline;
}
.breadcrumb li {
display: inline;
white-space: nowrap;
}
.breadcrumb li + li:before {
content: ">";
padding: 0.3rem;
}

View file

@ -2,11 +2,13 @@
<html{{ with site.LanguageCode | default site.Language.Lang }} lang="{{ . }}"{{ end }}>
{{ partial "head.html" . }}
<body>
<!-- Accessibility: skip-link voor mobiele apparaten -->
<a class="skip-link" href="#main">Ga naar hoofd</a>
<main id="main">
<div class="content">
<a href="/"><img src="/afbeeldingen/logo/nluug-logo.png" alt="NLUUG-logo" title="{{ .Site.Title }}"></a>
{{ partialCached "header.html" . }}
{{ partial "breadcrumb.html" . }}
<section>
<!-- <h2 class="post">{{ .Title }}</h2> -->
{{- block "main" . }}
@ -22,7 +24,7 @@
<ul>
{{ range .Pages }}
<li>
<a class="link" href="{{ .Permalink }}" title="{{ .Title }}">{{ .Title | default "Geen titel" }}</a>
<a class="link" href="{{ .Permalink }}" title="{{ .Title }}">{{ .Title | default .Site.Params.textNoTitle }}</a>
</li>
{{ end }}
</ul>

View file

@ -0,0 +1,16 @@
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
{{ range $index,$element := .Ancestors.Reverse }}
{{ if eq $index 0 }}
<li><a href="{{ .Permalink }}">🏠</a></li>
{{ else }}
<li>
<a href="{{ .Permalink }}">{{ .LinkTitle }}</a>
</li>
{{ end }}
{{ end }}
<li class="active">
<a aria-current="page" href="{{ .Permalink }}">{{ .LinkTitle }}</a>
</li>
</ol>
</nav>

View file

@ -1,3 +1,4 @@
{{ $styles := resources.Get "scss/styles.scss" | toCSS (dict "outputStyle" "compressed") | minify }}
{{ $styles_breadcrumb := resources.Get "scss/styles_breadcrumb.scss" | toCSS (dict "outputStyle" "compressed") | minify }}
{{ $styles_extra := resources.Get "scss/_extra.scss" | toCSS (dict "outputStyle" "compressed") | minify }}
<style>{{ $styles.Content | safeCSS }} {{ $styles_extra.Content | safeCSS }}</style>
<style>{{ $styles.Content | safeCSS }} {{ $styles_breadcrumb.Content | safeCSS }} {{ $styles_extra.Content | safeCSS }}</style>