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

Fix horizontal overflow: overflow-x-hidden on body and app, remove shrink-0 from 42ch spans
All checks were successful
check / check (push) Successful in 13s
Details

Browse Source 
The 42ch fixed-width spans with shrink-0 prevented flex from shrinking
them when the container was narrower, causing horizontal scrolling.
Also added overflow-x: hidden on body and #app as a safety net.
This commit is contained in:
Jeffrey Paul
2026-02-26 02:29:11 +07:00
parent 3eeaa7a7b2
commit cef3d2ad37
4 changed files with 5 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/popup/index.html
View File

@@ -7,7 +7,7 @@
<link rel="stylesheet" href="styles.css" /> <link rel="stylesheet" href="styles.css" />
</head> </head>
<body class="bg-bg text-fg font-mono text-sm"> <body class="bg-bg text-fg font-mono text-sm">
<div id="app" class="p-2"> <div id="app" class="p-2 overflow-x-hidden">
<!-- ============ GLOBAL TITLE BAR ============ --> <!-- ============ GLOBAL TITLE BAR ============ -->
<div <div
class="flex justify-between items-center border-b border-border pb-1 mb-2" class="flex justify-between items-center border-b border-border pb-1 mb-2"
@@ -201,11 +201,7 @@
class="flex text-xs mb-3 cursor-pointer" class="flex text-xs mb-3 cursor-pointer"
title="Click to copy" title="Click to copy"
> >
<span <span id="address-full" style="width: 42ch"></span>
id="address-full"
class="shrink-0"
style="width: 42ch"
></span>
<span <span
id="address-usd-total" id="address-usd-total"
class="text-right text-muted flex-1" class="text-right text-muted flex-1"

1
src/popup/styles/main.css
View File

@@ -15,4 +15,5 @@
body { body {
width: 396px; width: 396px;
overflow-x: hidden;
} }

2
src/popup/views/helpers.js
View File

@@ -76,7 +76,7 @@ function balanceLine(symbol, amount, price) {
const usd = price ? formatUsd(amount * price) : ""; const usd = price ? formatUsd(amount * price) : "";
return ( return (
`<div class="flex text-xs">` + `<div class="flex text-xs">` +
`<span class="flex justify-between shrink-0" style="width:42ch">` + `<span class="flex justify-between" style="width:42ch">` +
`<span>${symbol}</span>` + `<span>${symbol}</span>` +
`<span>${qty}</span>` + `<span>${qty}</span>` +
`</span>` + `</span>` +

2
src/popup/views/home.js
View File

@@ -40,7 +40,7 @@ function render(ctx) {
} }
const addrUsd = formatUsd(getAddressValueUsd(addr)); const addrUsd = formatUsd(getAddressValueUsd(addr));
html += `<div class="flex text-xs">`; html += `<div class="flex text-xs">`;
html += `<span class="shrink-0" style="width:42ch">${addr.address}</span>`; html += `<span style="width:42ch">${addr.address}</span>`;
html += `<span class="text-right text-muted flex-1">${addrUsd}</span>`; html += `<span class="text-right text-muted flex-1">${addrUsd}</span>`;
html += `</div>`; html += `</div>`;
html += balanceLinesForAddress(addr); html += balanceLinesForAddress(addr);