From 25c62dfe56cf491f91c3b0c7f3b6db8dd4f88f96 Mon Sep 17 00:00:00 2001 From: Andrea Titolo Date: Fri, 27 Sep 2024 17:06:59 +0400 Subject: [PATCH 1/5] Add navbar for top-level navigation Adds a navbar through the "header" include. Navbar items are generated from "nav_main.yml" available in _data. Tweaks also the default pico default css to add some margins below the navbar and between navbar items, especially on mobile. --- _data/nav-main.yml | 8 ++++++++ _includes/header.html | 22 ++++++++++++++++++++++ _layouts/base.html | 9 ++------- css/styles.css | 11 +++++++++++ 4 files changed, 43 insertions(+), 7 deletions(-) create mode 100644 _data/nav-main.yml create mode 100644 _includes/header.html diff --git a/_data/nav-main.yml b/_data/nav-main.yml new file mode 100644 index 0000000..89182f8 --- /dev/null +++ b/_data/nav-main.yml @@ -0,0 +1,8 @@ +left: + - name: Home + link: / +right: + - name: About + link: /about/ + - name: OA Reference Guide + link: https://pad.riseup.net/p/BViBIy0MxHMFgA4OMS9p-keep \ No newline at end of file diff --git a/_includes/header.html b/_includes/header.html new file mode 100644 index 0000000..a394d89 --- /dev/null +++ b/_includes/header.html @@ -0,0 +1,22 @@ +
+ +
+

{{ site.title | escape }}

+

{{ site.description | escape }}

+
+
\ No newline at end of file diff --git a/_layouts/base.html b/_layouts/base.html index 00c780f..060b682 100644 --- a/_layouts/base.html +++ b/_layouts/base.html @@ -20,13 +20,8 @@ -
-
-

{{ site.title | escape }}

-

{{ site.description | escape }}

-
-
- + {% include header.html %} +
{{ content }}
diff --git a/css/styles.css b/css/styles.css index f9785cb..d25ecc7 100644 --- a/css/styles.css +++ b/css/styles.css @@ -1,3 +1,14 @@ +/* Nav */ +nav { + margin-bottom: 1rem; +} + +nav ul, +nav ol { + column-gap: 0.5rem; +} + +/* Others */ .center { text-align: center; } From e0184105a37adcb4d5d30d85500fae35dd8bbdd2 Mon Sep 17 00:00:00 2001 From: Andrea Titolo Date: Fri, 27 Sep 2024 17:23:59 +0400 Subject: [PATCH 2/5] Add aria elements to navbar Adds aria-label to the nav element and aria-current to current anchor in the navbar using liquid. --- _includes/header.html | 6 +++--- css/styles.css | 4 ++++ 2 files changed, 7 insertions(+), 3 deletions(-) diff --git a/_includes/header.html b/_includes/header.html index a394d89..7397476 100644 --- a/_includes/header.html +++ b/_includes/header.html @@ -1,16 +1,16 @@
-