Updates to use dynamic/responsive styles on web (#1351)

* Move most responsive queries to the hook

* Fix invalid CSS value

* Fixes to tablet render of post thread

* Fix overflow issues on web

* Fix search header on tablet

* Fix QP margin in web composer

* Fix: only apply double gutter once to flatlist (close #1368)

* Fix styles on discover feeds header

* Fix double discover links in multifeed
This commit is contained in:
Paul Frazee 2023-09-05 10:42:19 -07:00 committed by GitHub
parent be8084ae10
commit 764c7cd569
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
63 changed files with 762 additions and 461 deletions

View file

@ -18,7 +18,7 @@ import {useTheme} from 'lib/ThemeContext'
import {Text} from '../util/text/Text'
import LinearGradient from 'react-native-linear-gradient'
import {useStores} from 'state/index'
import {isDesktopWeb, isAndroid} from 'platform/detection'
import {isAndroid, isWeb} from 'platform/detection'
import {ImageModel} from 'state/models/media/image'
export const snapPoints = ['fullscreen']
@ -35,7 +35,7 @@ export function Component({image}: Props) {
const windim = useWindowDimensions()
const imageStyles = useMemo<ImageStyle>(() => {
const maxWidth = isDesktopWeb ? 450 : windim.width
const maxWidth = isWeb ? 450 : windim.width
if (image.height > image.width) {
return {
resizeMode: 'contain',
@ -137,12 +137,12 @@ const styles = StyleSheet.create({
flex: 1,
height: '100%',
width: '100%',
paddingVertical: isDesktopWeb ? 0 : 18,
paddingVertical: isWeb ? 0 : 18,
},
scrollContainer: {
flex: 1,
height: '100%',
paddingHorizontal: isDesktopWeb ? 0 : 12,
paddingHorizontal: isWeb ? 0 : 12,
},
scrollInner: {
gap: 12,