From dd5efcbfe652b40d339c07f04f1fcecece6810a6 Mon Sep 17 00:00:00 2001
From: xRangerDE <xRangerDE@24-music.de>
Date: Mon, 11 May 2026 10:38:07 +0200
Subject: [PATCH] =?UTF-8?q?cleanup:=20finish=20.is-hidden=20migration=20in?=
 =?UTF-8?q?=20renderer-updates=20=E2=80=94=20all=20.style.display=20gone?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Completes the renderer-updates display-toggle migration started in 4.6.137. Five more elements (updateChangelogCard, updateModalSkipBtn, updateModalMeta, updateProgress in two more code paths) were still using inline .style.display / inline display checks. Each has been switched to:
- classList.add/remove/toggle('is-hidden') for writes
- classList.contains('is-hidden') for the two state-reads (refreshUpdateChangelogToggleText, toggleUpdateChangelog)

Plus the two remaining inline style="display:none;" HTML attributes (updateModalMeta + updateChangelogCard) moved to class="... is-hidden".

After this: renderer-updates.ts has zero .style.display references — the entire update-banner + update-modal visibility surface is class-driven.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 src/index.html          |  4 ++--
 src/renderer-updates.ts | 18 +++++++++---------
 2 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/src/index.html b/src/index.html
index 67639f9..3dbde24 100644
--- a/src/index.html
+++ b/src/index.html
@@ -24,9 +24,9 @@
             <div class="update-modal-eyebrow" id="updateModalEyebrow">Updates</div>
             <h2 id="updateModalTitle">Update verfugbar</h2>
             <p class="update-modal-message" id="updateModalMessage">Version 0.0.0 ist verfugbar. Jetzt herunterladen?</p>
-            <div class="update-modal-meta" id="updateModalMeta" style="display:none;"></div>
+            <div class="update-modal-meta is-hidden" id="updateModalMeta"></div>
 
-            <div class="update-changelog-card" id="updateChangelogCard" style="display:none;">
+            <div class="update-changelog-card is-hidden" id="updateChangelogCard">
                 <div class="update-changelog-header">
                     <span class="update-changelog-label" id="updateChangelogLabel">Changelog</span>
                     <button type="button" class="update-changelog-toggle" id="updateChangelogToggle" onclick="toggleUpdateChangelog()">Changelog anzeigen</button>
diff --git a/src/renderer-updates.ts b/src/renderer-updates.ts
index cb5c6c7..477cd1e 100644
--- a/src/renderer-updates.ts
+++ b/src/renderer-updates.ts
@@ -187,13 +187,13 @@ function renderUpdateChangelog(notes?: string): void {
     empty.hidden = true;
 
     if (!normalized) {
-        card.style.display = 'none';
+        card.classList.add('is-hidden');
         panel.hidden = true;
         updateChangelogExpanded = false;
         return;
     }
 
-    card.style.display = 'block';
+    card.classList.remove('is-hidden');
 
     const fragment = document.createDocumentFragment();
     let currentList: HTMLUListElement | null = null;
@@ -273,7 +273,7 @@ function renderUpdateChangelog(notes?: string): void {
 function refreshUpdateChangelogToggleText(): void {
     const toggle = byId<HTMLButtonElement>('updateChangelogToggle');
     const card = byId<HTMLElement>('updateChangelogCard');
-    if (card.style.display === 'none') {
+    if (card.classList.contains('is-hidden')) {
         return;
     }
 
@@ -299,14 +299,14 @@ function refreshUpdateModalTexts(): void {
     // already on disk and ready to install, hide the button.
     const skipBtn = byId<HTMLButtonElement>('updateModalSkipBtn');
     skipBtn.textContent = UI_TEXT.updates.modalSkipVersion;
-    skipBtn.style.display = isReady ? 'none' : '';
+    skipBtn.classList.toggle('is-hidden', isReady);
     byId('updateChangelogLabel').textContent = UI_TEXT.updates.changelogLabel;
     byId('updateChangelogEmpty').textContent = UI_TEXT.updates.noChangelog;
 
     const metaText = getUpdateModalMetaText(info);
     const meta = byId('updateModalMeta');
     meta.textContent = metaText;
-    meta.style.display = metaText ? 'block' : 'none';
+    meta.classList.toggle('is-hidden', !metaText);
 
     renderUpdateChangelog(info.releaseNotes);
     refreshUpdateChangelogToggleText();
@@ -349,7 +349,7 @@ function confirmUpdateModal(): void {
 
 function toggleUpdateChangelog(): void {
     const card = byId<HTMLElement>('updateChangelogCard');
-    if (card.style.display === 'none') {
+    if (card.classList.contains('is-hidden')) {
         return;
     }
 
@@ -374,7 +374,7 @@ function refreshUpdateUiTexts(): void {
     } else if (updateBannerState === 'downloading') {
         button.textContent = UI_TEXT.updates.downloading;
         button.disabled = true;
-        progress.style.display = 'block';
+        progress.classList.remove('is-hidden');
         if (latestDownloadProgress) {
             bar.classList.remove('downloading');
             bar.style.width = `${latestDownloadProgress.percent}%`;
@@ -388,7 +388,7 @@ function refreshUpdateUiTexts(): void {
         setDownloadReadyUi(latestUpdateInfo);
     } else {
         hideUpdateBanner();
-        progress.style.display = 'none';
+        progress.classList.add('is-hidden');
         bar.classList.remove('downloading');
         bar.style.width = '0%';
         byId('updateText').textContent = UI_TEXT.updates.bannerDefault;
@@ -580,7 +580,7 @@ window.api.onUpdateDownloadProgress((progress: UpdateDownloadProgress) => {
     byId('updateProgressGauge').setAttribute('aria-valuenow', String(Math.round(progress.percent)));
 
     showUpdateBanner();
-    byId('updateProgress').style.display = 'block';
+    byId('updateProgress').classList.remove('is-hidden');
 
     const mb = (progress.transferred / 1024 / 1024).toFixed(1);
     const totalMb = (progress.total / 1024 / 1024).toFixed(1);