diff --git a/src/lib/constants.ts b/src/lib/constants.ts index 72cba0b63c..062fc1aa84 100644 --- a/src/lib/constants.ts +++ b/src/lib/constants.ts @@ -67,3 +67,5 @@ export const DEV_SUGGESTED_FOLLOWS = ['alice', 'bob', 'carla'].map( export const POST_IMG_MAX_WIDTH = 2000 export const POST_IMG_MAX_HEIGHT = 2000 export const POST_IMG_MAX_SIZE = 1000000 + +export const DESKTOP_HEADER_HEIGHT = 57 diff --git a/src/lib/styles.ts b/src/lib/styles.ts index db6c036060..dd3c869106 100644 --- a/src/lib/styles.ts +++ b/src/lib/styles.ts @@ -1,5 +1,7 @@ import {StyleProp, StyleSheet, TextStyle} from 'react-native' import {Theme, TypographyVariant} from './ThemeContext' +import {isDesktopWeb} from 'platform/detection' +import {DESKTOP_HEADER_HEIGHT} from './constants' // 1 is lightest, 2 is light, 3 is mid, 4 is dark, 5 is darkest export const colors = { @@ -150,6 +152,9 @@ export const s = StyleSheet.create({ // dimensions w100pct: {width: '100%'}, h100pct: {height: '100%'}, + hContentRegion: isDesktopWeb + ? {height: `calc(100vh - ${DESKTOP_HEADER_HEIGHT}px)`} + : {height: '100%'}, // text align textLeft: {textAlign: 'left'}, diff --git a/src/view/com/login/Signin.tsx b/src/view/com/login/Signin.tsx index 9604a32f3a..78b24e68cc 100644 --- a/src/view/com/login/Signin.tsx +++ b/src/view/com/login/Signin.tsx @@ -482,9 +482,9 @@ const ForgotPasswordForm = ({ const [email, setEmail] = useState('') const {screen} = useAnalytics() - // useEffect(() => { - screen('Signin:ForgotPassword') - // }, [screen]) + useEffect(() => { + screen('Signin:ForgotPassword') + }, [screen]) const onPressSelectService = () => { store.shell.openModal({ diff --git a/src/view/com/notifications/Feed.tsx b/src/view/com/notifications/Feed.tsx index 5c1ee935bc..da48059b86 100644 --- a/src/view/com/notifications/Feed.tsx +++ b/src/view/com/notifications/Feed.tsx @@ -81,7 +81,7 @@ export const Feed = observer(function Feed({ ) return ( - + {view.isLoading && !data && } {view.hasError && ( diff --git a/src/view/com/post-thread/PostThread.tsx b/src/view/com/post-thread/PostThread.tsx index 0a092c46bb..a417012b09 100644 --- a/src/view/com/post-thread/PostThread.tsx +++ b/src/view/com/post-thread/PostThread.tsx @@ -95,7 +95,7 @@ export const PostThread = observer(function PostThread({ onRefresh={onRefresh} onLayout={onLayout} onScrollToIndexFailed={onScrollToIndexFailed} - style={s.h100pct} + style={s.hContentRegion} contentContainerStyle={s.contentContainer} /> ) diff --git a/src/view/com/posts/FeedItem.tsx b/src/view/com/posts/FeedItem.tsx index 9a652d3891..e7421a26d8 100644 --- a/src/view/com/posts/FeedItem.tsx +++ b/src/view/com/posts/FeedItem.tsx @@ -279,6 +279,7 @@ const styles = StyleSheet.create({ borderWidth: 1, borderRadius: 4, marginBottom: 10, + paddingBottom: 10, }, outerNoTop: { borderTopWidth: 0, diff --git a/src/view/com/util/Views.web.tsx b/src/view/com/util/Views.web.tsx index 3d9abd8938..1ffd7844c5 100644 --- a/src/view/com/util/Views.web.tsx +++ b/src/view/com/util/Views.web.tsx @@ -23,6 +23,7 @@ import { ViewProps, } from 'react-native' import {addStyle, colors} from 'lib/styles' +import {DESKTOP_HEADER_HEIGHT} from 'lib/constants' export function CenteredView({ style, @@ -78,7 +79,7 @@ const styles = StyleSheet.create({ }, containerScroll: { width: '100%', - height: '100%', + height: `calc(100vh - ${DESKTOP_HEADER_HEIGHT}px)`, maxWidth: 600, marginLeft: 'auto', marginRight: 'auto', diff --git a/src/view/screens/Debug.tsx b/src/view/screens/Debug.tsx index 09e3dd46a9..52a84c6491 100644 --- a/src/view/screens/Debug.tsx +++ b/src/view/screens/Debug.tsx @@ -73,7 +73,7 @@ function DebugInner({ const items = [{currentView}] return ( - + + { }, [visible, store, navIdx, screen, scrollToTop]) return ( - + { }, [visible, store.nav, store.log, store.shell, name, navIdx, view]) return ( - + - + diff --git a/src/view/screens/Search.web.tsx b/src/view/screens/Search.web.tsx index 38f7cefb83..b85ed946e7 100644 --- a/src/view/screens/Search.web.tsx +++ b/src/view/screens/Search.web.tsx @@ -84,7 +84,7 @@ export const Search = observer(({navIdx, visible, params}: ScreenParams) => { } return ( - + + - + diff --git a/src/view/shell/web/index.tsx b/src/view/shell/web/index.tsx index b9ae32f273..ae1a526a0f 100644 --- a/src/view/shell/web/index.tsx +++ b/src/view/shell/web/index.tsx @@ -52,7 +52,7 @@ export const WebShell: React.FC = observer(() => { {screenRenderDesc.screens.map(({Com, navIdx, params, key, current}) => ( + style={[s.hContentRegion, current ? styles.visible : styles.hidden]}>