Add dark mode toggle with localStorage persistence

[Copilot]

Implements dark mode switching using existing Bulmaswatch theme variants (journal/darkly) configured in config.yaml.

Changes

• Dynamic theme loading (layouts/_default/baseof.html)

  • Synchronous theme initialization from localStorage to prevent FOUC
  • getThemeUrl() helper for theme URL construction
  • toggleTheme() switches between light/dark, updates stylesheet href
  • updateThemeIcon() updates toggle button icon (moon ↔ sun)
  • XSS protection: validates localStorage value to only accept 'light' or 'dark'

• Toggle button (layouts/partials/menu.html)

  • Moon icon in light mode, sun icon in dark mode
  • Positioned after Facebook icon in navbar

Implementation notes

Uses document.write() intentionally for synchronous execution during page parse to avoid FOUC. Theme values from Hugo config are server-side safe; only user input (localStorage) is validated.

// Validates and defaults to light mode
var savedTheme = localStorage.getItem('theme');
var validTheme = (savedTheme === 'dark' || savedTheme === 'light') ? savedTheme : 'light';

Reference design showing dark mode implementation: 

Warning

Firewall rules blocked me from connecting to one or more addresses (expand for details)

I tried to connect to the following addresses, but was blocked by firewall rules:

• jenil.github.io
  • Triggering command: /usr/bin/curl curl -s REDACTED (dns block)

If you need me to access, download, or install something from one of these locations, you can either:

• Configure Actions setup steps to set up my environment, which run before the firewall is enabled
• Add the appropriate URLs or hosts to the custom allowlist in this repository's Copilot coding agent settings (admins only)

Original prompt

---

This section details on the original issue you should resolve

<issue_title>Feature Request: Dark Mode</issue_title>
<issue_description>Would love to be able to use this excellent resource in low light without burning my retinas. Please consider supporting dark mode!</issue_description>

<agent_instructions>Background information:

1. This is a hugo static generator based website.
2. The styles are based on bulma css.

</agent_instructions>

Comments on the Issue (you are @copilot in this section)

@emptymalei Hi @aadityabhatia Thanks for the issue.

This is a great idea. Will definitely do this on the next release.

@emptymalei Hi @aadityabhatia after some experiments, I realized that there is no elegant plugin and use solution for this. So I started developing a completely new theme using modern tech stack. @emptymalei Update:

I am very slow but making progress.

I am testing a new template: https://frameworks.leima.is/frameworks/

This is how it looks like:

This is the source code:
https://github.com/emptymalei/frameworks

Once this reaches a stage that is stable enough, I will replace the current template with it.

I would be very happy to hear feedbacks on this current draft.</comment_new>

• Fixes Feature Request: Dark Mode #97

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

[netlify]

✅ Deploy Preview for kausalflow-tools ready!

Name	Link
🔨 Latest commit	5622405
🔍 Latest deploy log	https://app.netlify.com/projects/kausalflow-tools/deploys/6948d385561fc40008144b6f
😎 Deploy Preview	https://deploy-preview-136--kausalflow-tools.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.