(airflow-site) branch fix-main-button created (now 003bf97151)

[sh...@apache.org]

This is an automated email from the ASF dual-hosted git repository.

shahar pushed a change to branch fix-main-button
in repository https://gitbox.apache.org/repos/asf/airflow-site.git


      at 003bf97151 Fix main button on prod and background on dev

This branch includes the following new commits:

     new 003bf97151 Fix main button on prod and background on dev

The 1 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails.  The revisions
listed as "add" were already present in the repository and have only
been added to this reference.

(airflow-site) 01/01: Fix main button on prod and background on dev

[sh...@apache.org]

This is an automated email from the ASF dual-hosted git repository.

shahar pushed a commit to branch fix-main-button
in repository https://gitbox.apache.org/repos/asf/airflow-site.git

commit 003bf97151b0acc085903644c1b880eea2ca4eec
Author: Shahar Epstein <60...@users.noreply.github.com>
AuthorDate: Sat Jan 3 17:15:28 2026 +0200

    Fix main button on prod and background on dev
---
 .../site/layouts/_partials/hooks/head-end.html     | 26 ++++++++++++++++++++++
 landing-pages/src/js/headerAnimation.js            | 15 +++++++++++++
 2 files changed, 41 insertions(+)

diff --git a/landing-pages/site/layouts/_partials/hooks/head-end.html b/landing-pages/site/layouts/_partials/hooks/head-end.html
index ab2839eca4..f0c89d9492 100644
--- a/landing-pages/site/layouts/_partials/hooks/head-end.html
+++ b/landing-pages/site/layouts/_partials/hooks/head-end.html
@@ -19,6 +19,32 @@
 
 <meta name="description" content="{{ .Description | default $.Site.Params.description }}" />
 
+{{/* Early theme initialization to prevent FOUC and ensure animation gets correct theme */}}
+{{ if .Site.Params.ui.showLightDarkModeMenu -}}
+<script>
+(function() {
+  'use strict';
+  const themeKey = 'td-color-theme';
+  const getStoredTheme = () => localStorage.getItem(themeKey);
+  const getPreferredTheme = () => {
+    const storedTheme = getStoredTheme();
+    if (storedTheme) {
+      return storedTheme;
+    }
+    return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+  };
+  const setTheme = theme => {
+    if (theme === 'auto') {
+      document.documentElement.setAttribute('data-bs-theme', (window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'));
+    } else {
+      document.documentElement.setAttribute('data-bs-theme', theme);
+    }
+  };
+  setTheme(getPreferredTheme());
+})();
+</script>
+{{ end -}}
+
 <!-- Matomo -->
 <script>
     var _paq = window._paq = window._paq || [];
diff --git a/landing-pages/src/js/headerAnimation.js b/landing-pages/src/js/headerAnimation.js
index 9b77f3a49d..9c13f5a459 100644
--- a/landing-pages/src/js/headerAnimation.js
+++ b/landing-pages/src/js/headerAnimation.js
@@ -253,6 +253,21 @@ export function initHeaderAnimation() {
         });
       };
 
+      // Listen for theme changes and redraw
+      const observer = new MutationObserver((mutations) => {
+        mutations.forEach((mutation) => {
+          if (mutation.type === 'attributes' && mutation.attributeName === 'data-bs-theme') {
+            // Theme changed, sketch.draw() will be called automatically on next frame
+            // No need to do anything here as p5 continuously calls draw()
+          }
+        });
+      });
+      
+      observer.observe(document.documentElement, {
+        attributes: true,
+        attributeFilter: ['data-bs-theme']
+      });
+
       sketch.windowResized = debounce(() => {
         const positionInfo = canvas.getBoundingClientRect();
         const vw = positionInfo.width; // viewport width