ReactNative-TodoList/test.js at master · Humble2021/ReactNative-TodoList · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
import React from 'react';
import { View, Text, StatusBar, StyleSheet, TextInput } from 'react-native';
import { Icon } from 'react-native-elements'
import { SafeAreaView } from 'react-native-safe-area-context';


export default function App() {
    return (
        <SafeAreaView style={styles.container}>
            <StatusBar barStyle="light-content" backgroundColor="#1F4287" />
            <View style={styles.nav} />
            <View style={styles.content}>
                <View style={styles.messageInput}>
                    <TextInput style={styles.textInput}
                        value={""}
                        placeholder="Messages" />
                </View>
            </View>
        </SafeAreaView>
    );
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: '#000000',
        //paddingTop: StatusBar.currentHeight,
    },
    nav: {
        width: "100%",
        height: "10%",
        marginTop: 50,
        backgroundColor: "#1F4287",
        borderBottomLeftRadius: 50,
        borderBottomRightRadius: 50,
        borderTopRightRadius: 50,
        borderTopLeftRadius: 50,
    },
    content: {
        borderTopRightRadius: 50,
        borderTopLeftRadius: 50,
        marginTop: 5,
        backgroundColor: "#071E3D",
        flex: 1,
        alignItems: 'center',
        justifyContent: 'center',
    },
    messageInput: {
        backgroundColor: '#1F4287',
        width: "90%",
        height: 50,
        bottom: 10,
        position: "absolute",
        borderRadius: 50,
        paddingRight: 20,
    },
    textInput: {
        display: "flex",
        backgroundColor: "#ffffff",
        justifyContent: "center",
        alignItems: "center",
        position: "absolute",
        width: "80%",
        height: 30,
        left: "5%",
        bottom: 10,
        borderBottomLeftRadius: 50,
        borderBottomRightRadius: 50,
        borderTopRightRadius: 50,
        borderTopLeftRadius: 50,

    },
});


container: {
    flex: 1,
        backgroundColor: '#142850',
            justifyContent: "center",
                alignItems: "center",

                    //<StatusBar barStyle="light-content" backgroundColor="#142850" />
                    //<Login />
                    paddingTop: StatusBar.currentHeight,