Fix security reset UX: full-screen overlay, CSS class bug, and auto-reconnect
- Add security-reset-overlay HTML element to index.html that shows immediately
when the user confirms "Erase & Reset", before the synchronous API call runs
- Add .security-reset-overlay CSS to security.css (reuses reboot-card styles,
adds fade-in animation, z-index 1000 to sit above all other content)
- Fix reboot overlay class bug: classList.add("open") → classList.add("visible")
so the overlay actually renders per the .reboot-overlay.visible CSS rule
- Show overlay step text "Erasing data and resetting credentials…" during wipe,
update to "Reset complete. Rebooting now…" when API returns
- Call waitForServerReboot() (globally defined in update.js) after reset so the
page auto-reloads when the system comes back online
- Hide the security-reset-overlay and re-enable the button on error
Agent-Logs-Url: https://github.com/naturallaw777/staging_alpha/sessions/185d0b41-d54d-4ea2-93d6-bfb7c15b8aed
Co-authored-by: naturallaw777 <99053422+naturallaw777@users.noreply.github.com>
This commit is contained in:
committed by
GitHub
parent
5bb2c67b1b
commit
0fb532d46f
@@ -210,6 +210,25 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Security Reset overlay -->
|
||||
<div class="security-reset-overlay" id="security-reset-overlay">
|
||||
<div class="reboot-card">
|
||||
<div class="security-reset-overlay-icon">🛡</div>
|
||||
<h2 class="reboot-title">Security Reset In Progress</h2>
|
||||
<p class="reboot-message">
|
||||
⚠️ Wiping all data and credentials.<br />
|
||||
<strong>Do not power off your computer.</strong><br />
|
||||
This may take several minutes. The system will reboot automatically when complete.
|
||||
</p>
|
||||
<div class="reboot-dots">
|
||||
<span class="reboot-dot"></span>
|
||||
<span class="reboot-dot"></span>
|
||||
<span class="reboot-dot"></span>
|
||||
</div>
|
||||
<p class="reboot-submessage" id="security-reset-overlay-step">Erasing data and resetting credentials…</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Reboot overlay -->
|
||||
<div class="reboot-overlay" id="reboot-overlay">
|
||||
<div class="reboot-card">
|
||||
|
||||
Reference in New Issue
Block a user