did branch

src/app/(BottomTabNavigation)/Cases/QRCodeScanner/index.tsx

@@ -1,7 +1,7 @@
 import { BarCodeScanner, BarCodeScannerResult } from 'expo-barcode-scanner';
 import { router } from 'expo-router';
 import React, { useEffect, useState } from 'react';
-import { Image, StyleSheet, Text, View } from 'react-native';
+import { Image, Text, View } from 'react-native';
 import { TouchableOpacity } from 'react-native-gesture-handler';
 import styles from './styles';
 
@@ -42,9 +42,9 @@ function QRCodeScannerScreen() {
       <Text>Add a new case</Text>
       <BarCodeScanner
         onBarCodeScanned={handleBarCodeScanned}
-        style={[StyleSheet.absoluteFillObject]}
+        style={[styles.scanner]} // StyleSheet.absoluteFillObject,
       />
-      <Image style={styles.crosshair} source={require('./img/silly.png')} />
+      <Image style={styles.crosshair} source={require('./img/crosshair.png')} />
 
       <Text>Current Scanning: {data}</Text>
       <TouchableOpacity onPress={() => router.back()} style={styles.button}>

src/app/(BottomTabNavigation)/Cases/QRCodeScanner/styles.ts

@@ -9,10 +9,10 @@ export default StyleSheet.create({
   },
 
   scanner: {
-    height: 400,
-    width: 400,
+    height: 300,
+    width: 300,
     border: 'solid',
-    borderWidth: 5,
+    borderWidth: 3,
   },
 
   button: {
@@ -23,7 +23,10 @@ export default StyleSheet.create({
   },
 
   crosshair: {
-    height: 400,
-    width: 400,
+    position: 'absolute',
+    top: 120,
+    left: -90,
+    height: 600,
+    width: 600,
   },
 });