diff options
| author | Paul Frazee <pfrazee@gmail.com> | 2023-09-05 10:42:19 -0700 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2023-09-05 10:42:19 -0700 |
| commit | 764c7cd5694a41c98d8543b68d7791fa90db4291 (patch) | |
| tree | 8a11af0aa0e898cf7fb57ab0354f9fb5d28f004e /src/view/com/util/forms | |
| parent | be8084ae103064d5680485f25e202c763957f2b4 (diff) | |
| download | voidsky-764c7cd5694a41c98d8543b68d7791fa90db4291.tar.zst | |
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
Diffstat (limited to 'src/view/com/util/forms')
| -rw-r--r-- | src/view/com/util/forms/SelectableBtn.tsx | 12 |
1 files changed, 6 insertions, 6 deletions
diff --git a/src/view/com/util/forms/SelectableBtn.tsx b/src/view/com/util/forms/SelectableBtn.tsx index 4b494264e..f09d063a1 100644 --- a/src/view/com/util/forms/SelectableBtn.tsx +++ b/src/view/com/util/forms/SelectableBtn.tsx @@ -2,7 +2,7 @@ import React from 'react' import {Pressable, ViewStyle, StyleProp, StyleSheet} from 'react-native' import {Text} from '../text/Text' import {usePalette} from 'lib/hooks/usePalette' -import {isDesktopWeb} from 'platform/detection' +import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' interface SelectableBtnProps { testID?: string @@ -28,12 +28,16 @@ export function SelectableBtn({ const pal = usePalette('default') const palPrimary = usePalette('inverted') const needsWidthStyles = !style || !('width' in style || 'flex' in style) + const {isMobile} = useWebMediaQueries() return ( <Pressable testID={testID} style={[ styles.btn, - needsWidthStyles && styles.btnWidth, + needsWidthStyles && { + flex: isMobile ? 1 : undefined, + width: !isMobile ? 100 : undefined, + }, left && styles.btnLeft, right && styles.btnRight, pal.border, @@ -58,10 +62,6 @@ const styles = StyleSheet.create({ paddingHorizontal: 10, paddingVertical: 10, }, - btnWidth: { - flex: isDesktopWeb ? undefined : 1, - width: isDesktopWeb ? 100 : undefined, - }, btnLeft: { borderTopLeftRadius: 8, borderBottomLeftRadius: 8, |