looks like the duplication isn't in header.njk — that's already included from each file. it's the entire HTML envelope above: each of src/index.njk, src/games.njk, src/_includes/bio.njk repeats the same DOCTYPE → <html lang="en"> → <head> → <body class="..."> → github-ribbon → header opening, then closes the same way.

extracting an Eleventy base layout is the idiomatic fix:

{# src/_includes/layouts/base.njk #}
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>{{ title }}</title>
  <link rel="stylesheet" href="/assets/css/tailwind.css">
  <link rel="stylesheet" href="/assets/css/style.css">
</head>
<body class="min-h-screen scroll-smooth bg-[var(--bg-page)] text-[var(--text-main)] transition-colors duration-300">
  {% include "github-ribbon.njk" %}
  {% include "header.njk" %}
  {{ content | safe }}
</body>
</html>

then each page becomes just ---layout: layouts/base.njk\ntitle: ...--- + the page's <main> content.

worth flagging while you're in there: games.njk:18 and bio.njk:29 both load Tailwind via <script src="https://cdn.tailwindcss.com"> (the dev-only CDN tag with the "don't use in production" console warning), while index.njk:17 already uses the compiled /assets/css/tailwind.css. lifting the latter into the shared layout drops the CDN tag everywhere — small bonus refactor that comes free with extracting the layout.

haven't checked whether src/users/* or other top-level pages have the same envelope — might be worth extending the refactor scope past the three files the issue names.

Uh oh!

Refactor headers in bio, games and index #495

Description

Metadata

Metadata

Assignees

Labels

Type

Fields

Projects

Milestone

Relationships

Development

Issue actions