prehistoric-systems/omnivore
1
0
Fork 0
mirror of https://github.com/omnivore-app/omnivore.git synced 2026-03-11 08:54:26 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Make changes to PDF for mobile

Browse source
This commit is contained in:
Thomas Rogers 2024-12-14 14:45:31 +01:00
parent 39d6a612b6
commit 3215435494
4 changed files with 27 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
packages/web/components/patterns/HighlightBar.tsx
View file

@ -48,6 +48,7 @@ export function HighlightBar(props: HighlightBarProps): JSX.Element {
zIndex: 999,
...(props.displayAtBottom && {
bottom: 'calc(38px + env(safe-area-inset-bottom, 40px))',
left: `calc(50% - ${(props.isNewHighlight ? 295 : 323) / 2}px)`
}),
...(props.displayAtBottom && {
'@smDown': {

6
packages/web/components/templates/article/pdf.js/PdfToolbar.tsx
View file

@ -119,6 +119,9 @@ export default function PdfToolbar(props: PdfArticleToolbarProps): JSX.Element {
css={{
borderTopLeftRadius: '10px',
borderBottomLeftRadius: '10px',
'@media only screen and (min-device-width: 20em) and (max-device-width: 30em)': {
display: 'none'
}
}}
>
<CaretLeft />
@ -135,6 +138,9 @@ export default function PdfToolbar(props: PdfArticleToolbarProps): JSX.Element {
borderTopRightRadius: '10px',
borderBottomRightRadius: '10px',
backgroundColor: '$thBackground5',
'@media only screen and (min-device-width: 20em) and (max-device-width: 30em)': {
display: 'none'
}
}}
>
<CaretRight />

23
packages/web/components/templates/article/pdf.js/PdfViewer.tsx
View file

@ -307,15 +307,21 @@ export default function PdfViewer(props: PdfArticleContainerProps) {
}
if (props.containerRef?.current) {
props.containerRef.current.addEventListener(
'mouseup',
detectHighlightedText
)
const isTouch = isTouchScreenDevice()
props.containerRef.current.addEventListener(
'touchend',
detectHighlightedText
)
if (!isTouch) {
props.containerRef.current.addEventListener(
'mouseup',
detectHighlightedText
)
}
if (isTouch) {
props.containerRef.current.addEventListener(
'touchend',
detectHighlightedText
)
}
}
return () => {
@ -384,7 +390,6 @@ export default function PdfViewer(props: PdfArticleContainerProps) {
props.containerRef.current.clientHeight) /
props.containerRef.current.scrollHeight
console.log(currentPageNum, props.saveLatestPage)
await props.articleMutations.articleReadingProgressMutation({
id: props.article.id,
readingProgressTopPercent: bottomProgress * 100,

6
packages/web/components/templates/article/pdf.js/Style.tsx
View file

@ -35,6 +35,12 @@ export const PageInput = styled('input', {
borderLeft: '0px',
borderRight: '1px',
backgroundColor: '$thBackground5',
'@media only screen and (min-device-width: 20em) and (max-device-width: 30em)': {
paddingLeft: '1px',
paddingRight: '1px',
width: '20px',
border: '0px',
}
})
export const SearchInput = styled('input', {