From e173a4aa6d7b0334d28f648f2a2a18fc98f7d4b8 Mon Sep 17 00:00:00 2001
From: Lyn Fugmann <lyn.fugmann@ifsr.de>
Date: Sun, 15 Sep 2024 13:18:05 +0200
Subject: [PATCH 1/2] add eleventy-plugin-bundle
---
eleventy.config.js | 2 ++
package-lock.json | 20 +++++++++++++++++++-
package.json | 3 ++-
3 files changed, 23 insertions(+), 2 deletions(-)
diff --git a/eleventy.config.js b/eleventy.config.js
index 29ae4f8..9d67179 100644
--- a/eleventy.config.js
+++ b/eleventy.config.js
@@ -1,5 +1,6 @@
const { EleventyHtmlBasePlugin, EleventyI18nPlugin } = require("@11ty/eleventy");
const eleventyNavigationPlugin = require("@11ty/eleventy-navigation");
+const bundlerPlugin = require("@11ty/eleventy-plugin-bundle");
const fs = require('fs');
// update this :)
@@ -11,6 +12,7 @@ module.exports = function(eleventyConfig) {
eleventyConfig.addPlugin(EleventyI18nPlugin, {
defaultLanguage: "de",
});
+ eleventyConfig.addPlugin(bundlerPlugin);
eleventyConfig.addGlobalData("year", year);
diff --git a/package-lock.json b/package-lock.json
index d3bb57e..123cc79 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -10,7 +10,8 @@
"license": "MIT",
"devDependencies": {
"@11ty/eleventy": "^2.0.1",
- "@11ty/eleventy-navigation": "^0.3.5"
+ "@11ty/eleventy-navigation": "^0.3.5",
+ "@11ty/eleventy-plugin-bundle": "^1.0.5"
}
},
"node_modules/@11ty/dependency-tree": {
@@ -121,6 +122,23 @@
"url": "https://opencollective.com/11ty"
}
},
+ "node_modules/@11ty/eleventy-plugin-bundle": {
+ "version": "1.0.5",
+ "resolved": "https://registry.npmjs.org/@11ty/eleventy-plugin-bundle/-/eleventy-plugin-bundle-1.0.5.tgz",
+ "integrity": "sha512-Esv97j+mOo/yfxjaWl4j8CyszOBsRjU/DOUWOBqVnnDLM8VDXeus2LTJUxF70nAU0g+z+b6fRn8fKnm6b2a/UQ==",
+ "dev": true,
+ "license": "MIT",
+ "dependencies": {
+ "debug": "^4.3.4"
+ },
+ "engines": {
+ "node": ">=14"
+ },
+ "funding": {
+ "type": "opencollective",
+ "url": "https://opencollective.com/11ty"
+ }
+ },
"node_modules/@11ty/eleventy-utils": {
"version": "1.0.3",
"resolved": "https://registry.npmjs.org/@11ty/eleventy-utils/-/eleventy-utils-1.0.3.tgz",
diff --git a/package.json b/package.json
index acf74cb..9469e3f 100644
--- a/package.json
+++ b/package.json
@@ -11,6 +11,7 @@
"license": "MIT",
"devDependencies": {
"@11ty/eleventy": "^2.0.1",
- "@11ty/eleventy-navigation": "^0.3.5"
+ "@11ty/eleventy-navigation": "^0.3.5",
+ "@11ty/eleventy-plugin-bundle": "^1.0.5"
}
}
From 0b7680f38fe5434d143d311b51e3a2a0855d3cf7 Mon Sep 17 00:00:00 2001
From: Lyn Fugmann <lyn.fugmann@ifsr.de>
Date: Sun, 15 Sep 2024 14:58:59 +0200
Subject: [PATCH 2/2] basic header styles
---
_includes/header.njk | 35 +++++++++++++++++++++++++++++++----
_layouts/page.njk | 8 ++++++++
2 files changed, 39 insertions(+), 4 deletions(-)
diff --git a/_includes/header.njk b/_includes/header.njk
index 8e809ff..42567a6 100644
--- a/_includes/header.njk
+++ b/_includes/header.njk
@@ -1,6 +1,33 @@
<header>
- <a href="{{ "/" | locale_url }}" title="home">ESE Logo</a>
- <nav>
- {{ collections.mainNav | pageLang | eleventyNavigation | eleventyNavigationToHtml | safe }}
- </nav>
+ <div class="header-container">
+ <a href="{{ "/" | locale_url }}" title="home">ESE Logo</a>
+ <nav id="mainNav">
+ {{ collections.mainNav | pageLang | eleventyNavigation | eleventyNavigationToHtml | safe }}
+ </nav>
+ </div>
</header>
+
+{% css %}
+header {
+ position: sticky;
+ backdrop-filter: blur(5px);
+ background-color: #ffffffcc;
+ top: 0;
+ padding: 2rem 0;
+}
+.header-container {
+ max-width: 75rem;
+ margin-left: auto;
+ margin-right: auto;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+}
+#mainNav ul {
+ margin: 0;
+ padding: 0;
+}
+#mainNav li {
+ display: inline;
+}
+{% endcss %}
diff --git a/_layouts/page.njk b/_layouts/page.njk
index 3460971..4ea16b3 100644
--- a/_layouts/page.njk
+++ b/_layouts/page.njk
@@ -9,6 +9,7 @@ eleventyComputed:
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{% if title %}{{ title }} | {% endif %}ESE {{ year }}</title>
+ <link rel="stylesheet" href="{% getBundleFileUrl "css" %}">
</head>
<body>
{% include 'header.njk' %}
@@ -20,3 +21,10 @@ eleventyComputed:
{% include 'footer.njk' %}
</body>
</html>
+
+{% css %}
+body {
+ font-family: sans-serif;
+ margin: 0;
+}
+{% endcss %}