mirror/BookLore
1
0
Fork 0
mirror of https://github.com/adityachandelgit/BookLore.git synced 2026-01-06 10:29:46 -06:00
Code Issues Packages Projects Releases Wiki Activity

fix(book-card): indicate collapse series number on the library tooltip (#1800)

Browse Source 
Signed-off-by: Balázs Szücs <bszucs1209@gmail.com>
This commit is contained in:
Balázs Szücs
2025-12-09 21:25:26 +01:00
committed by GitHub
parent bf64abf318
commit c945c95e17
3 changed files with 29 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
booklore-ui/src/app/features/book/components/book-browser/book-browser.component.html
View File

@@ -4,21 +4,28 @@
<div class="flex items-center justify-between w-full gap-4 py-2 px-2 md:px-4 rounded-t-xl md:mb-4 mb-2 bg-[var(--card-background)] border-[1px] border-solid border-[var(--p-content-border-color)]">
<div class="flex items-center min-w-0 max-w-full flex-shrink">
@if (entityType$ | async; as entityType) {
<p class="text-xl whitespace-nowrap overflow-hidden text-ellipsis w-full">
@if (entityType === EntityType.ALL_BOOKS) {
@if (currentFilterLabel && rawFilterParamFromUrl) {
{{ currentFilterLabel }}
} @else if (isFilterActive || hasSearchTerm) {
{{ computedFilterLabel }}
<div class="flex flex-col gap-0.5">
<p class="text-xl whitespace-nowrap overflow-hidden text-ellipsis w-full">
@if (entityType === EntityType.ALL_BOOKS) {
@if (currentFilterLabel && rawFilterParamFromUrl) {
{{ currentFilterLabel }}
} @else if (isFilterActive || hasSearchTerm) {
{{ computedFilterLabel }}
} @else {
All Books
}
} @else if (entityType === EntityType.UNSHELVED) {
{{ (isFilterActive || hasSearchTerm) ? 'Unshelved Books (Filtered)' : 'Unshelved Books' }}
} @else {
All Books
{{ entityType }}: {{ (entity$ | async)?.name }}{{ (isFilterActive || hasSearchTerm) ? ' (Filtered)' : '' }}
}
} @else if (entityType === EntityType.UNSHELVED) {
{{ (isFilterActive || hasSearchTerm) ? 'Unshelved Books (Filtered)' : 'Unshelved Books' }}
} @else {
{{ entityType }}: {{ (entity$ | async)?.name }}{{ (isFilterActive || hasSearchTerm) ? ' (Filtered)' : '' }}
</p>
@if (seriesCollapseFilter.isSeriesCollapsed && (bookState$ | async)?.books; as books) {
<p class="text-sm text-gray-500">
Showing {{ books.length }} {{ books.length === 1 ? 'item' : 'items' }} (series collapsed)
</p>
}
</p>
</div>
@if (userService.userState$ | async; as userState) {
@if (entityType !== EntityType.ALL_BOOKS && entityType !== EntityType.UNSHELVED &&

4
booklore-ui/src/app/features/book/components/book-browser/book-card/book-card.component.html
View File

@@ -27,8 +27,8 @@
}
@if (book.seriesCount && book.seriesCount! >= 1) {
<div class="series-items-count-overlay">
{{ book.seriesCount }}
<div class="series-items-count-overlay" [pTooltip]="'Series collapsed: ' + book.seriesCount + ' books'" tooltipPosition="right">
<i class="pi pi-book" style="font-size: 0.65rem; margin-right: 2px;"></i>{{ book.seriesCount }}
</div>
}

12
booklore-ui/src/app/features/book/components/book-browser/book-card/book-card.component.scss
View File

@@ -165,14 +165,18 @@
background-color: var(--primary-color);
color: var(--primary-text-color-dark);
font-size: 0.75rem;
padding: 1px 6px;
border-radius: 3px;
padding: 3px 8px;
border-radius: 4px;
z-index: 3;
white-space: nowrap;
user-select: none;
font-weight: 600;
font-weight: 700;
text-align: center;
box-shadow: 0 0 4px rgba(0, 0, 0, 0.15);
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
border: 1px solid rgba(255, 255, 255, 0.2);
display: flex;
align-items: center;
gap: 2px;
}
.read-status-indicator {