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

1 files changed, 3 insertions, 2 deletions

diff --git a/src/view/com/modals/DeleteAccount.tsx b/src/view/com/modals/DeleteAccount.tsx
index b4933a1f2..98482457c 100644
--- a/src/view/com/modals/DeleteAccount.tsx
+++ b/src/view/com/modals/DeleteAccount.tsx
@@ -13,10 +13,10 @@ import {useStores} from 'state/index'
 import {s, colors, gradients} from 'lib/styles'
 import {usePalette} from 'lib/hooks/usePalette'
 import {useTheme} from 'lib/ThemeContext'
+import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
 import {ErrorMessage} from '../util/error/ErrorMessage'
 import {cleanError} from 'lib/strings/errors'
 import {resetToTab} from '../../../Navigation'
-import {isDesktopWeb} from 'platform/detection'
 
 export const snapPoints = ['60%']
 
@@ -24,6 +24,7 @@ export function Component({}: {}) {
   const pal = usePalette('default')
   const theme = useTheme()
   const store = useStores()
+  const {isMobile} = useWebMediaQueries()
   const [isEmailSent, setIsEmailSent] = React.useState<boolean>(false)
   const [confirmCode, setConfirmCode] = React.useState<string>('')
   const [password, setPassword] = React.useState<string>('')
@@ -78,7 +79,7 @@ export function Component({}: {}) {
               type="title-xl"
               numberOfLines={1}
               style={[
-                isDesktopWeb ? styles.titleDesktop : styles.titleMobile,
+                isMobile ? styles.titleMobile : styles.titleDesktop,
                 pal.text,
                 s.bold,
               ]}>