aljaz/boris
1
1
Fork 0
mirror of https://github.com/dergigi/boris.git synced 2025-12-18 15:14:20 +01:00
Code Issues Packages Projects Releases Wiki Activity

fix: highlight button positioning with scroll

Browse Source 
Change button from absolute to fixed positioning so it appears at the correct location relative to selected text regardless of scroll position
This commit is contained in:
Gigi
2025-10-05 23:06:33 +01:00
parent 290d9303b5
commit f3a8cf1c23
3 changed files with 11 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
.cursor/rules/app-settings-and-nostr.mdc
View File

@@ -1,3 +1,9 @@
---
alwaysApply: true
description: when dealing with user and app settings
alwaysApply: false
---
We use nostr to load/save/sync our settings.
- https://nostrbook.dev/kinds/30078
- https://github.com/nostr-protocol/nips/blob/master/78.md

2
dist/index.html vendored
View File

@@ -5,7 +5,7 @@
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Boris - Nostr Bookmarks</title>
<script type="module" crossorigin src="/assets/index-CDSPBMvO.js"></script>
<script type="module" crossorigin src="/assets/index-DnVl8eXy.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-Bj-Uhit8.css">
</head>
<body>

5
src/components/HighlightButton.tsx
View File

@@ -39,7 +39,8 @@ export const HighlightButton = React.forwardRef<HighlightButtonRef, HighlightBut
if (buttonRef.current) {
const rect = range.getBoundingClientRect()
buttonRef.current.style.display = 'flex'
buttonRef.current.style.top = `${rect.bottom + window.scrollY + 8}px`
// Use fixed positioning relative to viewport, so it follows the scroll
buttonRef.current.style.top = `${rect.bottom + 8}px`
buttonRef.current.style.left = `${rect.left + rect.width / 2 - 20}px`
}
},
@@ -57,7 +58,7 @@ export const HighlightButton = React.forwardRef<HighlightButtonRef, HighlightBut
className="highlight-create-button"
style={{
display: 'none',
position: 'absolute',
position: 'fixed',
zIndex: 1000,
width: '40px',
height: '40px',