highperfocused/grimoire
1
0
Fork 0
mirror of https://github.com/purrgrammer/grimoire.git synced 2026-04-08 22:47:02 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix: prettify scrollbar, tweak height

Browse Source
This commit is contained in:
Alejandro Gómez
2026-03-03 21:57:00 +01:00
parent 8c9ecd574c
commit bcd58e40dd
2 changed files with 12 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/components/editor/EmojiSuggestionList.tsx
View File

@@ -120,7 +120,10 @@ export const EmojiSuggestionList = forwardRef<
);
}
const listHeight = Math.min(items.length, MAX_VISIBLE) * ITEM_HEIGHT;
const listHeight = Math.max(
Math.min(items.length, MAX_VISIBLE) * ITEM_HEIGHT,
ITEM_HEIGHT + 8,
);
return (
<div
@@ -131,10 +134,8 @@ export const EmojiSuggestionList = forwardRef<
ref={virtuosoRef}
totalCount={items.length}
fixedItemHeight={ITEM_HEIGHT}
style={{
height: listHeight,
overflow: items.length <= MAX_VISIBLE ? "hidden" : "auto",
}}
style={{ height: listHeight }}
className="overflow-y-auto [&::-webkit-scrollbar]:w-1 [&::-webkit-scrollbar-thumb]:rounded-full [&::-webkit-scrollbar-thumb]:bg-border/60 [&::-webkit-scrollbar-track]:bg-transparent"
itemContent={renderItem}
/>
</div>

11
src/components/editor/ProfileSuggestionList.tsx
View File

@@ -125,7 +125,10 @@ export const ProfileSuggestionList = forwardRef<
);
}
const listHeight = Math.min(items.length, MAX_VISIBLE) * ITEM_HEIGHT;
const listHeight = Math.max(
Math.min(items.length, MAX_VISIBLE) * ITEM_HEIGHT,
ITEM_HEIGHT + 8,
);
return (
<div
@@ -136,10 +139,8 @@ export const ProfileSuggestionList = forwardRef<
ref={virtuosoRef}
totalCount={items.length}
fixedItemHeight={ITEM_HEIGHT}
style={{
height: listHeight,
overflow: items.length <= MAX_VISIBLE ? "hidden" : "auto",
}}
style={{ height: listHeight }}
className="overflow-y-auto [&::-webkit-scrollbar]:w-1 [&::-webkit-scrollbar-thumb]:rounded-full [&::-webkit-scrollbar-thumb]:bg-border/60 [&::-webkit-scrollbar-track]:bg-transparent"
itemContent={renderItem}
/>
</div>