From 4a16bb5405b957a48b482d6cf2761bff7d723e02 Mon Sep 17 00:00:00 2001
From: Jannik ZANDER <jzander@grundfos.com>
Date: Mon, 6 Oct 2025 21:22:52 +0200
Subject: [PATCH] Flashing fix

---
 site/_includes/layouts/base.njk | 15 ++++++++++-----
 site/assets/styles.css          |  7 +++++++
 site/index.njk                  | 27 ++++++++++++++++++---------
 3 files changed, 35 insertions(+), 14 deletions(-)

diff --git a/site/_includes/layouts/base.njk b/site/_includes/layouts/base.njk
index ab79450..91137a3 100644
--- a/site/_includes/layouts/base.njk
+++ b/site/_includes/layouts/base.njk
@@ -9,11 +9,16 @@
 
   <!-- Brand theme color (green) -->
   <meta name="theme-color" content="#10a37f">
-  <!-- Theme color per mode -->
-  <!--
-  <meta name="theme-color" content="#1a1b1e" media="(prefers-color-scheme: dark)">
-  <meta name="theme-color" content="#f7f7f8" media="(prefers-color-scheme: light)">
-  -->
+
+  <script>
+    // If we’ve recently confirmed LAN, mark it before render
+    (function () {
+      if (document.cookie.includes('lan=1')) {
+        document.documentElement.classList.add('lan-yes');
+      }
+    })();
+  </script>
+
   <!-- LOAD YOUR CSS -->
   <link rel="stylesheet" href="/assets/styles.css?v=4">
 
diff --git a/site/assets/styles.css b/site/assets/styles.css
index d9e2485..3b44926 100644
--- a/site/assets/styles.css
+++ b/site/assets/styles.css
@@ -197,6 +197,13 @@ header{
 .card.is-lan {
   display: none;
 }
+
+/* If we know we’re on LAN, show them from first paint */
+.lan-yes .card.is-lan 
+{ 
+  display: flex; 
+}
+
 /* =================
    Footer
    ================= */
diff --git a/site/index.njk b/site/index.njk
index c011595..518fac1 100644
--- a/site/index.njk
+++ b/site/index.njk
@@ -102,14 +102,13 @@ title: zndr.dk — Services
 })();
 </script>
 
-
 <script>
 (function () {
-  const PING_URL = "https://lan.zndr.dk/ping";   // 200 only on LAN
+  const PING_URL = "https://lan.zndr.dk/ping"; // 200 on LAN
   const TIMEOUT_MS = 1500;
 
-  const lanCards = Array.from(document.querySelectorAll('.card[data-lan="true"]'));
-  if (!lanCards.length) { return; }
+  // If no LAN cards, skip
+  if (!document.querySelector('.card.is-lan')) return;
 
   const ctrl = new AbortController();
   const to = setTimeout(() => ctrl.abort(), TIMEOUT_MS);
@@ -117,17 +116,27 @@ title: zndr.dk — Services
   fetch(PING_URL, { signal: ctrl.signal, credentials: "omit", cache: "no-store" })
     .then(res => {
       clearTimeout(to);
+
       if (res.ok) {
-        // Home: ensure LAN-only cards are NOT red
-        lanCards.forEach(card => card.classList.remove('is-lan'));
-        // Re-run current filter so visibility matches the query (if any)
-        const input = document.getElementById('filter');
-        if (input) input.dispatchEvent(new Event('input', { bubbles: true }));
+        // Mark as LAN for this and future loads
+        document.documentElement.classList.add('lan-yes');
+        document.cookie = "lan=1; Max-Age=600; Path=/; SameSite=Lax";
+      } else {
+        document.documentElement.classList.remove('lan-yes');
+        document.cookie = "lan=; Max-Age=0; Path=/; SameSite=Lax";
       }
+
+      // If you have a live filter, re-apply it so visibility matches query
+      const input = document.getElementById('filter');
+      if (input) input.dispatchEvent(new Event('input', { bubbles: true }));
     })
     .catch(() => {
       clearTimeout(to);
+      // Treat as public
+      document.documentElement.classList.remove('lan-yes');
+      document.cookie = "lan=; Max-Age=0; Path=/; SameSite=Lax";
     });
 })();
 </script>
 
+
-- 
2.50.1