simon/mangareader
Archived
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Use flexbox for page layout
All checks were successful
continuous-integration/drone/push Build is passing
Details

Browse source
This commit is contained in:
Simon Bruder 2019-08-01 19:08:46 +00:00
parent 6eabe96a70
commit 97a736b37e
No known key found for this signature in database
GPG key ID: 6F03E0000CC5B62F
1 changed files with 3 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
frontend/src/views/Reader.vue
View file

@ -1,5 +1,5 @@
<template> <template>
<div class="reader" v-shortkey="{left: ['arrowleft'], right: ['arrowright']}" @shortkey="navigation" :style="{ 'grid-template-columns': showSidebar ? 'auto 250px' : 'auto' }"> <div class="reader" v-shortkey="{left: ['arrowleft'], right: ['arrowright']}" @shortkey="navigation">
<div> <div>
<img :style="{ width: pageWidth + '%' }" :src="info.pages[page]" @load="setScroll"> <img :style="{ width: pageWidth + '%' }" :src="info.pages[page]" @load="setScroll">
<!-- prefetching --> <!-- prefetching -->
@ -105,7 +105,7 @@ export default {
<style scoped> <style scoped>
.reader { .reader {
display: grid; display: flex;
position: relative; position: relative;
} }
@ -126,6 +126,7 @@ img {
} }
.sidebar { .sidebar {
flex: 0 0 250px;
background-color: #eee; background-color: #eee;
height: 100vh; height: 100vh;
position: sticky; position: sticky;