Clean up header. Add theme.

This commit is contained in:
2025-01-28 12:56:22 -06:00
parent 0b688fc4f5
commit 90ec951b0c
4 changed files with 61 additions and 34 deletions

View File

@ -1,18 +1,22 @@
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
headerBackgroundColor={{ light: '#A1CEDC', dark: '#1D3D47' }}
headerHeight={200}
headerImage={
<Image
source={require('@/assets/images/partial-react-logo.png')}
source={require('@/assets/images/tech_tracker_logo.png')}
style={styles.reactLogo}
/>
}
headerTitle={
<ThemedText type='title' style={styles.headerTitle}>Tech Tracker</ThemedText>
}
>
<ThemedView style={styles.titleContainer}>
<ThemedText type='title'>Welcome!</ThemedText>
@ -64,10 +68,20 @@ const styles = StyleSheet.create({
marginBottom: 8,
},
reactLogo: {
height: 178,
width: 290,
bottom: 0,
left: 0,
height: 80,
width: 82,
bottom: 10,
left: 10,
position: 'absolute',
},
headerTitle: {
position: 'absolute',
bottom: 20,
left: 40,
right: 0,
textAlign: 'center',
fontSize: 48,
lineHeight: 64,
fontWeight: 'bold',
},
});

View File

@ -44,7 +44,7 @@ const TabTwoScreen = () => {
<ThemedText type='defaultSemiBold'>@3x</ThemedText> suffixes to provide files for
different screen densities
</ThemedText>
<Image source={require('@/assets/images/react-logo.png')} style={{ alignSelf: 'center' }} />
<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>