diff --git a/.eleventy.js b/.eleventy.js index 7f1b6e4..663bd0f 100644 --- a/.eleventy.js +++ b/.eleventy.js @@ -3,6 +3,7 @@ const { DateTime } = require("luxon"); const gitlog = require("gitlog").default; let markdownIt = require("markdown-it"); const markdownItAttrs = require('markdown-it-attrs'); +const eleventyNavigationPlugin = require("@11ty/eleventy-navigation"); const markdownItOptions = { html: true, @@ -64,6 +65,9 @@ module.exports = function(eleventyConfig) { // Markdown-it eleventyConfig.setLibrary('md', markdownLib) + // Eleventy Navigation plugin for breadcrumb + eleventyConfig.addPlugin(eleventyNavigationPlugin); + }; diff --git a/_includes/components/breadcrumb.njk b/_includes/components/breadcrumb.njk new file mode 100644 index 0000000..ff7211e --- /dev/null +++ b/_includes/components/breadcrumb.njk @@ -0,0 +1,11 @@ +
+ {% set crumbs = collections.all | eleventyNavigationBreadcrumb(eleventyNavigation.key, { includeSelf: true }) %} + +
+ diff --git a/_includes/layout.njk b/_includes/layout.njk index a32cbcf..3e2834d 100644 --- a/_includes/layout.njk +++ b/_includes/layout.njk @@ -38,6 +38,8 @@

{{ pageTitle }}

+ {% include 'components/breadcrumb.njk' %} +
{{ content | safe }} diff --git a/_site/content/index.html b/_site/content/index.html index 5acdd00..ba66991 100644 --- a/_site/content/index.html +++ b/_site/content/index.html @@ -8,7 +8,7 @@ @@ -40,6 +40,23 @@

Our content platform

+
+ + +
+ + +
diff --git a/_site/fundraising/index.html b/_site/fundraising/index.html index 5cb50d0..6ca3edc 100644 --- a/_site/fundraising/index.html +++ b/_site/fundraising/index.html @@ -8,7 +8,7 @@ @@ -40,6 +40,23 @@

Our fundraising platform

+
+ + +
+ + +
diff --git a/_site/index.html b/_site/index.html index b57f70d..e652f54 100644 --- a/_site/index.html +++ b/_site/index.html @@ -8,7 +8,7 @@ @@ -40,6 +40,19 @@

Online platforms & standards

+
+ + +
+ + +
@@ -86,23 +99,23 @@

Our platforms

-

Services

-

How we are helping services reach more people.

+

Standards

+

How we build for success.

-

Fundraising

-

How we raise more money to help more people.

+

Content

+

How we use content to help, inform, and fundraise.

-

Content

-

How we use content to help, inform, and fundraise.

+

Fundraising

+

How we raise more money to help more people.

-

Standards

-

How we build for success.

+

Services

+

How we are helping services reach more people.

diff --git a/_site/services/index.html b/_site/services/index.html index d5514cd..25b2714 100644 --- a/_site/services/index.html +++ b/_site/services/index.html @@ -8,7 +8,7 @@ @@ -40,6 +40,23 @@

Our services platform

+
+ + +
+ + +
diff --git a/_site/standards/index.html b/_site/standards/index.html index e59490b..257b81f 100644 --- a/_site/standards/index.html +++ b/_site/standards/index.html @@ -8,7 +8,7 @@ @@ -40,6 +40,23 @@

Our standards platform

+
+ + +
+ + +
diff --git a/_site/standards/web-accessibility/index.html b/_site/standards/web-accessibility/index.html index c9e5b4b..7ee9c13 100644 --- a/_site/standards/web-accessibility/index.html +++ b/_site/standards/web-accessibility/index.html @@ -8,7 +8,7 @@ @@ -40,6 +40,27 @@

Web accessibility

+
+ + +
+ + +

It is a legal and moral obligation to make web content and functionality available to people with disabilities. This includes but is not limited to:

diff --git a/content/index.njk b/content/index.njk index 9cf8f39..6e233e6 100644 --- a/content/index.njk +++ b/content/index.njk @@ -10,6 +10,9 @@ tags: platform themeModifier: content extract: How we use content to help, inform, and fundraise. order: 3 +eleventyNavigation: + key: Content + parent: Home ---

Nothing here yet.

diff --git a/css/common.css b/css/common.css index 5ceb0fa..71f7c3c 100644 --- a/css/common.css +++ b/css/common.css @@ -48,3 +48,15 @@ [class*="hero--"] { color: white; } + +/* Breadcrumb */ +.breadcrumb { + display: flex; + gap: 1rem; +} + +.breadcrumb li:not(:last-child)::after { + color: var(--grey-medium); + content: "›"; + margin-inline-start: 1rem; +} diff --git a/css/elements.css b/css/elements.css index 1a4a840..0f07e8e 100644 --- a/css/elements.css +++ b/css/elements.css @@ -89,6 +89,7 @@ h3 { ul, ol { list-style: none; + margin: 0; padding: 0; } diff --git a/fundraising/index.njk b/fundraising/index.njk index d13ac62..897be1e 100644 --- a/fundraising/index.njk +++ b/fundraising/index.njk @@ -10,6 +10,9 @@ tags: platform themeModifier: fundraising extract: How we raise more money to help more people. order: 2 +eleventyNavigation: + key: Fundraising + parent: Home ---

Nothing here yet.

diff --git a/index.njk b/index.njk index b3218a0..d637982 100644 --- a/index.njk +++ b/index.njk @@ -4,6 +4,8 @@ title: Barnardo's online platforms and standards desc: The principles guiding the development of our online platforms pageTitle: Online platforms & standards pageTaxonomy: home +eleventyNavigation: + key: Home ---

An online platform is a set of shared components, tools, functions, services and documentation available for use across the organisation.

diff --git a/package-lock.json b/package-lock.json index bd78786..3362113 100644 --- a/package-lock.json +++ b/package-lock.json @@ -15,6 +15,7 @@ }, "devDependencies": { "@11ty/eleventy": "^1.0.1", + "@11ty/eleventy-navigation": "^0.3.3", "luxon": "^2.4.0", "stylelint": "^14.8.5", "stylelint-config-standard": "^25.0.0" @@ -78,6 +79,19 @@ "url": "https://opencollective.com/11ty" } }, + "node_modules/@11ty/eleventy-navigation": { + "version": "0.3.3", + "resolved": "https://registry.npmjs.org/@11ty/eleventy-navigation/-/eleventy-navigation-0.3.3.tgz", + "integrity": "sha512-O5C/NbDeTBnHQvDYZDr0Va6a7mEzifPUL1XRiqyKIAQqXZJsX/2K13PFLhX7t6kQRT1w6D0TSQyiT8skXbgWKA==", + "dev": true, + "dependencies": { + "dependency-graph": "^0.11.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/11ty" + } + }, "node_modules/@11ty/eleventy-utils": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/@11ty/eleventy-utils/-/eleventy-utils-1.0.1.tgz", @@ -4873,6 +4887,15 @@ "slugify": "^1.6.5" } }, + "@11ty/eleventy-navigation": { + "version": "0.3.3", + "resolved": "https://registry.npmjs.org/@11ty/eleventy-navigation/-/eleventy-navigation-0.3.3.tgz", + "integrity": "sha512-O5C/NbDeTBnHQvDYZDr0Va6a7mEzifPUL1XRiqyKIAQqXZJsX/2K13PFLhX7t6kQRT1w6D0TSQyiT8skXbgWKA==", + "dev": true, + "requires": { + "dependency-graph": "^0.11.0" + } + }, "@11ty/eleventy-utils": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/@11ty/eleventy-utils/-/eleventy-utils-1.0.1.tgz", diff --git a/package.json b/package.json index 8d4997d..1274d43 100644 --- a/package.json +++ b/package.json @@ -11,6 +11,7 @@ "license": "ISC", "devDependencies": { "@11ty/eleventy": "^1.0.1", + "@11ty/eleventy-navigation": "^0.3.3", "luxon": "^2.4.0", "stylelint": "^14.8.5", "stylelint-config-standard": "^25.0.0" diff --git a/services/index.njk b/services/index.njk index 12385f8..478069a 100644 --- a/services/index.njk +++ b/services/index.njk @@ -10,6 +10,9 @@ tags: platform themeModifier: services extract: How we are helping services reach more people. order: 1 +eleventyNavigation: + key: Services + parent: Home ---

Nothing here yet.

diff --git a/standards/accessibility.md b/standards/accessibility.md index a6ce90f..2892b5f 100644 --- a/standards/accessibility.md +++ b/standards/accessibility.md @@ -8,6 +8,9 @@ pageTaxonomy: content tags: standard extract: How we make sure people with disabilities can use our online products. themeModifier: standards +eleventyNavigation: + key: Web accessibility + parent: Standards --- It is a legal and moral obligation to make web content and functionality available to people with disabilities. This includes but is not limited to: diff --git a/standards/index.njk b/standards/index.njk index 103145a..010163d 100644 --- a/standards/index.njk +++ b/standards/index.njk @@ -10,6 +10,9 @@ tags: platform themeModifier: standards extract: How we build for success. order: 4 +eleventyNavigation: + key: Standards + parent: Home ---

If you are building a Barnardo's online product this is where you'll find the resources to make it to our standards.