diff options
author | Paul Frazee <pfrazee@gmail.com> | 2022-06-07 18:56:31 -0500 |
---|---|---|
committer | Paul Frazee <pfrazee@gmail.com> | 2022-06-07 18:56:31 -0500 |
commit | efe65e70d7f8a4f30e4c780c5fdb56f3c81f377e (patch) | |
tree | 702ad3a06f6438e2c33c3039938729599e063837 /App.tsx | |
parent | 1a1d313801b5ad6ff6cf182881c615b864cfc21d (diff) | |
download | voidsky-efe65e70d7f8a4f30e4c780c5fdb56f3c81f377e.tar.zst |
Add basic react-navigator usage
Diffstat (limited to 'App.tsx')
-rw-r--r-- | App.tsx | 115 |
1 files changed, 0 insertions, 115 deletions
diff --git a/App.tsx b/App.tsx deleted file mode 100644 index e2cc13b39..000000000 --- a/App.tsx +++ /dev/null @@ -1,115 +0,0 @@ -/** - * Sample React Native App - * https://github.com/facebook/react-native - * - * Generated with the TypeScript template - * https://github.com/react-native-community/react-native-template-typescript - * - * @format - */ - -import React from 'react'; -import { - SafeAreaView, - ScrollView, - StatusBar, - StyleSheet, - Text, - useColorScheme, - View, -} from 'react-native'; - -import { - Colors, - DebugInstructions, - Header, - LearnMoreLinks, - ReloadInstructions, -} from 'react-native/Libraries/NewAppScreen'; - -const Section: React.FC<{ - title: string; -}> = ({children, title}) => { - 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> - ); -}; - -const App = () => { - const isDarkMode = useColorScheme() === 'dark'; - - const backgroundStyle = { - backgroundColor: isDarkMode ? Colors.darker : Colors.lighter, - }; - - return ( - <SafeAreaView style={backgroundStyle}> - <StatusBar barStyle={isDarkMode ? 'light-content' : 'dark-content'} /> - <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; |