feat: implement dynamic error box visibility
Introduced a `.hidden` CSS class to control the visibility of elements and initially applied it to the error box, making it hidden by default. JavaScript logic was added to remove this class dynamically, allowing for the error box to be shown conditionally based on specific criteria. This change enhances user experience by preventing immediate display of error messages on page load, instead allowing for dynamic visibility control based on application state or user actions.
This commit is contained in:
parent
a8e856ba17
commit
010845611d
3 changed files with 9 additions and 3 deletions
|
@ -19,3 +19,6 @@ body {
|
|||
margin: 0;
|
||||
color: red;
|
||||
}
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
|
@ -8,7 +8,7 @@
|
|||
/>
|
||||
</head>
|
||||
<body>
|
||||
<div class="error-box">
|
||||
<div class="error-box hidden">
|
||||
<h1 class="mb-4">
|
||||
FATAL ERROR: <span class="browser"></span> Detected
|
||||
</h1>
|
||||
|
@ -18,14 +18,14 @@
|
|||
</p>
|
||||
<p class="mb-4">
|
||||
I apologize for the inaccessibility. As this site is now public I will
|
||||
be revisiting this bug to try and find a work around. If I fail, I
|
||||
be revisiting this bug to try and find a workaround. If I fail, I
|
||||
believe there is a PR currently in review for
|
||||
<span class="browser"></span> that attempts to fix the regression.
|
||||
Whether or not that will fix the bug is unknown. Updates will be posted
|
||||
here.
|
||||
</p>
|
||||
<p class="mb-4">
|
||||
In the mean time if you want to access this site you will need to use a
|
||||
In the meantime if you want to access this site you will need to use a
|
||||
different browser.
|
||||
</p>
|
||||
<p>Thank you - Kumi</p>
|
||||
|
|
|
@ -14,3 +14,6 @@ console.log(spans);
|
|||
spans.forEach((span) => {
|
||||
span.textContent = browser;
|
||||
});
|
||||
|
||||
const box = document.querySelector(".error-box");
|
||||
box.classList.remove("hidden");
|
Loading…
Reference in a new issue