The list-mode book item used a fixed h-28 height. When a book belongs to a series, the title, authors, series, description, and progress row together exceed 112px and overflow, so the series and summary lines collide and get clipped. Larger system font scaling (such as the Android accessibility font size setting) inflates line heights and makes the overlap worse, which is what the reporter saw on a Pixel 10 Pro. Use min-h-28 instead so the row grows to fit its content. Non-series rows keep the same 112px height, and the list is virtualized with measured heights so variable row heights are fine. Co-authored-by: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -73,7 +73,7 @@ const BookItem: React.FC<BookItemProps> = ({
|
||||
className={clsx(
|
||||
'book-item flex',
|
||||
mode === 'grid' && 'h-full flex-col justify-end',
|
||||
mode === 'list' && 'h-28 flex-row gap-4 overflow-hidden',
|
||||
mode === 'list' && 'min-h-28 flex-row gap-4 overflow-hidden',
|
||||
mode === 'list' ? 'library-list-item' : 'library-grid-item',
|
||||
appService?.hasContextMenu ? 'cursor-pointer' : '',
|
||||
)}
|
||||
|
||||
Reference in New Issue
Block a user