diff options
Diffstat (limited to 'packages/meshbay-hub/src/meshbay_hub/static/style.css')
| -rw-r--r-- | packages/meshbay-hub/src/meshbay_hub/static/style.css | 23 |
1 files changed, 23 insertions, 0 deletions
diff --git a/packages/meshbay-hub/src/meshbay_hub/static/style.css b/packages/meshbay-hub/src/meshbay_hub/static/style.css index 5987d1c..1ba0ef0 100644 --- a/packages/meshbay-hub/src/meshbay_hub/static/style.css +++ b/packages/meshbay-hub/src/meshbay_hub/static/style.css @@ -1522,6 +1522,29 @@ button:disabled { opacity: 0.5; cursor: not-allowed; } .group-header { margin-bottom: 10px; gap: 8px; } .group-tabs { margin-bottom: 10px; } .chat-messages { padding: 12px; } + + /* The transfers panel stops hanging off its button. + It is 330 px wide and anchored to the button's right edge, but that button + is not at the right edge of the screen — the bell and the user menu come + after it. So the panel extended past the left of the viewport: measured at + 138 px lost on a 320 px screen, 98 px at 360. What is cut is the left-hand + side, which is where the file names are, so what remained was a strip of + progress bars belonging to nothing. + Anchoring to the viewport instead of to the button is the only thing that + helps: capping the width does not, since the overflow comes from where the + right edge is pinned. */ + .transfer-panel { + position: fixed; + top: 52px; + right: 8px; + /* Full width on a phone, and no wider than the desktop panel on a tablet, + where stretching it across 768 px would be silly. Both edges are pinned + to the viewport, so the width follows from the screen rather than from + where the button happens to sit. */ + left: max(8px, calc(100vw - 428px)); + width: auto; + max-height: calc(100vh - 68px); + } } /* ── Notification bell ───────────────────────────────────────────────────── */ |