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

Reader scroll area fix (#1257)

Browse source 
* Changes to make the pagination area scrollable (not working, debug code for Robbie)

* Adjusted the html to be easier to understand and more streamlined

* Fixed inability to scroll in manga reader over pagination areas for everything but the bottom bar

* Book reader now allows you to scroll over pagination area
This commit is contained in:
Joseph Milazzo 2022-05-15 14:34:53 -05:00 • committed by GitHub
parent ccb6414e9e
commit cdc4931770
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
8 changed files with 93 additions and 92 deletions
Download patch file Download diff file Expand all files Collapse all files

83
UI/Web/src/app/manga-reader/manga-reader.component.scss
View file

@ -159,52 +159,6 @@ img {
}
.right {
position: fixed;
right: 0px;
top: 0px;
width: $side-width;
height: 100vh;
background: rgba(0, 0, 0, 0);
z-index: 2;
cursor: pointer;
}
.top {
position: fixed;
right: 0px;
top: 0px;
width: 100%;
height: $side-width;
background: rgba(0, 0, 0, 0);
z-index: 2;
cursor: pointer;
}
.left {
position: fixed;
left: 0px;
top: 0px;
width: $side-width;
height: 100vh;
background: rgba(0, 0, 0, 0);
z-index: 2;
cursor: pointer;
}
.bottom {
position: fixed;
left: 0px;
bottom: 0px;
width: 100%;
height: $side-width;
background: rgba(0, 0, 0, 0);
z-index: 2;
cursor: pointer;
}
// Splitting Icon
.split {
height: 20px;
@ -295,14 +249,45 @@ img {
}
.pagination-area {
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
z-index: 2;
i {
color: white;
font-size: 42px;
}
.right {
position: absolute;
right: 0px;
top: 0px;
width: $side-width;
background: rgba(0, 0, 0, 0);
}
.top {
position: absolute;
right: 0px;
top: 0px;
width: 100%;
background: rgba(0, 0, 0, 0);
}
.left {
position: absolute;
left: 0px;
top: 0px;
width: $side-width;
background: rgba(0, 0, 0, 0);
}
.bottom {
position: fixed; // I couldn't figure out how to do this with abs, so only the bottom bar will not be scrollable
left: 0px;
bottom: 0px;
width: 100%;
background: rgba(0, 0, 0, 0);
}
}
.highlight {