Update epub player styles and force pagination

This commit is contained in:
Bill Thornton 2020-11-22 02:31:48 -05:00
parent 629a279491
commit c4aebce2b1
2 changed files with 16 additions and 16 deletions

View File

@ -26,7 +26,7 @@ export class BookPlayer {
width: '100%',
height: '100%',
// TODO: Add option for scrolled-doc
flow: 'auto'
flow: 'paginated'
};
this.onDialogClosed = this.onDialogClosed.bind(this);
@ -146,8 +146,8 @@ export class BookPlayer {
elem.addEventListener('close', this.onDialogClosed, {once: true});
elem.querySelector('#btnBookplayerExit').addEventListener('click', this.onDialogClosed, {once: true});
elem.querySelector('#btnBookplayerToc').addEventListener('click', this.openTableOfContents);
elem.querySelector('#btnBookplayerPrev').addEventListener('click', this.prevChapter);
elem.querySelector('#btnBookplayerNext').addEventListener('click', this.nextChapter);
elem.querySelector('#btnBookplayerPrev')?.addEventListener('click', this.prevChapter);
elem.querySelector('#btnBookplayerNext')?.addEventListener('click', this.nextChapter);
}
bindEvents() {
@ -165,8 +165,8 @@ export class BookPlayer {
elem.removeEventListener('close', this.onDialogClosed);
elem.querySelector('#btnBookplayerExit').removeEventListener('click', this.onDialogClosed);
elem.querySelector('#btnBookplayerToc').removeEventListener('click', this.openTableOfContents);
elem.querySelector('#btnBookplayerPrev').removeEventListener('click', this.prevChapter);
elem.querySelector('#btnBookplayerNext').removeEventListener('click', this.nextChapter);
elem.querySelector('#btnBookplayerPrev')?.removeEventListener('click', this.prevChapter);
elem.querySelector('#btnBookplayerNext')?.removeEventListener('click', this.nextChapter);
}
unbindEvents() {

View File

@ -9,6 +9,16 @@
display: flex;
flex-direction: column;
.topButtons {
top: 0.5vh;
z-index: 1002;
position: absolute;
top: 0;
width: 100%;
color: #000;
opacity: .7;
}
.bookPlayerContainer {
flex-grow: 1;
}
@ -23,23 +33,13 @@
margin-right: 2vw;
}
.bookplayerButtonIcon {
color: black;
background-color: #fff;
}
.bookplayerErrorMsg {
text-align: center;
}
#btnBookplayerPrev {
margin: 0.5vh 0.5vh;
color: black;
}
#btnBookplayerPrev,
#btnBookplayerNext {
margin: 0.5vh 0.5vh;
color: black;
}
}