sneak/AutistMask
1
0
Fork 0
Code Issues 1 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

fix: approve-tx/approve-sign error divs consistency with confirm-tx
All checks were successful
check / check (push) Successful in 22s
Details

Browse Source 
Add min-h-[1.25rem] and border styling to approve-tx-error and
approve-sign-error divs to prevent layout shift, matching the pattern
used by modal-password-error in confirm-tx view.

Replace direct DOM classList manipulation with showError()/hideError()
helpers from helpers.js for consistency.

Closes #84
This commit is contained in:
user
2026-02-28 13:13:23 -08:00
parent 3b6b18d168
commit 20ced62e1a
2 changed files with 16 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/popup/index.html
View File

@@ -1139,7 +1139,10 @@
class="border border-border p-1 w-full font-mono text-sm bg-bg text-fg" class="border border-border p-1 w-full font-mono text-sm bg-bg text-fg"
/> />
</div> </div>
<div id="approve-tx-error" class="text-xs hidden mb-2"></div> <div
id="approve-tx-error"
class="text-xs mb-2 border border-border border-dashed p-1 min-h-[1.25rem] hidden"
></div>
<div class="flex justify-between"> <div class="flex justify-between">
<button <button
id="btn-approve-tx" id="btn-approve-tx"
@@ -1202,7 +1205,10 @@
class="border border-border p-1 w-full font-mono text-sm bg-bg text-fg" class="border border-border p-1 w-full font-mono text-sm bg-bg text-fg"
/> />
</div> </div>
<div id="approve-sign-error" class="text-xs hidden mb-2"></div> <div
id="approve-sign-error"
class="text-xs mb-2 border border-border border-dashed p-1 min-h-[1.25rem] hidden"
></div>
<div class="flex justify-between"> <div class="flex justify-between">
<button <button
id="btn-approve-sign" id="btn-approve-sign"

17
src/popup/views/approval.js
View File

@@ -4,6 +4,8 @@ const {
addressTitle, addressTitle,
escapeHtml, escapeHtml,
showView, showView,
showError,
hideError,
} = require("./helpers"); } = require("./helpers");
const { state, saveState } = require("../../shared/state"); const { state, saveState } = require("../../shared/state");
const { formatEther, formatUnits, Interface, toUtf8String } = require("ethers"); const { formatEther, formatUnits, Interface, toUtf8String } = require("ethers");
@@ -342,7 +344,7 @@ function showSignApproval(details) {
} }
$("approve-sign-password").value = ""; $("approve-sign-password").value = "";
$("approve-sign-error").classList.add("hidden"); hideError("approve-sign-error");
$("btn-approve-sign").disabled = false; $("btn-approve-sign").disabled = false;
$("btn-approve-sign").classList.remove("text-muted"); $("btn-approve-sign").classList.remove("text-muted");
@@ -407,11 +409,10 @@ function init(ctx) {
$("btn-approve-tx").addEventListener("click", () => { $("btn-approve-tx").addEventListener("click", () => {
const password = $("approve-tx-password").value; const password = $("approve-tx-password").value;
if (!password) { if (!password) {
$("approve-tx-error").textContent = "Please enter your password."; showError("approve-tx-error", "Please enter your password.");
$("approve-tx-error").classList.remove("hidden");
return; return;
} }
$("approve-tx-error").classList.add("hidden"); hideError("approve-tx-error");
$("btn-approve-tx").disabled = true; $("btn-approve-tx").disabled = true;
$("btn-approve-tx").classList.add("text-muted"); $("btn-approve-tx").classList.add("text-muted");
@@ -447,11 +448,10 @@ function init(ctx) {
$("btn-approve-sign").addEventListener("click", () => { $("btn-approve-sign").addEventListener("click", () => {
const password = $("approve-sign-password").value; const password = $("approve-sign-password").value;
if (!password) { if (!password) {
$("approve-sign-error").textContent = "Please enter your password."; showError("approve-sign-error", "Please enter your password.");
$("approve-sign-error").classList.remove("hidden");
return; return;
} }
$("approve-sign-error").classList.add("hidden"); hideError("approve-sign-error");
$("btn-approve-sign").disabled = true; $("btn-approve-sign").disabled = true;
$("btn-approve-sign").classList.add("text-muted"); $("btn-approve-sign").classList.add("text-muted");
@@ -469,8 +469,7 @@ function init(ctx) {
} else { } else {
const msg = const msg =
(response && response.error) || "Signing failed."; (response && response.error) || "Signing failed.";
$("approve-sign-error").textContent = msg; showError("approve-sign-error", msg);
$("approve-sign-error").classList.remove("hidden");
$("btn-approve-sign").disabled = false; $("btn-approve-sign").disabled = false;
$("btn-approve-sign").classList.remove("text-muted"); $("btn-approve-sign").classList.remove("text-muted");
} }