Cutlery/Kavita
1
0
Fork 0
mirror of https://github.com/Kareadita/Kavita.git synced 2025-07-31 14:33:50 -04:00
Code Issues Packages Projects Releases Wiki Activity

Fixed an issue where scrollbar + tap to paginate in book reader would not allow the user to use mouse to scroll. (#1055)

Browse Source
This commit is contained in:
Joseph Milazzo 2022-02-11 06:15:09 -08:00 committed by GitHub
parent a8e7e00872
commit 91aa46855b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 16 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
UI/Web/src/app/book-reader/book-reader/book-reader.component.html
View File

@ -117,7 +117,7 @@
[innerHtml]="page" *ngIf="page !== undefined"></div> [innerHtml]="page" *ngIf="page !== undefined"></div>
<div class="left {{clickOverlayClass('left')}} no-observe" (click)="prevPage()" *ngIf="clickToPaginate" tabindex="-1"></div> <div class="left {{clickOverlayClass('left')}} no-observe" (click)="prevPage()" *ngIf="clickToPaginate" tabindex="-1"></div>
<div class="right {{clickOverlayClass('right')}} no-observe" (click)="nextPage()" *ngIf="clickToPaginate" tabindex="-1"></div> <div class="{{scrollbarNeeded ? 'right-with-scrollbar' : 'right'}} {{clickOverlayClass('right')}} no-observe" (click)="nextPage()" *ngIf="clickToPaginate" tabindex="-1"></div>
<div *ngIf="page !== undefined && scrollbarNeeded"> <div *ngIf="page !== undefined && scrollbarNeeded">
<ng-container [ngTemplateOutlet]="actionBar"></ng-container> <ng-container [ngTemplateOutlet]="actionBar"></ng-container>

17
UI/Web/src/app/book-reader/book-reader/book-reader.component.scss
View File

@ -202,9 +202,22 @@ $primary-color: #0062cc;
.right { .right {
position: fixed; position: fixed;
right: 0px; right: 0px; // with scrollbar: 17px
top: 0px; top: 0px;
width: 20%; width: 20%; // with scrollbar: 18%
height: 100%;
z-index: 2;
cursor: pointer;
opacity: 0;
background: transparent;
}
// This class pushes the click area to the left a bit to let users click the scrollbar
.right-with-scrollbar {
position: fixed;
right: 17px;
top: 0px;
width: 18%;
height: 100%; height: 100%;
z-index: 2; z-index: 2;
cursor: pointer; cursor: pointer;