From be06075e9108f1023d5dbb1ae7e073a28db0437a Mon Sep 17 00:00:00 2001 From: Claude Date: Mon, 19 Oct 2026 05:39:55 +0000 Subject: [PATCH] Era bar: closable, remembered per browser; kit v=4 The 'phase 2 / back to phase 1' strip above the header gets a close button. Closing removes it and stores interimm-era-bar=closed in localStorage so it stays hidden on later visits. On phones the left label is hidden so the bar stays one line. Co-Authored-By: Claude Opus 5.5 Claude-Session: https://claude.ai/code/session_01QUNj9piTc2aGUUJFvN31tV --- archive/2219-signal/en/index.html | 4 ++-- archive/2219-signal/index.html | 4 ++-- drift/en/index.html | 4 ++-- drift/index.html | 4 ++-- en/index.html | 4 ++-- index.html | 4 ++-- kit/index.html | 4 ++-- kit/interimm.css | 5 +++++ kit/interimm.js | 11 ++++++++++- kit/nav.cn.json | 3 ++- kit/nav.en.json | 3 ++- pulsars/en/index.html | 4 ++-- pulsars/index.html | 4 ++-- script/convert/en/index.html | 4 ++-- script/convert/index.html | 4 ++-- script/dictionary/en/index.html | 4 ++-- script/dictionary/index.html | 4 ++-- script/en/index.html | 4 ++-- script/index.html | 4 ++-- signals/en/index.html | 4 ++-- signals/index.html | 4 ++-- 21 files changed, 53 insertions(+), 37 deletions(-) diff --git a/archive/2219-signal/en/index.html b/archive/2219-signal/en/index.html index c0e09ba..93dc435 100644 --- a/archive/2219-signal/en/index.html +++ b/archive/2219-signal/en/index.html @@ -9,9 +9,9 @@ - + - + diff --git a/archive/2219-signal/index.html b/archive/2219-signal/index.html index 2aaf1ac..4e9b280 100644 --- a/archive/2219-signal/index.html +++ b/archive/2219-signal/index.html @@ -9,9 +9,9 @@ - + - + diff --git a/drift/en/index.html b/drift/en/index.html index 0738455..66277ce 100644 --- a/drift/en/index.html +++ b/drift/en/index.html @@ -9,9 +9,9 @@ - + - + diff --git a/drift/index.html b/drift/index.html index e413916..6034933 100644 --- a/drift/index.html +++ b/drift/index.html @@ -9,9 +9,9 @@ - + - + diff --git a/en/index.html b/en/index.html index be82f0f..ff34047 100644 --- a/en/index.html +++ b/en/index.html @@ -10,9 +10,9 @@ - + - + diff --git a/index.html b/index.html index 0599f8a..d959ed0 100644 --- a/index.html +++ b/index.html @@ -10,9 +10,9 @@ - + - + diff --git a/kit/index.html b/kit/index.html index a89b535..b367b3c 100644 --- a/kit/index.html +++ b/kit/index.html @@ -484,8 +484,8 @@

Add it to a site

Story page

-
<link rel="stylesheet" href="https://interstellar.interimm.org/kit/interimm.css?v=3">
-<script src="https://interstellar.interimm.org/kit/interimm.js?v=3" defer></script>
+
<link rel="stylesheet" href="https://interstellar.interimm.org/kit/interimm.css?v=4">
+<script src="https://interstellar.interimm.org/kit/interimm.js?v=4" defer></script>
 
 <header class="site-header" data-interimm-header
         data-lang="en" data-current="signal">
diff --git a/kit/interimm.css b/kit/interimm.css
index 0c5723c..a13869a 100644
--- a/kit/interimm.css
+++ b/kit/interimm.css
@@ -233,6 +233,11 @@ ul, ol { margin: 0 0 1em; }
 .era-label { color: var(--muted); }
 .era-back { color: var(--us); text-decoration: none; }
 .era-back:hover { text-decoration: underline; }
+.era-back { margin-left: auto; }
+.era-close { flex: none; background: transparent; border: 0; color: var(--muted); font: inherit; font-size: 1rem; line-height: 1; padding: 0.15rem 0.35rem; cursor: pointer; }
+.era-close:hover { color: var(--text); }
+.era-label, .era-back { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
+@media (max-width: 560px) { .era-inner { flex-wrap: nowrap; } .era-label { display: none; } .era-back { margin-left: 0; } .era-close { margin-left: auto; } }
 .header-inner { display: flex; align-items: center; flex-wrap: wrap; gap: 0.5rem 1.25rem; min-height: 4rem; padding-block: 0.5rem; }
 
 .brand {
diff --git a/kit/interimm.js b/kit/interimm.js
index 75ad08e..8039b83 100644
--- a/kit/interimm.js
+++ b/kit/interimm.js
@@ -32,6 +32,7 @@
   const script = document.currentScript;
   const base = script ? new URL('.', script.src) : new URL('kit/', location.href);
 
+  const ERA_KEY = 'interimm-era-bar';
   const esc = (s) => String(s ?? '').replace(/[&<>"']/g, (c) => ({ '&': '&', '<': '<', '>': '>', '"': '"', "'": ''' })[c]);
 
   const GITHUB_ICON = '';
@@ -58,7 +59,10 @@
     }).join('');
     const langs = nav.languages.filter((l) => hasLang(header, l)).map((l) => `${esc(nav.labels.language)}: ${esc(l.name)}`).join('');
     // the era bar: which phase this is, and the way back to the one before (nav.era in nav..json)
