External/beardrive
1
0
Fork 0
mirror of https://github.com/runbear-io/beardrive.git synced 2026-08-25 08:08:08 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix(web): search tooltip clipped by the sidebar edge — right-align it

Browse Source 
#sidebar is overflow:hidden; the centered card poked past its right edge.
The tooltip now grows leftward from the button, arrow anchored beneath it.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01VbiaaVM2ACxeRi8ySG9ybc
This commit is contained in:
Snow Lee
2026-07-19 11:27:01 -07:00
co-authored by Claude Fable 5
parent 3f974d96e4
commit 288b426e82
5 changed files with 8 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
internal/webapp/frontend/src/style.css
+5 -3
View File
@@ -221,7 +221,9 @@ button, input, a.btn { font-family: inherit; }
chip in a floating card below the button, arrow pointing up. */
.has-tip { position: relative; }
.has-tip .tip {
position: absolute; top: calc(100% + 8px); left: 50%; transform: translateX(-50%);
/* Right-aligned (not centered): the sidebar clips at its right edge
(overflow hidden), so the card must grow leftward from the button. */
position: absolute; top: calc(100% + 8px); right: -6px;
display: flex; align-items: center; gap: 7px; white-space: nowrap;
padding: 6px 9px; border-radius: 8px; border: 1px solid var(--border-2);
background: var(--surface); color: var(--text); font-size: 12.5px; font-weight: 500;
@@ -229,8 +231,8 @@ button, input, a.btn { font-family: inherit; }
opacity: 0; visibility: hidden; transition: opacity .12s ease .15s; z-index: 40;
}
.has-tip .tip::before {
content: ""; position: absolute; top: -4.5px; left: 50%;
width: 8px; height: 8px; transform: translateX(-50%) rotate(45deg);
content: ""; position: absolute; top: -4.5px; right: 16px;
width: 8px; height: 8px; transform: rotate(45deg);
background: var(--surface); border-left: 1px solid var(--border-2); border-top: 1px solid var(--border-2);
}
.has-tip:hover .tip, .has-tip:focus-visible .tip { opacity: 1; visibility: visible; }
internal/webapp/static/assets/index-4kYunG_6.css
-1
View File
File diff suppressed because one or more lines are too long
internal/webapp/static/assets/index-Ce0U9QAi.js → internal/webapp/static/assets/index-BOZlnkUa.js
View File
internal/webapp/static/assets/index-Ch-p2wBE.css
+1
View File
File diff suppressed because one or more lines are too long
internal/webapp/static/index.html
+2 -2
View File
@@ -5,8 +5,8 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>BearDrive</title>
<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>&#128059;</text></svg>">
<script type="module" crossorigin src="/assets/index-Ce0U9QAi.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-4kYunG_6.css">
<script type="module" crossorigin src="/assets/index-BOZlnkUa.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-Ch-p2wBE.css">
</head>
<body>
<div id="root"></div>