Fix more layout
This commit is contained in:
@@ -14,6 +14,7 @@ import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
|
||||
import {useAnalytics} from 'lib/analytics/analytics'
|
||||
import {NavigationProp} from 'lib/routes/types'
|
||||
import {useSetDrawerOpen} from '#/state/shell'
|
||||
import {isWeb} from '#/platform/detection'
|
||||
|
||||
const BACK_HITSLOP = {left: 20, top: 20, right: 50, bottom: 20}
|
||||
|
||||
@@ -47,7 +48,14 @@ export function SimpleViewHeader({
|
||||
|
||||
const Container = isMobile ? View : CenteredView
|
||||
return (
|
||||
<Container style={[styles.header, isMobile && styles.headerMobile, style]}>
|
||||
<Container
|
||||
style={[
|
||||
styles.header,
|
||||
isMobile && styles.headerMobile,
|
||||
isWeb && styles.headerWeb,
|
||||
pal.view,
|
||||
style,
|
||||
]}>
|
||||
{showBackButton ? (
|
||||
<TouchableOpacity
|
||||
testID="viewHeaderDrawerBtn"
|
||||
@@ -89,6 +97,12 @@ const styles = StyleSheet.create({
|
||||
paddingHorizontal: 12,
|
||||
paddingVertical: 10,
|
||||
},
|
||||
headerWeb: {
|
||||
// @ts-ignore web-only
|
||||
position: 'sticky',
|
||||
top: 0,
|
||||
zIndex: 1,
|
||||
},
|
||||
backBtn: {
|
||||
width: 30,
|
||||
height: 30,
|
||||
|
||||
@@ -63,6 +63,7 @@ export const FlatList = React.forwardRef(function FlatListImpl<ItemT>(
|
||||
onScroll,
|
||||
ListHeaderComponent,
|
||||
ListFooterComponent,
|
||||
desktopFixedHeight,
|
||||
...props
|
||||
}: React.PropsWithChildren<FlatListProps<ItemT> & AddedProps>,
|
||||
ref: React.Ref<Animated.FlatList<ItemT>>,
|
||||
@@ -161,7 +162,12 @@ export const FlatList = React.forwardRef(function FlatListImpl<ItemT>(
|
||||
return (
|
||||
<Animated.ScrollView {...props} style={style} ref={nativeRef}>
|
||||
<View
|
||||
style={[styles.contentContainer, contentContainerStyle, pal.border]}>
|
||||
style={[
|
||||
styles.contentContainer,
|
||||
contentContainerStyle,
|
||||
desktopFixedHeight ? styles.minHeightViewport : null,
|
||||
pal.border,
|
||||
]}>
|
||||
{header}
|
||||
{(data as Array<ItemT>).map((item, index) => (
|
||||
<Row<ItemT>
|
||||
@@ -287,4 +293,8 @@ const styles = StyleSheet.create({
|
||||
// @ts-ignore web
|
||||
contentVisibility: 'auto',
|
||||
},
|
||||
minHeightViewport: {
|
||||
// @ts-ignore web only
|
||||
minHeight: '100vh',
|
||||
},
|
||||
})
|
||||
|
||||
Reference in New Issue
Block a user