cleanup: finish .is-hidden migration in renderer-updates — all .style.display gone
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>
This commit is contained in:
parent
561a1568f0
commit
dd5efcbfe6
@ -24,9 +24,9 @@
|
|||||||
<div class="update-modal-eyebrow" id="updateModalEyebrow">Updates</div>
|
<div class="update-modal-eyebrow" id="updateModalEyebrow">Updates</div>
|
||||||
<h2 id="updateModalTitle">Update verfugbar</h2>
|
<h2 id="updateModalTitle">Update verfugbar</h2>
|
||||||
<p class="update-modal-message" id="updateModalMessage">Version 0.0.0 ist verfugbar. Jetzt herunterladen?</p>
|
<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">
|
<div class="update-changelog-header">
|
||||||
<span class="update-changelog-label" id="updateChangelogLabel">Changelog</span>
|
<span class="update-changelog-label" id="updateChangelogLabel">Changelog</span>
|
||||||
<button type="button" class="update-changelog-toggle" id="updateChangelogToggle" onclick="toggleUpdateChangelog()">Changelog anzeigen</button>
|
<button type="button" class="update-changelog-toggle" id="updateChangelogToggle" onclick="toggleUpdateChangelog()">Changelog anzeigen</button>
|
||||||
|
|||||||
@ -187,13 +187,13 @@ function renderUpdateChangelog(notes?: string): void {
|
|||||||
empty.hidden = true;
|
empty.hidden = true;
|
||||||
|
|
||||||
if (!normalized) {
|
if (!normalized) {
|
||||||
card.style.display = 'none';
|
card.classList.add('is-hidden');
|
||||||
panel.hidden = true;
|
panel.hidden = true;
|
||||||
updateChangelogExpanded = false;
|
updateChangelogExpanded = false;
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
card.style.display = 'block';
|
card.classList.remove('is-hidden');
|
||||||
|
|
||||||
const fragment = document.createDocumentFragment();
|
const fragment = document.createDocumentFragment();
|
||||||
let currentList: HTMLUListElement | null = null;
|
let currentList: HTMLUListElement | null = null;
|
||||||
@ -273,7 +273,7 @@ function renderUpdateChangelog(notes?: string): void {
|
|||||||
function refreshUpdateChangelogToggleText(): void {
|
function refreshUpdateChangelogToggleText(): void {
|
||||||
const toggle = byId<HTMLButtonElement>('updateChangelogToggle');
|
const toggle = byId<HTMLButtonElement>('updateChangelogToggle');
|
||||||
const card = byId<HTMLElement>('updateChangelogCard');
|
const card = byId<HTMLElement>('updateChangelogCard');
|
||||||
if (card.style.display === 'none') {
|
if (card.classList.contains('is-hidden')) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -299,14 +299,14 @@ function refreshUpdateModalTexts(): void {
|
|||||||
// already on disk and ready to install, hide the button.
|
// already on disk and ready to install, hide the button.
|
||||||
const skipBtn = byId<HTMLButtonElement>('updateModalSkipBtn');
|
const skipBtn = byId<HTMLButtonElement>('updateModalSkipBtn');
|
||||||
skipBtn.textContent = UI_TEXT.updates.modalSkipVersion;
|
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('updateChangelogLabel').textContent = UI_TEXT.updates.changelogLabel;
|
||||||
byId('updateChangelogEmpty').textContent = UI_TEXT.updates.noChangelog;
|
byId('updateChangelogEmpty').textContent = UI_TEXT.updates.noChangelog;
|
||||||
|
|
||||||
const metaText = getUpdateModalMetaText(info);
|
const metaText = getUpdateModalMetaText(info);
|
||||||
const meta = byId('updateModalMeta');
|
const meta = byId('updateModalMeta');
|
||||||
meta.textContent = metaText;
|
meta.textContent = metaText;
|
||||||
meta.style.display = metaText ? 'block' : 'none';
|
meta.classList.toggle('is-hidden', !metaText);
|
||||||
|
|
||||||
renderUpdateChangelog(info.releaseNotes);
|
renderUpdateChangelog(info.releaseNotes);
|
||||||
refreshUpdateChangelogToggleText();
|
refreshUpdateChangelogToggleText();
|
||||||
@ -349,7 +349,7 @@ function confirmUpdateModal(): void {
|
|||||||
|
|
||||||
function toggleUpdateChangelog(): void {
|
function toggleUpdateChangelog(): void {
|
||||||
const card = byId<HTMLElement>('updateChangelogCard');
|
const card = byId<HTMLElement>('updateChangelogCard');
|
||||||
if (card.style.display === 'none') {
|
if (card.classList.contains('is-hidden')) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -374,7 +374,7 @@ function refreshUpdateUiTexts(): void {
|
|||||||
} else if (updateBannerState === 'downloading') {
|
} else if (updateBannerState === 'downloading') {
|
||||||
button.textContent = UI_TEXT.updates.downloading;
|
button.textContent = UI_TEXT.updates.downloading;
|
||||||
button.disabled = true;
|
button.disabled = true;
|
||||||
progress.style.display = 'block';
|
progress.classList.remove('is-hidden');
|
||||||
if (latestDownloadProgress) {
|
if (latestDownloadProgress) {
|
||||||
bar.classList.remove('downloading');
|
bar.classList.remove('downloading');
|
||||||
bar.style.width = `${latestDownloadProgress.percent}%`;
|
bar.style.width = `${latestDownloadProgress.percent}%`;
|
||||||
@ -388,7 +388,7 @@ function refreshUpdateUiTexts(): void {
|
|||||||
setDownloadReadyUi(latestUpdateInfo);
|
setDownloadReadyUi(latestUpdateInfo);
|
||||||
} else {
|
} else {
|
||||||
hideUpdateBanner();
|
hideUpdateBanner();
|
||||||
progress.style.display = 'none';
|
progress.classList.add('is-hidden');
|
||||||
bar.classList.remove('downloading');
|
bar.classList.remove('downloading');
|
||||||
bar.style.width = '0%';
|
bar.style.width = '0%';
|
||||||
byId('updateText').textContent = UI_TEXT.updates.bannerDefault;
|
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)));
|
byId('updateProgressGauge').setAttribute('aria-valuenow', String(Math.round(progress.percent)));
|
||||||
|
|
||||||
showUpdateBanner();
|
showUpdateBanner();
|
||||||
byId('updateProgress').style.display = 'block';
|
byId('updateProgress').classList.remove('is-hidden');
|
||||||
|
|
||||||
const mb = (progress.transferred / 1024 / 1024).toFixed(1);
|
const mb = (progress.transferred / 1024 / 1024).toFixed(1);
|
||||||
const totalMb = (progress.total / 1024 / 1024).toFixed(1);
|
const totalMb = (progress.total / 1024 / 1024).toFixed(1);
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user