From a4aefb765b44c548e0b8b319f78648b43e98791d Mon Sep 17 00:00:00 2001
From: Mischa POSLAWSKY <perl@shiar.org>
Date: Thu, 25 May 2017 19:18:54 +0200
Subject: [PATCH] index: link sections in columns

Appropriate HTML5 navigation element can be used safely because unstyled
MSIE versions does not support columns.  Column number hardcoded to enable
center-alignment.
---
 base.css  | 11 +++++++++++
 index.plp |  2 ++
 2 files changed, 13 insertions(+)

diff --git a/base.css b/base.css
index ec33cf7..5336d63 100644
--- a/base.css
+++ b/base.css
@@ -685,6 +685,17 @@ form.aside {
 	right: 1em;
 }
 
+#index nav {
+	columns: 3;
+	-moz-columns: 3;
+	-webkit-columns: 3;
+}
+nav > .section {
+	break-inside: avoid;
+	-webkit-column-break-inside: avoid; /* webkit */
+	page-break-inside: avoid; /* moz */
+}
+
 /* printing hints */
 
 @page {
diff --git a/index.plp b/index.plp
index f8a1938..3e997e3 100644
--- a/index.plp
+++ b/index.plp
@@ -32,6 +32,7 @@ if (open my $log, '-|', git => 'log', -1, @format) {{
 }}
 
 :>
+<nav>
 <div class="section">
 <h2>Keyboard maps</h2>
 <ul>
@@ -71,4 +72,5 @@ if (open my $log, '-|', git => 'log', -1, @format) {{
 <li><a href="/emoji">emoticons</a>
 </ul>
 </div>
+</nav>
 
-- 
2.30.0