Getting ready for collab

app/(tabs)/_layout.tsx

@@ -37,14 +37,16 @@ const TabLayout = () => {
         name='index'
         options={{
           title: 'Home',
-          tabBarIcon: ({ color }) => <IconSymbol size={28} name='house.fill' color={color} />,
+          tabBarIcon: ({ color }) =>
+          <IconSymbol size={28} name='house.fill' color={color} />,
         }}
       />
       <Tabs.Screen
         name='settings'
         options={{
           title: 'Settings',
-          tabBarIcon: ({ color }) => <IconSymbol size={28} name='gearshape.fill' color={color} />,
+          tabBarIcon: ({ color }) =>
+            <IconSymbol size={28} name='gearshape.fill' color={color} />,
         }}
       />
     </Tabs>

app/(tabs)/index.tsx

@@ -1,11 +1,8 @@
 import { Image, StyleSheet, Platform } from 'react-native';
 import ParallaxScrollView from '@/components/default/ParallaxScrollView';
 import { ThemedText, ThemedView } from '@/components/theme/Theme';
-import { Colors } from '@/constants/Colors';
-import { useColorScheme } from '@/hooks/useColorScheme';
 
 const HomeScreen = () => {
-  const scheme = useColorScheme() ?? 'dark';
   return (
     <ParallaxScrollView
       headerImage={
@@ -19,38 +16,7 @@ const HomeScreen = () => {
       }
     >
       <ThemedView style={styles.titleContainer}>
-        <ThemedText type='title'>Welcome!</ThemedText>
+
-      </ThemedView>
-      <ThemedView style={styles.stepContainer}>
-        <ThemedText type='subtitle'>Step 1: Try it</ThemedText>
-        <ThemedText>
-          Edit <ThemedText type='defaultSemiBold'>app/(tabs)/index.tsx</ThemedText> to see changes.
-          Press{' '}
-          <ThemedText type='defaultSemiBold'>
-            {Platform.select({
-              ios: 'cmd + d',
-              android: 'cmd + m',
-              web: 'F12',
-            })}
-          </ThemedText>{' '}
-          to open developer tools.
-        </ThemedText>
-      </ThemedView>
-      <ThemedView style={styles.stepContainer}>
-        <ThemedText type='subtitle'>Step 2: Explore</ThemedText>
-        <ThemedText>
-          Tap the Explore tab to learn more about what's included in this starter app.
-        </ThemedText>
-      </ThemedView>
-      <ThemedView style={styles.stepContainer}>
-        <ThemedText type='subtitle'>Step 3: Get a fresh start</ThemedText>
-        <ThemedText>
-          When you're ready, run{' '}
-          <ThemedText type='defaultSemiBold'>npm run reset-project</ThemedText> to get a fresh{' '}
-          <ThemedText type='defaultSemiBold'>app</ThemedText> directory. This will move the current{' '}
-          <ThemedText type='defaultSemiBold'>app</ThemedText> to{' '}
-          <ThemedText type='defaultSemiBold'>app-example</ThemedText>.
-        </ThemedText>
       </ThemedView>
     </ParallaxScrollView>
   );
@@ -68,16 +34,16 @@ const styles = StyleSheet.create({
     marginBottom: 8,
   },
   reactLogo: {
-    height: 80,
+    height: 70,
-    width: 82,
+    width: 72,
     bottom: 10,
-    left: 10,
+    left: 40,
     position: 'absolute',
   },
   headerTitle: {
     position: 'absolute',
     bottom: 20,
-    left: 40,
+    left: 75,
     right: 0,
     textAlign: 'center',
     fontSize: 48,

app/(tabs)/settings.tsx

@@ -8,84 +8,15 @@ import { IconSymbol } from '@/components/ui/IconSymbol';
 const TabTwoScreen = () => {
   return (
     <ParallaxScrollView
-      headerBackgroundColor={{ light: '#D0D0D0', dark: '#353636' }}
-      headerHeight={150}
       headerImage={
-        <IconSymbol size={200} color='#808080' name='gear.circle' style={styles.headerImage} />
+        <IconSymbol size={80} color='#808080' name='gear.circle' style={styles.headerImage} />
+      }
+      headerTitle={
+        <ThemedText type='title' style={styles.headerTitle}>
+          Settings
+        </ThemedText>
       }
     >
-      <ThemedView style={styles.titleContainer}>
-        <ThemedText type='title'>Settings</ThemedText>
-      </ThemedView>
-      <ThemedText>This app includes example code to help you get started.</ThemedText>
-      <Collapsible title='File-based routing'>
-        <ThemedText>
-          This app has two screens:{' '}
-          <ThemedText type='defaultSemiBold'>app/(tabs)/index.tsx</ThemedText> and{' '}
-          <ThemedText type='defaultSemiBold'>app/(tabs)/explore.tsx</ThemedText>
-        </ThemedText>
-        <ThemedText>
-          The layout file in <ThemedText type='defaultSemiBold'>app/(tabs)/_layout.tsx</ThemedText>{' '}
-          sets up the tab navigator.
-        </ThemedText>
-        <ExternalLink href='https://docs.expo.dev/router/introduction'>
-          <ThemedText type='link'>Learn more</ThemedText>
-        </ExternalLink>
-      </Collapsible>
-      <Collapsible title='Android, iOS, and web support'>
-        <ThemedText>
-          You can open this project on Android, iOS, and the web. To open the web version, press{' '}
-          <ThemedText type='defaultSemiBold'>w</ThemedText> in the terminal running this project.
-        </ThemedText>
-      </Collapsible>
-      <Collapsible title='Images'>
-        <ThemedText>
-          For static images, you can use the <ThemedText type='defaultSemiBold'>@2x</ThemedText> and{' '}
-          <ThemedText type='defaultSemiBold'>@3x</ThemedText> suffixes to provide files for
-          different screen densities
-        </ThemedText>
-        <Image source={require('@/assets/images/tech_tracker_logo.png')} style={{ alignSelf: 'center' }} />
-        <ExternalLink href='https://reactnative.dev/docs/images'>
-          <ThemedText type='link'>Learn more</ThemedText>
-        </ExternalLink>
-      </Collapsible>
-      <Collapsible title='Custom fonts'>
-        <ThemedText>
-          Open <ThemedText type='defaultSemiBold'>app/_layout.tsx</ThemedText> to see how to load{' '}
-          <ThemedText style={{ fontFamily: 'SpaceMono' }}>
-            custom fonts such as this one.
-          </ThemedText>
-        </ThemedText>
-        <ExternalLink href='https://docs.expo.dev/versions/latest/sdk/font'>
-          <ThemedText type='link'>Learn more</ThemedText>
-        </ExternalLink>
-      </Collapsible>
-      <Collapsible title='Light and dark mode components'>
-        <ThemedText>
-          This template has light and dark mode support. The{' '}
-          <ThemedText type='defaultSemiBold'>useColorScheme()</ThemedText> hook lets you inspect
-          what the user's current color scheme is, and so you can adjust UI colors accordingly.
-        </ThemedText>
-        <ExternalLink href='https://docs.expo.dev/develop/user-interface/color-themes/'>
-          <ThemedText type='link'>Learn more</ThemedText>
-        </ExternalLink>
-      </Collapsible>
-      <Collapsible title='Animations'>
-        <ThemedText>
-          This template includes an example of an animated component. The{' '}
-          <ThemedText type='defaultSemiBold'>components/HelloWave.tsx</ThemedText> component uses
-          the powerful <ThemedText type='defaultSemiBold'>react-native-reanimated</ThemedText>{' '}
-          library to create a waving hand animation.
-        </ThemedText>
-        {Platform.select({
-          ios: (
-            <ThemedText>
-              The <ThemedText type='defaultSemiBold'>components/ParallaxScrollView.tsx</ThemedText>{' '}
-              component provides a parallax effect for the header image.
-            </ThemedText>
-          ),
-        })}
-      </Collapsible>
     </ParallaxScrollView>
   );
 };
@@ -94,10 +25,20 @@ export default TabTwoScreen;
 const styles = StyleSheet.create({
   headerImage: {
     color: '#808080',
-    bottom: -90,
+    bottom: 6,
-    left: -35,
+    left: 38,
     position: 'absolute',
   },
+  headerTitle: {
+    position: 'absolute',
+    bottom: 20,
+    left: 16,
+    right: 0,
+    textAlign: 'center',
+    fontSize: 48,
+    lineHeight: 64,
+    fontWeight: 'bold',
+  },
   titleContainer: {
     flexDirection: 'row',
     gap: 8,

components/default/ParallaxScrollView.tsx

@@ -77,9 +77,6 @@ const ParallaxScrollView = ({
 export default ParallaxScrollView;
 
 const styles = StyleSheet.create({
-  blank: {
-
-  },
   container: {
     flex: 1,
   },

scripts/reset-project.js

@@ -1,84 +0,0 @@
-#!/usr/bin/env node
-
-/**
- * This script is used to reset the project to a blank state.
- * It moves the /app, /components, /hooks, /scripts, and /constants directories to /app-example and creates a new /app directory with an index.tsx and _layout.tsx file.
- * You can remove the `reset-project` script from package.json and safely delete this file after running it.
- */
-
-const fs = require('fs');
-const path = require('path');
-
-const root = process.cwd();
-const oldDirs = ['app', 'components', 'hooks', 'constants', 'scripts'];
-const newDir = 'app-example';
-const newAppDir = 'app';
-const newDirPath = path.join(root, newDir);
-
-const indexContent = `import { Text, View } from "react-native";
-
-export default function Index() {
-  return (
-    <View
-      style={{
-        flex: 1,
-        justifyContent: "center",
-        alignItems: "center",
-      }}
-    >
-      <Text>Edit app/index.tsx to edit this screen.</Text>
-    </View>
-  );
-}
-`;
-
-const layoutContent = `import { Stack } from "expo-router";
-
-export default function RootLayout() {
-  return <Stack />;
-}
-`;
-
-const moveDirectories = async () => {
-  try {
-    // Create the app-example directory
-    await fs.promises.mkdir(newDirPath, { recursive: true });
-    console.log(`📁 /${newDir} directory created.`);
-
-    // Move old directories to new app-example directory
-    for (const dir of oldDirs) {
-      const oldDirPath = path.join(root, dir);
-      const newDirPath = path.join(root, newDir, dir);
-      if (fs.existsSync(oldDirPath)) {
-        await fs.promises.rename(oldDirPath, newDirPath);
-        console.log(`➡️ /${dir} moved to /${newDir}/${dir}.`);
-      } else {
-        console.log(`➡️ /${dir} does not exist, skipping.`);
-      }
-    }
-
-    // Create new /app directory
-    const newAppDirPath = path.join(root, newAppDir);
-    await fs.promises.mkdir(newAppDirPath, { recursive: true });
-    console.log('\n📁 New /app directory created.');
-
-    // Create index.tsx
-    const indexPath = path.join(newAppDirPath, 'index.tsx');
-    await fs.promises.writeFile(indexPath, indexContent);
-    console.log('📄 app/index.tsx created.');
-
-    // Create _layout.tsx
-    const layoutPath = path.join(newAppDirPath, '_layout.tsx');
-    await fs.promises.writeFile(layoutPath, layoutContent);
-    console.log('📄 app/_layout.tsx created.');
-
-    console.log('\n✅ Project reset complete. Next steps:');
-    console.log(
-      "1. Run `npx expo start` to start a development server.\n2. Edit app/index.tsx to edit the main screen.\n3. Delete the /app-example directory when you're done referencing it.",
-    );
-  } catch (error) {
-    console.error(`Error during script execution: ${error}`);
-  }
-};
-
-moveDirectories();