Updates InviteCodes modal to use dynamic/responsive styles on web (#1502)

1 files changed, 10 insertions, 1 deletions

diff --git a/src/view/com/modals/InviteCodes.tsx b/src/view/com/modals/InviteCodes.tsx
index 33ffc86a2..09cfd4de7 100644
--- a/src/view/com/modals/InviteCodes.tsx
+++ b/src/view/com/modals/InviteCodes.tsx
@@ -13,12 +13,14 @@ import {useStores} from 'state/index'
 import {ScrollView} from './util'
 import {usePalette} from 'lib/hooks/usePalette'
 import {isWeb} from 'platform/detection'
+import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
 
 export const snapPoints = ['70%']
 
 export function Component({}: {}) {
   const pal = usePalette('default')
   const store = useStores()
+  const {isTabletOrDesktop} = useWebMediaQueries()
 
   const onClose = React.useCallback(() => {
     store.shell.closeModal()
@@ -34,7 +36,11 @@ export function Component({}: {}) {
           </Text>
         </View>
         <View style={styles.flex1} />
-        <View style={styles.btnContainer}>
+        <View
+          style={[
+            styles.btnContainer,
+            isTabletOrDesktop && styles.btnContainerDesktop,
+          ]}>
           <Button
             type="primary"
             label="Done"
@@ -186,6 +192,9 @@ const styles = StyleSheet.create({
     flexDirection: 'row',
     justifyContent: 'center',
   },
+  btnContainerDesktop: {
+    marginTop: 14,
+  },
   btn: {
     flexDirection: 'row',
     alignItems: 'center',