diff options
| author | Akshay Nair <phenax5@gmail.com> | 2024-05-12 16:40:21 +0530 |
|---|---|---|
| committer | Akshay Nair <phenax5@gmail.com> | 2024-09-29 16:16:35 +0530 |
| commit | 8ca8f830a09d8ff08ccb654199cb33779117cc37 (patch) | |
| tree | 328fcca1e9c04338e373aa9626d0ae4eaa11cbad /App.tsx | |
| download | daft-launcher-8ca8f830a09d8ff08ccb654199cb33779117cc37.tar.gz daft-launcher-8ca8f830a09d8ff08ccb654199cb33779117cc37.zip | |
Initial commit
Generated by react-native@0.74.1
Diffstat (limited to 'App.tsx')
| -rw-r--r-- | App.tsx | 118 |
1 files changed, 118 insertions, 0 deletions
@@ -0,0 +1,118 @@ +/** + * Sample React Native App + * https://github.com/facebook/react-native + * + * @format + */ + +import React from 'react'; +import type {PropsWithChildren} from 'react'; +import { + SafeAreaView, + ScrollView, + StatusBar, + StyleSheet, + Text, + useColorScheme, + View, +} from 'react-native'; + +import { + Colors, + DebugInstructions, + Header, + LearnMoreLinks, + ReloadInstructions, +} from 'react-native/Libraries/NewAppScreen'; + +type SectionProps = PropsWithChildren<{ + title: string; +}>; + +function Section({children, title}: SectionProps): React.JSX.Element { + const isDarkMode = useColorScheme() === 'dark'; + return ( + <View style={styles.sectionContainer}> + <Text + style={[ + styles.sectionTitle, + { + color: isDarkMode ? Colors.white : Colors.black, + }, + ]}> + {title} + </Text> + <Text + style={[ + styles.sectionDescription, + { + color: isDarkMode ? Colors.light : Colors.dark, + }, + ]}> + {children} + </Text> + </View> + ); +} + +function App(): React.JSX.Element { + const isDarkMode = useColorScheme() === 'dark'; + + const backgroundStyle = { + backgroundColor: isDarkMode ? Colors.darker : Colors.lighter, + }; + + return ( + <SafeAreaView style={backgroundStyle}> + <StatusBar + barStyle={isDarkMode ? 'light-content' : 'dark-content'} + backgroundColor={backgroundStyle.backgroundColor} + /> + <ScrollView + contentInsetAdjustmentBehavior="automatic" + style={backgroundStyle}> + <Header /> + <View + style={{ + backgroundColor: isDarkMode ? Colors.black : Colors.white, + }}> + <Section title="Step One"> + Edit <Text style={styles.highlight}>App.tsx</Text> to change this + screen and then come back to see your edits. + </Section> + <Section title="See Your Changes"> + <ReloadInstructions /> + </Section> + <Section title="Debug"> + <DebugInstructions /> + </Section> + <Section title="Learn More"> + Read the docs to discover what to do next: + </Section> + <LearnMoreLinks /> + </View> + </ScrollView> + </SafeAreaView> + ); +} + +const styles = StyleSheet.create({ + sectionContainer: { + marginTop: 32, + paddingHorizontal: 24, + }, + sectionTitle: { + fontSize: 24, + fontWeight: '600', + }, + sectionDescription: { + marginTop: 8, + fontSize: 18, + fontWeight: '400', + }, + highlight: { + fontWeight: '700', + }, +}); + +export default App; |
