Fix some bugs in tablet mode
This commit is contained in:
committed by
Samuel Newman
parent
f2249f5f78
commit
4a3450655d
@@ -1,7 +1,6 @@
|
|||||||
import React from 'react'
|
import React from 'react'
|
||||||
|
|
||||||
import {useWebMediaQueries} from '#/lib/hooks/useWebMediaQueries'
|
import {useWebMediaQueries} from '#/lib/hooks/useWebMediaQueries'
|
||||||
import {isNative} from '#/platform/detection'
|
|
||||||
|
|
||||||
export const withBreakpoints = <P extends object>(
|
export const withBreakpoints = <P extends object>(
|
||||||
Mobile: React.ComponentType<P>,
|
Mobile: React.ComponentType<P>,
|
||||||
@@ -9,12 +8,12 @@ export const withBreakpoints = <P extends object>(
|
|||||||
Desktop: React.ComponentType<P>,
|
Desktop: React.ComponentType<P>,
|
||||||
): React.FC<P> =>
|
): React.FC<P> =>
|
||||||
function WithBreakpoints(props: P) {
|
function WithBreakpoints(props: P) {
|
||||||
const {isMobile, isTabletOrMobile} = useWebMediaQueries()
|
const {isMobile, isTablet} = useWebMediaQueries()
|
||||||
|
|
||||||
if (isMobile || isNative) {
|
if (isMobile) {
|
||||||
return <Mobile {...props} />
|
return <Mobile {...props} />
|
||||||
}
|
}
|
||||||
if (isTabletOrMobile) {
|
if (isTablet) {
|
||||||
return <Tablet {...props} />
|
return <Tablet {...props} />
|
||||||
}
|
}
|
||||||
return <Desktop {...props} />
|
return <Desktop {...props} />
|
||||||
|
|||||||
@@ -81,10 +81,12 @@ const styles = StyleSheet.create({
|
|||||||
alignItems: 'center',
|
alignItems: 'center',
|
||||||
justifyContent: 'center',
|
justifyContent: 'center',
|
||||||
},
|
},
|
||||||
loadLatestInline: {
|
// @ts-ignore web only
|
||||||
// @ts-ignore web only
|
loadLatestInline: isWeb
|
||||||
left: 'calc(50vw - 282px)',
|
? {
|
||||||
},
|
left: 'calc(50vw - 282px)',
|
||||||
|
}
|
||||||
|
: {},
|
||||||
loadLatestOutOfLine: {
|
loadLatestOutOfLine: {
|
||||||
// @ts-ignore web only
|
// @ts-ignore web only
|
||||||
left: 'calc(50vw - 382px)',
|
left: 'calc(50vw - 382px)',
|
||||||
|
|||||||
Reference in New Issue
Block a user