continues gap switch

This commit is contained in:
Aria Moradi 2021-03-28 04:03:46 +04:30
parent a567701639
commit 3a1e1e01dc
2 changed files with 18 additions and 0 deletions

View File

@ -25,6 +25,10 @@ const useStyles = (settings: IReaderSettings) => makeStyles({
backgroundColor: '#525252',
marginBottom: 10,
},
image: {
display: 'block',
marginBottom: settings.continuesPageGap ? '15px' : 0,
},
});
interface IProps {
@ -77,6 +81,7 @@ function LazyImage(props: IProps) {
return (
<img
className={classes.image}
ref={ref}
src={imageSrc}
alt={`Page #${index}`}
@ -100,6 +105,7 @@ export default function Page(props: IProps) {
<CircularProgress thickness={5} />
</div>
)}
once
>
<LazyImage
src={src}

View File

@ -140,11 +140,13 @@ const useStyles = (settings: IReaderSettings) => makeStyles((theme: Theme) => ({
export interface IReaderSettings{
staticNav: boolean
showPageNumber: boolean
continuesPageGap: boolean
}
export const defaultReaderSettings = () => ({
staticNav: false,
showPageNumber: true,
continuesPageGap: false,
} as IReaderSettings);
interface IProps {
@ -279,6 +281,16 @@ export default function ReaderNavBar(props: IProps) {
/>
</ListItemSecondaryAction>
</ListItem>
<ListItem>
<ListItemText primary="Continues Page gap" />
<ListItemSecondaryAction>
<Switch
edge="end"
checked={settings.continuesPageGap}
onChange={(e) => setSettingValue('continuesPageGap', e.target.checked)}
/>
</ListItemSecondaryAction>
</ListItem>
</List>
</Collapse>
<hr />