mirror of
https://github.com/Kareadita/Kavita.git
synced 2026-02-25 20:50:03 -05:00
48 lines
2.3 KiB
HTML
48 lines
2.3 KiB
HTML
<ng-container *transloco="let t; read: 'related-tab'">
|
|
<div class="pb-2">
|
|
@if (relations.length > 0) {
|
|
<app-carousel-reel [items]="relations" [title]="t('relations-title')">
|
|
<ng-template #carouselItem let-item>
|
|
<app-series-card class="col-auto mt-2 mb-2" [series]="item.series" [libraryId]="item.series.libraryId" [relation]="item.relation"></app-series-card>
|
|
</ng-template>
|
|
</app-carousel-reel>
|
|
}
|
|
|
|
@if (collections.length > 0) {
|
|
<app-carousel-reel [items]="collections" [title]="t('collections-title')">
|
|
<ng-template #carouselItem let-item>
|
|
<app-card-item [title]="item.title" [entity]="item"
|
|
[count]="item.itemCount"
|
|
[suppressLibraryLink]="true" [imageUrl]="imageService.getCollectionCoverImage(item.id)"
|
|
(clicked)="openCollection(item)" [linkUrl]="'/collections/' + item.id" [showFormat]="false"></app-card-item>
|
|
</ng-template>
|
|
</app-carousel-reel>
|
|
}
|
|
|
|
|
|
@if (readingLists.length > 0) {
|
|
<app-carousel-reel [items]="readingLists" [title]="t('reading-lists-title')">
|
|
<ng-template #carouselItem let-item>
|
|
<app-card-item [title]="item.title" [entity]="item"
|
|
[count]="item.itemCount"
|
|
[suppressLibraryLink]="true" [imageUrl]="imageService.getReadingListCoverImage(item.id)"
|
|
(clicked)="openReadingList(item)" [linkUrl]="'/lists/' + item.id" [showFormat]="false"></app-card-item>
|
|
</ng-template>
|
|
</app-carousel-reel>
|
|
}
|
|
|
|
@if (bookmarks.length > 0) {
|
|
<app-carousel-reel [items]="bookmarks" [title]="t('bookmarks-title')">
|
|
<ng-template #carouselItem let-item>
|
|
<app-card-item [entity]="item" [title]="t('bookmarks-title')" [imageUrl]="imageService.getSeriesCoverImage(item.seriesId)"
|
|
[suppressArchiveWarning]="true"
|
|
[linkUrl]="'/library/' + libraryId + '/series/' + item.seriesId + '/manga/0?bookmarkMode=true'"
|
|
(clicked)="viewBookmark(item)"
|
|
[count]="bookmarks.length"
|
|
[allowSelection]="false"></app-card-item>
|
|
</ng-template>
|
|
</app-carousel-reel>
|
|
}
|
|
</div>
|
|
</ng-container>
|