AZEN-SGG/Kavita
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

New Year Bugs (#2513)

Browse source
This commit is contained in:
Joe Milazzo 2024-01-02 18:53:10 -06:00 • committed by GitHub
parent fcacd67d71
commit 5dfcccba7a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
32 changed files with 230 additions and 142 deletions
Download patch file Download diff file Expand all files Collapse all files

57
UI/Web/src/app/carousel/_components/carousel-reel/carousel-reel.component.html
View file

@ -1,30 +1,37 @@
<ng-container *transloco="let t; read: 'carousel-reel'">
<div class="carousel-container" *ngIf="items.length > 0 || alwaysShow">
<div>
<h3 (click)="sectionClicked($event)" [ngClass]="{'non-selectable': !clickableTitle}">
<a href="javascript:void(0)" class="section-title" >{{title}}</a>
<i *ngIf="iconClasses !== ''" class="{{iconClasses}} title-icon ms-1" aria-hidden="true"></i>
</h3>
<div class="float-end" *ngIf="swiper">
<button class="btn btn-icon" [disabled]="swiper.isBeginning" (click)="prevPage()"><i class="fa fa-angle-left" aria-hidden="true"></i><span class="visually-hidden">{{t('prev-items')}}</span></button>
<button class="btn btn-icon" [disabled]="swiper.isEnd" (click)="nextPage()"><i class="fa fa-angle-right" aria-hidden="true"></i><span class="visually-hidden">{{t('next-items')}}</span></button>
@if(alwaysShow || items && items.length > 0) {
<div class="carousel-container">
<div>
<h3 (click)="sectionClicked($event)" [ngClass]="{'non-selectable': !clickableTitle}">
<a href="javascript:void(0)" class="section-title" >{{title}}</a>
<i *ngIf="iconClasses !== ''" class="{{iconClasses}} title-icon ms-1" aria-hidden="true"></i>
</h3>
<div class="float-end" *ngIf="swiper">
<button class="btn btn-icon" [disabled]="swiper.isBeginning" (click)="prevPage()"><i class="fa fa-angle-left" aria-hidden="true"></i><span class="visually-hidden">{{t('prev-items')}}</span></button>
<button class="btn btn-icon" [disabled]="swiper.isEnd" (click)="nextPage()"><i class="fa fa-angle-right" aria-hidden="true"></i><span class="visually-hidden">{{t('next-items')}}</span></button>
</div>
</div>
@if (items.length > 0) {
<div>
<swiper
[slidesPerView]="'auto'"
(init)="onSwiper($event)"
[freeMode]="true">
<ng-template *ngFor="let item of items; index as i;" swiperSlide>
<ng-container [ngTemplateOutlet]="carouselItemTemplate" [ngTemplateOutletContext]="{ $implicit: item, idx: i }"></ng-container>
</ng-template>
<ng-container *ngIf="alwaysShow && items.length === 0">
<ng-template swiperSlide>
<ng-container [ngTemplateOutlet]="promptToAddTemplate"></ng-container>
</ng-template>
</ng-container>
</swiper>
</div>
}
</div>
<div>
<swiper
[slidesPerView]="'auto'"
(init)="onSwiper($event)"
[freeMode]="true">
<ng-template *ngFor="let item of items; index as i;" swiperSlide>
<ng-container [ngTemplateOutlet]="carouselItemTemplate" [ngTemplateOutletContext]="{ $implicit: item, idx: i }"></ng-container>
</ng-template>
<ng-container *ngIf="alwaysShow && items.length === 0">
<ng-template swiperSlide>
<ng-container [ngTemplateOutlet]="promptToAddTemplate"></ng-container>
</ng-template>
</ng-container>
</swiper>
</div>
</div>
}
</ng-container>