-    const era = nav.era ? `
${esc(nav.era.label)}${nav.era.back ? `${esc(nav.era.back.name)}` : ''}
` : ''; + // it can be closed, and stays closed in this browser (localStorage key interimm-era-bar) + let closed = false; + try { closed = localStorage.getItem(ERA_KEY) === 'closed'; } catch { /* storage blocked: show it */ } + const era = nav.era && !closed ? `
${esc(nav.era.label)}${nav.era.back ? `${esc(nav.era.back.name)}` : ''}
` : ''; return `${era}
${brand(nav)}${site(header)} @@ -285,6 +289,11 @@ .then((r) => { if (!r.ok) throw new Error(r.status); return r.json(); }) .then((nav) => { if (header) header.innerHTML = renderHeader(header, nav, header.dataset.current); + const close = header && header.querySelector('.era-close'); + if (close) close.addEventListener('click', () => { + header.querySelector('.era-bar').remove(); + try { localStorage.setItem(ERA_KEY, 'closed'); } catch { /* storage blocked: closed for this page only */ } + }); if (footer) footer.innerHTML = renderFooter(nav, footer); }) .catch(() => { /* keep the page's own fallback markup */ }) diff --git a/kit/nav.cn.json b/kit/nav.cn.json index ccb20d7..3d72ff9 100644 --- a/kit/nav.cn.json +++ b/kit/nav.cn.json @@ -9,7 +9,8 @@ "menu": "菜单", "language": "语言", "backToTop": "回到顶部", - "kicker": "星际移民之书 · 恒星篇" + "kicker": "星际移民之书 · 恒星篇", + "close": "关闭" }, "menu": [ { diff --git a/kit/nav.en.json b/kit/nav.en.json index e5d4bc6..0699e29 100644 --- a/kit/nav.en.json +++ b/kit/nav.en.json @@ -9,7 +9,8 @@ "menu": "Menu", "language": "Language", "backToTop": "Back to top", - "kicker": "The Book of InterImm · Interstellar" + "kicker": "The Book of InterImm · Interstellar", + "close": "Close" }, "menu": [ { diff --git a/pulsars/en/index.html b/pulsars/en/index.html index e998cf1..41c8e52 100644 --- a/pulsars/en/index.html +++ b/pulsars/en/index.html @@ -9,9 +9,9 @@ - + - + diff --git a/pulsars/index.html b/pulsars/index.html index beb7a28..902f286 100644 --- a/pulsars/index.html +++ b/pulsars/index.html @@ -9,9 +9,9 @@ - + - + diff --git a/script/convert/en/index.html b/script/convert/en/index.html index e7a5f9d..1005803 100644 --- a/script/convert/en/index.html +++ b/script/convert/en/index.html @@ -9,9 +9,9 @@ - + - + diff --git a/script/convert/index.html b/script/convert/index.html index 5795178..f3d87d9 100644 --- a/script/convert/index.html +++ b/script/convert/index.html @@ -9,9 +9,9 @@ - + - + diff --git a/script/dictionary/en/index.html b/script/dictionary/en/index.html index 2425349..b4150bd 100644 --- a/script/dictionary/en/index.html +++ b/script/dictionary/en/index.html @@ -9,9 +9,9 @@ - + - + diff --git a/script/dictionary/index.html b/script/dictionary/index.html index d7669be..0436972 100644 --- a/script/dictionary/index.html +++ b/script/dictionary/index.html @@ -9,9 +9,9 @@ - + - + diff --git a/script/en/index.html b/script/en/index.html index bafb963..85f26e3 100644 --- a/script/en/index.html +++ b/script/en/index.html @@ -9,9 +9,9 @@ - + - + diff --git a/script/index.html b/script/index.html index 460e7a2..78696c0 100644 --- a/script/index.html +++ b/script/index.html @@ -9,9 +9,9 @@ - + - + diff --git a/signals/en/index.html b/signals/en/index.html index 5033fa3..bd8bc45 100644 --- a/signals/en/index.html +++ b/signals/en/index.html @@ -9,9 +9,9 @@ - + - + diff --git a/signals/index.html b/signals/index.html index a095ef2..472a0ce 100644 --- a/signals/index.html +++ b/signals/index.html @@ -9,9 +9,9 @@ - + - +