Browse Source

Replaced native base with react native paper

keplyx 1 year ago
parent
commit
1f64c734aa
73 changed files with 825 additions and 5680 deletions
  1. 21
    17
      App.js
  2. 1
    1
      components/CustomIntroSlider.js
  3. 100
    105
      components/DashboardItem.js
  4. 22
    25
      components/Sidebar.js
  5. 10
    7
      components/WebSectionList.js
  6. 10
    46
      components/WebViewScreen.js
  7. 0
    39
      native-base-theme/components/Badge.js
  8. 0
    11
      native-base-theme/components/Body.js
  9. 0
    386
      native-base-theme/components/Button.js
  10. 0
    37
      native-base-theme/components/Card.js
  11. 0
    198
      native-base-theme/components/CardItem.js
  12. 0
    38
      native-base-theme/components/CheckBox.js
  13. 0
    17
      native-base-theme/components/Container.js
  14. 0
    14
      native-base-theme/components/Content.js
  15. 0
    25
      native-base-theme/components/Fab.js
  16. 0
    119
      native-base-theme/components/Footer.js
  17. 0
    79
      native-base-theme/components/FooterTab.js
  18. 0
    86
      native-base-theme/components/Form.js
  19. 0
    13
      native-base-theme/components/H1.js
  20. 0
    13
      native-base-theme/components/H2.js
  21. 0
    13
      native-base-theme/components/H3.js
  22. 0
    419
      native-base-theme/components/Header.js
  23. 0
    12
      native-base-theme/components/Icon.js
  24. 0
    19
      native-base-theme/components/Input.js
  25. 0
    132
      native-base-theme/components/InputGroup.js
  26. 0
    241
      native-base-theme/components/Item.js
  27. 0
    12
      native-base-theme/components/Label.js
  28. 0
    11
      native-base-theme/components/Left.js
  29. 0
    446
      native-base-theme/components/ListItem.js
  30. 0
    14
      native-base-theme/components/Picker.android.js
  31. 0
    7
      native-base-theme/components/Picker.ios.js
  32. 0
    14
      native-base-theme/components/Picker.js
  33. 0
    31
      native-base-theme/components/Radio.js
  34. 0
    14
      native-base-theme/components/Right.js
  35. 0
    57
      native-base-theme/components/Segment.js
  36. 0
    49
      native-base-theme/components/Separator.js
  37. 0
    9
      native-base-theme/components/Spinner.js
  38. 0
    19
      native-base-theme/components/Subtitle.js
  39. 0
    46
      native-base-theme/components/SwipeRow.js
  40. 0
    9
      native-base-theme/components/Switch.js
  41. 0
    10
      native-base-theme/components/Tab.js
  42. 0
    57
      native-base-theme/components/TabBar.js
  43. 0
    26
      native-base-theme/components/TabContainer.js
  44. 0
    40
      native-base-theme/components/TabHeading.js
  45. 0
    17
      native-base-theme/components/Text.js
  46. 0
    25
      native-base-theme/components/Textarea.js
  47. 0
    40
      native-base-theme/components/Thumbnail.js
  48. 0
    21
      native-base-theme/components/Title.js
  49. 0
    41
      native-base-theme/components/Toast.js
  50. 0
    13
      native-base-theme/components/View.js
  51. 0
    249
      native-base-theme/components/index.js
  52. 0
    311
      native-base-theme/variables/commonColor.js
  53. 0
    304
      native-base-theme/variables/material.js
  54. 0
    362
      native-base-theme/variables/platform.js
  55. 0
    362
      native-base-theme/variables/platformDark.js
  56. 7
    20
      navigation/DrawerNavigator.js
  57. 3
    14
      navigation/MainTabNavigator.js
  58. 1
    4
      package.json
  59. 5
    11
      screens/About/AboutDependenciesScreen.js
  60. 81
    99
      screens/About/AboutScreen.js
  61. 54
    79
      screens/DebugScreen.js
  62. 32
    55
      screens/HomeScreen.js
  63. 27
    33
      screens/PlanningDisplayScreen.js
  64. 40
    79
      screens/PlanningScreen.js
  65. 36
    48
      screens/Proximo/ProximoAboutScreen.js
  66. 51
    94
      screens/Proximo/ProximoListScreen.js
  67. 24
    47
      screens/Proximo/ProximoMainScreen.js
  68. 63
    127
      screens/Proxiwash/ProxiwashAboutScreen.js
  69. 51
    82
      screens/Proxiwash/ProxiwashScreen.js
  70. 12
    22
      screens/SelfMenuScreen.js
  71. 68
    101
      screens/SettingsScreen.js
  72. 97
    27
      utils/ThemeManager.js
  73. 9
    10
      utils/WebDataManager.js

+ 21
- 17
App.js View File

@@ -2,18 +2,17 @@
2 2
 
3 3
 import * as React from 'react';
4 4
 import {Platform, StatusBar} from 'react-native';
5
-import {Root, StyleProvider} from 'native-base';
6 5
 import LocaleManager from './utils/LocaleManager';
7 6
 import * as Font from 'expo-font';
8
-import {clearThemeCache} from 'native-base-shoutem-theme';
9 7
 import AsyncStorageManager from "./utils/AsyncStorageManager";
10 8
 import CustomIntroSlider from "./components/CustomIntroSlider";
11 9
 import {SplashScreen} from 'expo';
12 10
 import ThemeManager from './utils/ThemeManager';
13
-import { NavigationContainer } from '@react-navigation/native';
14
-import { createStackNavigator } from '@react-navigation/stack';
11
+import {NavigationContainer} from '@react-navigation/native';
12
+import {createStackNavigator} from '@react-navigation/stack';
15 13
 import DrawerNavigator from './navigation/DrawerNavigator';
16 14
 import NotificationsManager from "./utils/NotificationsManager";
15
+import {Provider as PaperProvider} from 'react-native-paper';
17 16
 
18 17
 type Props = {};
19 18
 
@@ -24,6 +23,17 @@ type State = {
24 23
     currentTheme: ?Object,
25 24
 };
26 25
 
26
+const MyTheme = {
27
+    dark: false,
28
+    colors: {
29
+        primary: 'rgb(255, 45, 85)',
30
+        background: 'rgb(242, 242, 242)',
31
+        card: 'rgb(255, 255, 255)',
32
+        text: 'rgb(28, 28, 30)',
33
+        border: 'rgb(199, 199, 204)',
34
+    },
35
+};
36
+
27 37
 const Stack = createStackNavigator();
28 38
 
29 39
 export default class App extends React.Component<Props, State> {
@@ -51,7 +61,6 @@ export default class App extends React.Component<Props, State> {
51 61
             currentTheme: ThemeManager.getCurrentTheme()
52 62
         });
53 63
         this.setupStatusBar();
54
-        clearThemeCache();
55 64
     }
56 65
 
57 66
     setupStatusBar() {
@@ -84,9 +93,6 @@ export default class App extends React.Component<Props, State> {
84 93
         // Wait for custom fonts to be loaded before showing the app
85 94
         // console.log("loading Fonts");
86 95
         SplashScreen.preventAutoHide();
87
-        await Font.loadAsync({
88
-            'Roboto_medium': require('native-base/Fonts/Roboto_medium.ttf'),
89
-        });
90 96
         // console.log("loading preferences");
91 97
         await AsyncStorageManager.getInstance().loadPreferences();
92 98
         ThemeManager.getInstance().setUpdateThemeCallback(() => this.updateTheme());
@@ -122,15 +128,13 @@ export default class App extends React.Component<Props, State> {
122 128
         } else {
123 129
 
124 130
             return (
125
-                <Root>
126
-                    <StyleProvider style={this.state.currentTheme}>
127
-                        <NavigationContainer>
128
-                            <Stack.Navigator headerMode="none">
129
-                                <Stack.Screen name="Root" component={DrawerNavigator} />
130
-                            </Stack.Navigator>
131
-                        </NavigationContainer>
132
-                    </StyleProvider>
133
-                </Root>
131
+                <PaperProvider theme={this.state.currentTheme}>
132
+                    <NavigationContainer theme={this.state.currentTheme}>
133
+                        <Stack.Navigator headerMode="none">
134
+                            <Stack.Screen name="Root" component={DrawerNavigator}/>
135
+                        </Stack.Navigator>
136
+                    </NavigationContainer>
137
+                </PaperProvider>
134 138
             );
135 139
         }
136 140
     }

+ 1
- 1
components/CustomIntroSlider.js View File

@@ -4,7 +4,7 @@ import * as React from 'react';
4 4
 import {LinearGradient} from "expo-linear-gradient";
5 5
 import {Image, StyleSheet, View} from "react-native";
6 6
 import {MaterialCommunityIcons} from "@expo/vector-icons";
7
-import {Text} from "native-base";
7
+import {Text} from "react-native-paper";
8 8
 import i18n from 'i18n-js';
9 9
 import AppIntroSlider from "react-native-app-intro-slider";
10 10
 

+ 100
- 105
components/DashboardItem.js View File

@@ -1,16 +1,13 @@
1 1
 // @flow
2 2
 
3 3
 import * as React from 'react';
4
-import {Body, Card, CardItem, H3, Left, Text, Thumbnail} from "native-base";
5 4
 import {MaterialCommunityIcons} from "@expo/vector-icons";
6 5
 import {View} from "react-native";
7 6
 import ThemeManager from "../utils/ThemeManager";
8 7
 import HTML from "react-native-render-html";
9 8
 import {LinearGradient} from "expo-linear-gradient";
10
-import PlatformTouchable from "react-native-platform-touchable";
11 9
 import i18n from "i18n-js";
12
-
13
-const CARD_BORDER_RADIUS = 10;
10
+import {Avatar, Card, Text, Title} from 'react-native-paper';
14 11
 
15 12
 type Props = {
16 13
     isAvailable: boolean,
@@ -72,74 +69,73 @@ export default class DashboardItem extends React.Component<Props> {
72 69
 
73 70
     getEventPreviewContainer() {
74 71
         if (this.props.displayEvent !== undefined && this.props.displayEvent !== null) {
72
+            const hasImage = this.props.displayEvent['logo'] !== '' && this.props.displayEvent['logo'] !== null;
75 73
             return (
76
-                <View>
77
-                    <CardItem style={{
78
-                        paddingTop: 0,
79
-                        paddingBottom: 0,
80
-                        backgroundColor: 'transparent',
81
-                    }}>
82
-                        <Left>
83
-                            {this.props.displayEvent['logo'] !== '' && this.props.displayEvent['logo'] !== null ?
84
-                                <Thumbnail source={{uri: this.props.displayEvent['logo']}} square/> :
85
-                                <View/>}
86
-                            <Body>
87
-                                <Text>{this.props.displayEvent['title']}</Text>
88
-                                <Text note>{this.getFormattedEventTime(this.props.displayEvent)}</Text>
89
-                            </Body>
90
-                        </Left>
91
-                    </CardItem>
92
-                    <CardItem style={{
93
-                        borderRadius: CARD_BORDER_RADIUS,
94
-                        backgroundColor: 'transparent',
95
-                    }}>
96
-                        <Body style={{
97
-                            height: this.props.displayEvent['description'].length > 50 ? 70 : 20,
74
+                <Card style={{marginBottom: 10}}>
75
+                    {hasImage ?
76
+                        <Card.Title
77
+                            title={this.props.displayEvent['title']}
78
+                            subtitle={this.getFormattedEventTime(this.props.displayEvent)}
79
+                            left={() =>
80
+                                <Avatar.Image
81
+                                    source={{uri: this.props.displayEvent['logo']}}
82
+                                    size={60}
83
+                                    style={{backgroundColor: 'transparent'}}/>
84
+                            }
85
+                        /> :
86
+                        <Card.Title
87
+                            title={this.props.displayEvent['title']}
88
+                            subtitle={this.getFormattedEventTime(this.props.displayEvent)}
89
+                        />}
90
+                    <View>
91
+                        <Card.Content style={{
92
+                            height: this.props.displayEvent['description'].length > 70 ? 100 : 50,
98 93
                             overflow: 'hidden',
99 94
                         }}>
100 95
                             <HTML html={"<div>" + this.props.displayEvent['description'] + "</div>"}
101 96
                                   tagsStyles={{
102 97
                                       p: {
103
-                                          color: ThemeManager.getCurrentThemeVariables().textColor,
104
-                                          fontSize: ThemeManager.getCurrentThemeVariables().fontSizeBase,
98
+                                          color: ThemeManager.getCurrentThemeVariables().text,
105 99
                                       },
106
-                                      div: {color: ThemeManager.getCurrentThemeVariables().textColor},
100
+                                      div: {color: ThemeManager.getCurrentThemeVariables().text},
107 101
                                   }}/>
108
-                            <LinearGradient
109
-                                colors={[
110
-                                    // Fix for ios gradient: transparent color must match final color
111
-                                    ThemeManager.getNightMode() ? 'rgba(42,42,42,0)' : 'rgba(255,255,255,0)',
112
-                                    ThemeManager.getCurrentThemeVariables().cardDefaultBg
113
-                                ]}
114
-                                start={{x: 0, y: 0}}
115
-                                end={{x: 0, y: 0.6}}
116
-                                // end={[0, 0.6]}
117
-                                style={{
118
-                                    position: 'absolute',
119
-                                    width: '100%',
120
-                                    height: 65,
121
-                                    bottom: -5,
122
-                                }}>
123
-                                <View style={{
124
-                                    marginLeft: 'auto',
102
+
103
+                        </Card.Content>
104
+                        <LinearGradient
105
+                            colors={[
106
+                                // Fix for ios gradient: transparent color must match final color
107
+                                ThemeManager.getNightMode() ? 'rgba(42,42,42,0)' : 'rgba(255,255,255,0)',
108
+                                ThemeManager.getCurrentThemeVariables().card
109
+                            ]}
110
+                            start={{x: 0, y: 0}}
111
+                            end={{x: 0, y: 0.6}}
112
+                            // end={[0, 0.6]}
113
+                            style={{
114
+                                position: 'absolute',
115
+                                width: '100%',
116
+                                height: 65,
117
+                                bottom: -5,
118
+                            }}>
119
+                            <View style={{
120
+                                marginLeft: 'auto',
121
+                                marginTop: 'auto',
122
+                                flexDirection: 'row'
123
+                            }}>
124
+                                <Text style={{
125 125
                                     marginTop: 'auto',
126
-                                    flexDirection: 'row'
126
+                                    marginBottom: 'auto',
127
+                                    padding: 0,
127 128
                                 }}>
128
-                                    <Text style={{
129
-                                        marginTop: 'auto',
130
-                                        marginBottom: 'auto',
131
-                                        padding: 0,
132
-                                    }}>
133
-                                        {i18n.t("homeScreen.dashboard.seeMore")}
134
-                                    </Text>
135
-                                    <MaterialCommunityIcons
136
-                                        name={'chevron-right'}
137
-                                        size={26}/>
138
-                                </View>
139
-                            </LinearGradient>
140
-                        </Body>
141
-                    </CardItem>
142
-                </View>
129
+                                    {i18n.t("homeScreen.dashboard.seeMore")}
130
+                                </Text>
131
+                                <MaterialCommunityIcons
132
+                                    name={'chevron-right'}
133
+                                    size={26}
134
+                                    color={ThemeManager.getCurrentThemeVariables().text}/>
135
+                            </View>
136
+                        </LinearGradient>
137
+                    </View>
138
+                </Card>
143 139
             );
144 140
         } else
145 141
             return <View/>
@@ -152,7 +148,7 @@ export default class DashboardItem extends React.Component<Props> {
152 148
                 color={
153 149
                     this.props.isAvailable ?
154 150
                         this.props.color :
155
-                        ThemeManager.getCurrentThemeVariables().textDisabledColor
151
+                        ThemeManager.getCurrentThemeVariables().textDisabled
156 152
                 }
157 153
                 size={this.props.isSquare ? 50 : 40}/>
158 154
         );
@@ -163,19 +159,19 @@ export default class DashboardItem extends React.Component<Props> {
163 159
             <View style={{
164 160
                 width: this.props.isSquare ? '100%' : 'auto',
165 161
             }}>
166
-                <H3 style={{
162
+                <Title style={{
167 163
                     color: this.props.isAvailable ?
168
-                        ThemeManager.getCurrentThemeVariables().textColor :
169
-                        ThemeManager.getCurrentThemeVariables().listNoteColor,
164
+                        ThemeManager.getCurrentThemeVariables().text :
165
+                        ThemeManager.getCurrentThemeVariables().textDisabled,
170 166
                     textAlign: this.props.isSquare ? 'center' : 'left',
171 167
                     width: this.props.isSquare ? '100%' : 'auto',
172 168
                 }}>
173 169
                     {this.props.title}
174
-                </H3>
170
+                </Title>
175 171
                 <Text style={{
176 172
                     color: this.props.isAvailable ?
177
-                        ThemeManager.getCurrentThemeVariables().listNoteColor :
178
-                        ThemeManager.getCurrentThemeVariables().textDisabledColor,
173
+                        ThemeManager.getCurrentThemeVariables().text :
174
+                        ThemeManager.getCurrentThemeVariables().textDisabled,
179 175
                     textAlign: this.props.isSquare ? 'center' : 'left',
180 176
                     width: this.props.isSquare ? '100%' : 'auto',
181 177
                 }}>
@@ -188,21 +184,12 @@ export default class DashboardItem extends React.Component<Props> {
188 184
     getContent() {
189 185
         if (this.props.isSquare) {
190 186
             return (
191
-                <Body>
187
+                <View>
192 188
                     <View style={{marginLeft: 'auto', marginRight: 'auto'}}>
193 189
                         {this.getIcon()}
194 190
                     </View>
195 191
                     {this.getText()}
196
-                </Body>
197
-            );
198
-        } else {
199
-            return (
200
-                <Left>
201
-                    {this.getIcon()}
202
-                    <Body>
203
-                        {this.getText()}
204
-                    </Body>
205
-                </Left>
192
+                </View>
206 193
             );
207 194
         }
208 195
     }
@@ -217,33 +204,41 @@ export default class DashboardItem extends React.Component<Props> {
217 204
             else
218 205
                 marginRight = 0
219 206
         }
207
+        const color = this.props.isAvailable ?
208
+            ThemeManager.getCurrentThemeVariables().text :
209
+            ThemeManager.getCurrentThemeVariables().textDisabled;
220 210
         return (
221
-            <Card style={{
222
-                flex: 0,
223
-                width: this.props.isSquare ? '48%' : 'auto',
224
-                marginLeft: this.props.isSquare ? 0 : 10,
225
-                marginRight: marginRight,
226
-                marginTop: 10,
227
-                borderRadius: CARD_BORDER_RADIUS,
228
-                backgroundColor: ThemeManager.getCurrentThemeVariables().cardDefaultBg,
229
-                overflow: 'hidden',
230
-            }}>
231
-                <PlatformTouchable
232
-                    onPress={this.props.clickAction}
233
-                    style={{
234
-                        zIndex: 100,
235
-                        minHeight: this.props.isSquare ? 150 : 'auto',
236
-                    }}
237
-                >
211
+            <Card
212
+                style={{
213
+                    width: this.props.isSquare ? '48%' : 'auto',
214
+                    marginLeft: this.props.isSquare ? 0 : 10,
215
+                    marginRight: marginRight,
216
+                    marginTop: 10,
217
+                    overflow: 'hidden',
218
+                }}
219
+                onPress={this.props.clickAction}>
220
+                {this.props.isSquare ?
221
+                    <Card.Content>
222
+                        {this.getContent()}
223
+                    </Card.Content>
224
+                    :
238 225
                     <View>
239
-                        <CardItem style={{
240
-                            backgroundColor: 'transparent',
241
-                        }}>
242
-                            {this.getContent()}
243
-                        </CardItem>
244
-                        {this.getEventPreviewContainer()}
245
-                    </View>
246
-                </PlatformTouchable>
226
+                        <Card.Title
227
+                            title={this.props.title}
228
+                            titleStyle={{color: color}}
229
+                            subtitle={this.props.subtitle}
230
+                            subtitleStyle={{color: color}}
231
+                            left={(props) => <Avatar.Icon
232
+                                {...props}
233
+                                icon={this.props.icon}
234
+                                color={this.props.isAvailable ? this.props.color : ThemeManager.getCurrentThemeVariables().textDisabled}
235
+                                size={60}
236
+                                style={{backgroundColor: 'transparent'}}/>}
237
+                        />
238
+                        <Card.Content>
239
+                            {this.getEventPreviewContainer()}
240
+                        </Card.Content>
241
+                    </View>}
247 242
             </Card>
248 243
         );
249 244
     }

+ 22
- 25
components/Sidebar.js View File

@@ -1,17 +1,19 @@
1 1
 // @flow
2 2
 
3 3
 import * as React from 'react';
4
-import {Dimensions, FlatList, Image,Platform, StyleSheet} from 'react-native';
5
-import {Container, Left, ListItem, Text} from "native-base";
4
+import {Dimensions, FlatList, Image, Platform, StyleSheet, View} from 'react-native';
6 5
 import i18n from "i18n-js";
7 6
 import {MaterialCommunityIcons} from "@expo/vector-icons";
8 7
 import ThemeManager from "../utils/ThemeManager";
9 8
 import * as WebBrowser from 'expo-web-browser';
9
+import {List} from 'react-native-paper';
10
+import {DrawerItem} from '@react-navigation/drawer';
10 11
 
11 12
 const deviceWidth = Dimensions.get("window").width;
12 13
 
13 14
 type Props = {
14 15
     navigation: Object,
16
+    state: Object,
15 17
 };
16 18
 
17 19
 type State = {
@@ -142,32 +144,29 @@ export default class SideBar extends React.Component<Props, State> {
142 144
 
143 145
     getRenderItem({item}: Object) {
144 146
         const onListItemPress = this.onListItemPress.bind(this, item);
145
-        // return <View/>;
146 147
         if (item.icon !== undefined) {
147 148
             return (
148
-                <ListItem
149
-                    button
150
-                    noBorder
149
+                <DrawerItem
150
+                    label={item.name}
151
+                    focused={false}
152
+                    icon={({color, size}) =>
153
+                        <MaterialCommunityIcons color={color} size={size} name={item.icon}/>}
151 154
                     selected={this.state.active === item.route}
152 155
                     onPress={onListItemPress}
153
-                >
154
-                    <Left>
155
-                        <MaterialCommunityIcons
156
-                            name={item.icon}
157
-                            size={26}
158
-                            color={ThemeManager.getCurrentThemeVariables().customMaterialIconColor}
159
-                        />
160
-                        <Text style={styles.text}>
161
-                            {item.name}
162
-                        </Text>
163
-                    </Left>
164
-                </ListItem>
156
+                    style={{
157
+                        marginLeft: 0,
158
+                        marginRight: 0,
159
+                        padding: 0,
160
+                        borderRadius: 0
161
+                    }}
162
+                />
165 163
             );
166 164
         } else {
167 165
             return (
168
-                <ListItem itemDivider>
169
-                    <Text>{item.name}</Text>
170
-                </ListItem>
166
+                <List.Item
167
+                    title={item.name}
168
+                    style={{backgroundColor: ThemeManager.getCurrentThemeVariables().dividerBackground}}
169
+                />
171 170
             );
172 171
         }
173 172
 
@@ -176,9 +175,7 @@ export default class SideBar extends React.Component<Props, State> {
176 175
     render() {
177 176
         console.log("rendering SideBar");
178 177
         return (
179
-            <Container style={{
180
-                backgroundColor: ThemeManager.getCurrentThemeVariables().sideMenuBgColor,
181
-            }}>
178
+            <View style={{height: '100%'}}>
182 179
                 <Image source={require("../assets/drawer-cover.png")} style={styles.drawerCover}/>
183 180
                 <FlatList
184 181
                     data={this.dataSet}
@@ -186,7 +183,7 @@ export default class SideBar extends React.Component<Props, State> {
186 183
                     keyExtractor={this.listKeyExtractor}
187 184
                     renderItem={this.getRenderItem}
188 185
                 />
189
-            </Container>
186
+            </View>
190 187
         );
191 188
     }
192 189
 }

+ 10
- 7
components/WebSectionList.js View File

@@ -1,12 +1,12 @@
1 1
 // @flow
2 2
 
3 3
 import * as React from 'react';
4
-import {H3, Spinner, View} from "native-base";
5 4
 import ThemeManager from '../utils/ThemeManager';
6 5
 import WebDataManager from "../utils/WebDataManager";
7 6
 import {MaterialCommunityIcons} from "@expo/vector-icons";
8 7
 import i18n from "i18n-js";
9
-import {RefreshControl, SectionList} from "react-native";
8
+import {ActivityIndicator, Subheading} from 'react-native-paper';
9
+import {RefreshControl, SectionList, View} from "react-native";
10 10
 
11 11
 type Props = {
12 12
     navigation: Object,
@@ -148,22 +148,25 @@ export default class WebSectionList extends React.Component<Props, State> {
148 148
                     marginBottom: 20
149 149
                 }}>
150 150
                     {this.state.refreshing ?
151
-                        <Spinner/>
151
+                        <ActivityIndicator
152
+                            animating={true}
153
+                            size={'large'}
154
+                            color={ThemeManager.getCurrentThemeVariables().primary}/>
152 155
                         :
153 156
                         <MaterialCommunityIcons
154 157
                             name={item.icon}
155 158
                             size={100}
156
-                            color={ThemeManager.getCurrentThemeVariables().fetchedDataSectionListErrorText}/>}
159
+                            color={ThemeManager.getCurrentThemeVariables().textDisabled}/>}
157 160
                 </View>
158 161
 
159
-                <H3 style={{
162
+                <Subheading style={{
160 163
                     textAlign: 'center',
161 164
                     marginRight: 20,
162 165
                     marginLeft: 20,
163
-                    color: ThemeManager.getCurrentThemeVariables().fetchedDataSectionListErrorText
166
+                    color: ThemeManager.getCurrentThemeVariables().textDisabled
164 167
                 }}>
165 168
                     {item.text}
166
-                </H3>
169
+                </Subheading>
167 170
             </View>);
168 171
     }
169 172
 

+ 10
- 46
components/WebViewScreen.js View File

@@ -1,12 +1,12 @@
1 1
 // @flow
2 2
 
3 3
 import * as React from 'react';
4
-import {Platform, View} from 'react-native';
5
-import {Container, Spinner, Tab, TabHeading, Tabs, Text} from 'native-base';
4
+import {View} from 'react-native';
6 5
 import WebView from "react-native-webview";
7 6
 import Touchable from "react-native-platform-touchable";
8 7
 import {MaterialCommunityIcons} from "@expo/vector-icons";
9 8
 import ThemeManager from "../utils/ThemeManager";
9
+import {ActivityIndicator} from 'react-native-paper';
10 10
 
11 11
 type Props = {
12 12
     navigation: Object,
@@ -62,9 +62,9 @@ export default class WebViewScreen extends React.Component<Props> {
62 62
                 style={{padding: 6}}
63 63
                 onPress={clickAction}>
64 64
                 <MaterialCommunityIcons
65
-                    color={Platform.OS === 'ios' ? ThemeManager.getCurrentThemeVariables().brandPrimary : "#fff"}
66 65
                     name={icon}
67
-                    size={26}/>
66
+                    size={26}
67
+                    color={ThemeManager.getCurrentThemeVariables().text}/>
68 68
             </Touchable>
69 69
         );
70 70
     }
@@ -112,7 +112,7 @@ export default class WebViewScreen extends React.Component<Props> {
112 112
     getRenderLoading() {
113 113
         return (
114 114
             <View style={{
115
-                backgroundColor: ThemeManager.getCurrentThemeVariables().containerBgColor,
115
+                backgroundColor: ThemeManager.getCurrentThemeVariables().background,
116 116
                 position: 'absolute',
117 117
                 top: 0,
118 118
                 right: 0,
@@ -122,7 +122,10 @@ export default class WebViewScreen extends React.Component<Props> {
122 122
                 alignItems: 'center',
123 123
                 justifyContent: 'center'
124 124
             }}>
125
-                <Spinner/>
125
+                <ActivityIndicator
126
+                    animating={true}
127
+                    size={'large'}
128
+                    color={ThemeManager.getCurrentThemeVariables().primary}/>
126 129
             </View>
127 130
         );
128 131
     }
@@ -144,50 +147,11 @@ export default class WebViewScreen extends React.Component<Props> {
144 147
         );
145 148
     }
146 149
 
147
-    getTabbedWebview() {
148
-        let tabbedView = [];
149
-        for (let i = 0; i < this.props.data.length; i++) {
150
-            tabbedView.push(
151
-                <Tab heading={
152
-                    <TabHeading>
153
-                        <MaterialCommunityIcons
154
-                            name={this.props.data[i]['icon']}
155
-                            color={ThemeManager.getCurrentThemeVariables().tabIconColor}
156
-                            size={20}
157
-                        />
158
-                        <Text>{this.props.data[i]['name']}</Text>
159
-                    </TabHeading>}
160
-                     key={this.props.data[i]['url']}
161
-                     style={{backgroundColor: ThemeManager.getCurrentThemeVariables().containerBgColor}}>
162
-                    {this.getWebview(this.props.data[i])}
163
-                </Tab>);
164
-        }
165
-        return tabbedView;
166
-    }
167
-
168 150
     render() {
169 151
         // console.log("rendering WebViewScreen");
170
-        const nav = this.props.navigation;
171 152
         this.webviewArray = [];
172 153
         return (
173
-            <Container>
174
-                {this.props.data.length === 1 ?
175
-                    this.getWebview(this.props.data[0]) :
176
-                    <Tabs
177
-                        tabContainerStyle={{
178
-                            elevation: 0, // Fix for android shadow
179
-                        }}
180
-                        locked={true}
181
-                        style={{
182
-                            backgroundColor: Platform.OS === 'ios' ?
183
-                                ThemeManager.getCurrentThemeVariables().tabDefaultBg :
184
-                                ThemeManager.getCurrentThemeVariables().brandPrimary
185
-                        }}
186
-
187
-                    >
188
-                        {this.getTabbedWebview()}
189
-                    </Tabs>}
190
-            </Container>
154
+            this.getWebview(this.props.data[0])
191 155
         );
192 156
     }
193 157
 }

+ 0
- 39
native-base-theme/components/Badge.js View File

@@ -1,39 +0,0 @@
1
-// @flow
2
-
3
-import variable from './../variables/platform';
4
-import { PLATFORM } from './../variables/commonColor';
5
-
6
-export default (variables /* : * */ = variable) => {
7
-  const badgeTheme = {
8
-    '.primary': {
9
-      backgroundColor: variables.buttonPrimaryBg
10
-    },
11
-    '.warning': {
12
-      backgroundColor: variables.buttonWarningBg
13
-    },
14
-    '.info': {
15
-      backgroundColor: variables.buttonInfoBg
16
-    },
17
-    '.success': {
18
-      backgroundColor: variables.buttonSuccessBg
19
-    },
20
-    '.danger': {
21
-      backgroundColor: variables.buttonDangerBg
22
-    },
23
-    'NativeBase.Text': {
24
-      color: variables.badgeColor,
25
-      fontSize: variables.fontSizeBase,
26
-      lineHeight: variables.lineHeight - 1,
27
-      textAlign: 'center',
28
-      paddingHorizontal: 3
29
-    },
30
-    backgroundColor: variables.badgeBg,
31
-    padding: variables.badgePadding,
32
-    paddingHorizontal: 6,
33
-    alignSelf: 'flex-start',
34
-    justifyContent: variables.platform === PLATFORM.IOS ? 'center' : undefined,
35
-    borderRadius: 13.5,
36
-    height: 27
37
-  };
38
-  return badgeTheme;
39
-};

+ 0
- 11
native-base-theme/components/Body.js View File

@@ -1,11 +0,0 @@
1
-// @flow
2
-
3
-export default () => {
4
-  const bodyTheme = {
5
-    flex: 1,
6
-    alignItems: 'center',
7
-    alignSelf: 'center'
8
-  };
9
-
10
-  return bodyTheme;
11
-};

+ 0
- 386
native-base-theme/components/Button.js View File

@@ -1,386 +0,0 @@
1
-// @flow
2
-
3
-import variable from './../variables/platform';
4
-import { PLATFORM } from './../variables/commonColor';
5
-
6
-export default (variables /* : * */ = variable) => {
7
-  const platformStyle = variables.platformStyle;
8
-  const platform = variables.platform;
9
-  const darkCommon = {
10
-    'NativeBase.Text': {
11
-      color: variables.brandDark
12
-    },
13
-    'NativeBase.Icon': {
14
-      color: variables.brandDark
15
-    },
16
-    'NativeBase.IconNB': {
17
-      color: variables.brandDark
18
-    }
19
-  };
20
-  const lightCommon = {
21
-    'NativeBase.Text': {
22
-      color: variables.brandLight
23
-    },
24
-    'NativeBase.Icon': {
25
-      color: variables.brandLight
26
-    },
27
-    'NativeBase.IconNB': {
28
-      color: variables.brandLight
29
-    }
30
-  };
31
-  const primaryCommon = {
32
-    'NativeBase.Text': {
33
-      color: variables.buttonPrimaryBg
34
-    },
35
-    'NativeBase.Icon': {
36
-      color: variables.buttonPrimaryBg
37
-    },
38
-    'NativeBase.IconNB': {
39
-      color: variables.buttonPrimaryBg
40
-    }
41
-  };
42
-  const successCommon = {
43
-    'NativeBase.Text': {
44
-      color: variables.buttonSuccessBg
45
-    },
46
-    'NativeBase.Icon': {
47
-      color: variables.buttonSuccessBg
48
-    },
49
-    'NativeBase.IconNB': {
50
-      color: variables.buttonSuccessBg
51
-    }
52
-  };
53
-  const infoCommon = {
54
-    'NativeBase.Text': {
55
-      color: variables.buttonInfoBg
56
-    },
57
-    'NativeBase.Icon': {
58
-      color: variables.buttonInfoBg
59
-    },
60
-    'NativeBase.IconNB': {
61
-      color: variables.buttonInfoBg
62
-    }
63
-  };
64
-  const warningCommon = {
65
-    'NativeBase.Text': {
66
-      color: variables.buttonWarningBg
67
-    },
68
-    'NativeBase.Icon': {
69
-      color: variables.buttonWarningBg
70
-    },
71
-    'NativeBase.IconNB': {
72
-      color: variables.buttonWarningBg
73
-    }
74
-  };
75
-  const dangerCommon = {
76
-    'NativeBase.Text': {
77
-      color: variables.buttonDangerBg
78
-    },
79
-    'NativeBase.Icon': {
80
-      color: variables.buttonDangerBg
81
-    },
82
-    'NativeBase.IconNB': {
83
-      color: variables.buttonDangerBg
84
-    }
85
-  };
86
-  const buttonTheme = {
87
-    '.disabled': {
88
-      '.transparent': {
89
-        backgroundColor: 'transparent',
90
-        'NativeBase.Text': {
91
-          color: variables.buttonDisabledBg
92
-        },
93
-        'NativeBase.Icon': {
94
-          color: variables.buttonDisabledBg
95
-        },
96
-        'NativeBase.IconNB': {
97
-          color: variables.buttonDisabledBg
98
-        }
99
-      },
100
-      'NativeBase.Icon': {
101
-        color: variables.brandLight
102
-      },
103
-      'NativeBase.IconNB': {
104
-        color: variables.brandLight
105
-      },
106
-      backgroundColor: variables.buttonDisabledBg
107
-    },
108
-    '.bordered': {
109
-      '.dark': {
110
-        ...darkCommon,
111
-        backgroundColor: 'transparent',
112
-        borderColor: variables.brandDark,
113
-        borderWidth: variables.borderWidth * 2
114
-      },
115
-      '.light': {
116
-        ...lightCommon,
117
-        backgroundColor: 'transparent',
118
-        borderColor: variables.brandLight,
119
-        borderWidth: variables.borderWidth * 2
120
-      },
121
-      '.primary': {
122
-        ...primaryCommon,
123
-        backgroundColor: 'transparent',
124
-        borderColor: variables.buttonPrimaryBg,
125
-        borderWidth: variables.borderWidth * 2
126
-      },
127
-      '.success': {
128
-        ...successCommon,
129
-        backgroundColor: 'transparent',
130
-        borderColor: variables.buttonSuccessBg,
131
-        borderWidth: variables.borderWidth * 2
132
-      },
133
-      '.info': {
134
-        ...infoCommon,
135
-        backgroundColor: 'transparent',
136
-        borderColor: variables.buttonInfoBg,
137
-        borderWidth: variables.borderWidth * 2
138
-      },
139
-      '.warning': {
140
-        ...warningCommon,
141
-        backgroundColor: 'transparent',
142
-        borderColor: variables.buttonWarningBg,
143
-        borderWidth: variables.borderWidth * 2
144
-      },
145
-      '.danger': {
146
-        ...dangerCommon,
147
-        backgroundColor: 'transparent',
148
-        borderColor: variables.buttonDangerBg,
149
-        borderWidth: variables.borderWidth * 2
150
-      },
151
-      '.disabled': {
152
-        backgroundColor: 'transparent',
153
-        borderColor: variables.buttonDisabledBg,
154
-        borderWidth: variables.borderWidth * 2,
155
-        'NativeBase.Text': {
156
-          color: variables.buttonDisabledBg
157
-        }
158
-      },
159
-      ...primaryCommon,
160
-      borderWidth: variables.borderWidth * 2,
161
-      elevation: null,
162
-      shadowColor: null,
163
-      shadowOffset: null,
164
-      shadowOpacity: null,
165
-      shadowRadius: null,
166
-      backgroundColor: 'transparent'
167
-    },
168
-
169
-    '.dark': {
170
-      '.bordered': {
171
-        ...darkCommon
172
-      },
173
-      backgroundColor: variables.brandDark
174
-    },
175
-    '.light': {
176
-      '.transparent': {
177
-        ...lightCommon,
178
-        backgroundColor: 'transparent'
179
-      },
180
-      '.bordered': {
181
-        ...lightCommon
182
-      },
183
-      ...darkCommon,
184
-      backgroundColor: variables.brandLight
185
-    },
186
-
187
-    '.primary': {
188
-      '.bordered': {
189
-        ...primaryCommon
190
-      },
191
-      backgroundColor: variables.buttonPrimaryBg
192
-    },
193
-
194
-    '.success': {
195
-      '.bordered': {
196
-        ...successCommon
197
-      },
198
-      backgroundColor: variables.buttonSuccessBg
199
-    },
200
-
201
-    '.info': {
202
-      '.bordered': {
203
-        ...infoCommon
204
-      },
205
-      backgroundColor: variables.buttonInfoBg
206
-    },
207
-
208
-    '.warning': {
209
-      '.bordered': {
210
-        ...warningCommon
211
-      },
212
-      backgroundColor: variables.buttonWarningBg
213
-    },
214
-
215
-    '.danger': {
216
-      '.bordered': {
217
-        ...dangerCommon
218
-      },
219
-      backgroundColor: variables.buttonDangerBg
220
-    },
221
-
222
-    '.block': {
223
-      justifyContent: 'center',
224
-      alignSelf: 'stretch'
225
-    },
226
-
227
-    '.full': {
228
-      justifyContent: 'center',
229
-      alignSelf: 'stretch',
230
-      borderRadius: 0
231
-    },
232
-
233
-    '.rounded': {
234
-      borderRadius: variables.borderRadiusLarge
235
-    },
236
-
237
-    '.transparent': {
238
-      backgroundColor: 'transparent',
239
-      elevation: 0,
240
-      shadowColor: null,
241
-      shadowOffset: null,
242
-      shadowRadius: null,
243
-      shadowOpacity: null,
244
-      ...primaryCommon,
245
-      '.dark': {
246
-        ...darkCommon,
247
-      },
248
-      '.danger': {
249
-        ...dangerCommon,
250
-      },
251
-      '.warning': {
252
-        ...warningCommon,
253
-      },
254
-      '.info': {
255
-        ...infoCommon,
256
-      },
257
-      '.primary': {
258
-        ...primaryCommon,
259
-      },
260
-      '.success': {
261
-        ...successCommon,
262
-      },
263
-      '.light': {
264
-        ...lightCommon,
265
-      },
266
-      '.disabled': {
267
-        backgroundColor: 'transparent',
268
-        borderColor: variables.buttonDisabledBg,
269
-        borderWidth: variables.borderWidth * 2,
270
-        'NativeBase.Text': {
271
-          color: variables.buttonDisabledBg
272
-        },
273
-        'NativeBase.Icon': {
274
-          color: variables.buttonDisabledBg
275
-        },
276
-        'NativeBase.IconNB': {
277
-          color: variables.buttonDisabledBg
278
-        }
279
-      }
280
-    },
281
-
282
-    '.small': {
283
-      height: 30,
284
-      'NativeBase.Text': {
285
-        fontSize: 14
286
-      },
287
-      'NativeBase.Icon': {
288
-        fontSize: 20,
289
-        paddingTop: 0
290
-      },
291
-      'NativeBase.IconNB': {
292
-        fontSize: 20,
293
-        paddingTop: 0
294
-      }
295
-    },
296
-
297
-    '.large': {
298
-      height: 60,
299
-      'NativeBase.Text': {
300
-        fontSize: 22
301
-      }
302
-    },
303
-
304
-    '.capitalize': {},
305
-
306
-    '.vertical': {
307
-      flexDirection: 'column',
308
-      height: null
309
-    },
310
-
311
-    'NativeBase.Text': {
312
-      fontFamily: variables.buttonFontFamily,
313
-      marginLeft: 0,
314
-      marginRight: 0,
315
-      color: variables.buttonTextColor,
316
-      fontSize: variables.buttonTextSize,
317
-      paddingHorizontal: 16,
318
-      backgroundColor: 'transparent'
319
-    },
320
-
321
-    'NativeBase.Icon': {
322
-      color: variables.buttonTextColor,
323
-      fontSize: 24,
324
-      marginHorizontal: 16,
325
-      paddingTop: platform === PLATFORM.IOS ? 2 : undefined
326
-    },
327
-    'NativeBase.IconNB': {
328
-      color: variables.buttonTextColor,
329
-      fontSize: 24,
330
-      marginHorizontal: 16,
331
-      paddingTop: platform === PLATFORM.IOS ? 2 : undefined
332
-    },
333
-
334
-    '.iconLeft': {
335
-      'NativeBase.Text': {
336
-        marginLeft: 0
337
-      },
338
-      'NativeBase.IconNB': {
339
-        marginRight: 0,
340
-        marginLeft: 16
341
-      },
342
-      'NativeBase.Icon': {
343
-        marginRight: 0,
344
-        marginLeft: 16
345
-      }
346
-    },
347
-    '.iconRight': {
348
-      'NativeBase.Text': {
349
-        marginRight: 0
350
-      },
351
-      'NativeBase.IconNB': {
352
-        marginLeft: 0,
353
-        marginRight: 16
354
-      },
355
-      'NativeBase.Icon': {
356
-        marginLeft: 0,
357
-        marginRight: 16
358
-      }
359
-    },
360
-    '.picker': {
361
-      'NativeBase.Text': {
362
-        '.note': {
363
-          fontSize: 16,
364
-          lineHeight: null
365
-        }
366
-      }
367
-    },
368
-    paddingVertical: variables.buttonPadding,
369
-    backgroundColor: variables.buttonPrimaryBg,
370
-    borderRadius: variables.borderRadiusBase,
371
-    borderColor: variables.buttonPrimaryBg,
372
-    borderWidth: null,
373
-    height: 45,
374
-    flexDirection: 'row',
375
-    elevation: 2,
376
-    shadowColor:
377
-      platformStyle === PLATFORM.MATERIAL ? variables.brandDark : undefined,
378
-    shadowOffset:
379
-      platformStyle === PLATFORM.MATERIAL ? { width: 0, height: 2 } : undefined,
380
-    shadowOpacity: platformStyle === PLATFORM.MATERIAL ? 0.2 : undefined,
381
-    shadowRadius: platformStyle === PLATFORM.MATERIAL ? 1.2 : undefined,
382
-    alignItems: 'center',
383
-    justifyContent: 'space-between'
384
-  };
385
-  return buttonTheme;
386
-};

+ 0
- 37
native-base-theme/components/Card.js View File

@@ -1,37 +0,0 @@
1
-// @flow
2
-
3
-import variable from './../variables/platform';
4
-
5
-export default (variables /* : * */ = variable) => {
6
-  const cardTheme = {
7
-    '.transparent': {
8
-      shadowColor: null,
9
-      shadowOffset: null,
10
-      shadowOpacity: null,
11
-      shadowRadius: null,
12
-      elevation: null,
13
-      backgroundColor: 'transparent',
14
-      borderWidth: 0
15
-    },
16
-    '.noShadow': {
17
-      shadowColor: null,
18
-      shadowOffset: null,
19
-      shadowOpacity: null,
20
-      elevation: null
21
-    },
22
-    marginVertical: 5,
23
-    marginHorizontal: 2,
24
-    borderWidth: variables.borderWidth,
25
-    borderRadius: variables.cardBorderRadius,
26
-    borderColor: variables.cardBorderColor,
27
-    flexWrap: 'nowrap',
28
-    backgroundColor: variables.cardDefaultBg,
29
-    shadowColor: '#000',
30
-    shadowOffset: { width: 0, height: 2 },
31
-    shadowOpacity: 0.1,
32
-    shadowRadius: 1.5,
33
-    elevation: 3
34
-  };
35
-
36
-  return cardTheme;
37
-};

+ 0
- 198
native-base-theme/components/CardItem.js View File

@@ -1,198 +0,0 @@
1
-// @flow
2
-
3
-import { StyleSheet } from 'react-native';
4
-
5
-import variable from './../variables/platform';
6
-import { PLATFORM } from './../variables/commonColor';
7
-
8
-export default (variables /* : * */ = variable) => {
9
-  const platform = variables.platform;
10
-  const transparentBtnCommon = {
11
-    'NativeBase.Text': {
12
-      fontSize: variables.DefaultFontSize - 3,
13
-      color: variables.sTabBarActiveTextColor
14
-    },
15
-    'NativeBase.Icon': {
16
-      fontSize: variables.iconFontSize - 10,
17
-      color: variables.sTabBarActiveTextColor,
18
-      marginHorizontal: null
19
-    },
20
-    'NativeBase.IconNB': {
21
-      fontSize: variables.iconFontSize - 10,
22
-      color: variables.sTabBarActiveTextColor
23
-    },
24
-    paddingVertical: null,
25
-    paddingHorizontal: null
26
-  };
27
-
28
-  const cardItemTheme = {
29
-    'NativeBase.Left': {
30
-      'NativeBase.Body': {
31
-        'NativeBase.Text': {
32
-          '.note': {
33
-            color: variables.listNoteColor,
34
-            fontWeight: '400',
35
-            marginRight: 20
36
-          }
37
-        },
38
-        flex: 1,
39
-        marginLeft: 10,
40
-        alignItems: null
41
-      },
42
-      'NativeBase.Icon': {
43
-        fontSize: variables.iconFontSize
44
-      },
45
-      'NativeBase.IconNB': {
46
-        fontSize: variables.iconFontSize
47
-      },
48
-      'NativeBase.Text': {
49
-        marginLeft: 10,
50
-        alignSelf: 'center'
51
-      },
52
-      'NativeBase.Button': {
53
-        '.transparent': {
54
-          ...transparentBtnCommon,
55
-          paddingRight: variables.cardItemPadding + 5
56
-        }
57
-      },
58
-      flex: 1,
59
-      flexDirection: 'row',
60
-      alignItems: 'center'
61
-    },
62
-    '.content': {
63
-      'NativeBase.Text': {
64
-        color: platform === PLATFORM.IOS ? '#555' : '#222',
65
-        fontSize: variables.DefaultFontSize - 2
66
-      }
67
-    },
68
-    '.cardBody': {
69
-      padding: -5,
70
-      'NativeBase.Text': {
71
-        marginTop: 5
72
-      }
73
-    },
74
-    'NativeBase.Body': {
75
-      'NativeBase.Text': {
76
-        '.note': {
77
-          color: variables.listNoteColor,
78
-          fontWeight: '200',
79
-          marginRight: 20
80
-        }
81
-      },
82
-      'NativeBase.Button': {
83
-        '.transparent': {
84
-          ...transparentBtnCommon,
85
-          paddingRight: variables.cardItemPadding + 5,
86
-          alignSelf: 'stretch'
87
-        }
88
-      },
89
-      flex: 1,
90
-      alignSelf: 'stretch',
91
-      alignItems: 'flex-start'
92
-    },
93
-    'NativeBase.Right': {
94
-      'NativeBase.Badge': {
95
-        alignSelf: null
96
-      },
97
-      'NativeBase.Button': {
98
-        '.transparent': {
99
-          ...transparentBtnCommon
100
-        },
101
-        alignSelf: null
102
-      },
103
-      'NativeBase.Icon': {
104
-        alignSelf: null,
105
-        fontSize: variables.iconFontSize - 8,
106
-        color: variables.cardBorderColor
107
-      },
108
-      'NativeBase.IconNB': {
109
-        alignSelf: null,
110
-        fontSize: variables.iconFontSize - 8,
111
-        color: variables.cardBorderColor
112
-      },
113
-      'NativeBase.Text': {
114
-        fontSize: variables.DefaultFontSize - 1,
115
-        alignSelf: null
116
-      },
117
-      'NativeBase.Thumbnail': {
118
-        alignSelf: null
119
-      },
120
-      'NativeBase.Image': {
121
-        alignSelf: null
122
-      },
123
-      'NativeBase.Radio': {
124
-        alignSelf: null
125
-      },
126
-      'NativeBase.Checkbox': {
127
-        alignSelf: null
128
-      },
129
-      'NativeBase.Switch': {
130
-        alignSelf: null
131
-      },
132
-      flex: 0.8
133
-    },
134
-    '.header': {
135
-      'NativeBase.Text': {
136
-        fontSize: 16,
137
-        fontWeight: platform === PLATFORM.IOS ? '600' : '500'
138
-      },
139
-      '.bordered': {
140
-        'NativeBase.Text': {
141
-          color: variables.brandPrimary,
142
-          fontWeight: platform === PLATFORM.IOS ? '600' : '500'
143
-        },
144
-        borderBottomWidth: variables.borderWidth
145
-      },
146
-      borderBottomWidth: null,
147
-      paddingVertical: variables.cardItemPadding + 5
148
-    },
149
-    '.footer': {
150
-      'NativeBase.Text': {
151
-        fontSize: 16,
152
-        fontWeight: platform === PLATFORM.IOS ? '600' : '500'
153
-      },
154
-      '.bordered': {
155
-        'NativeBase.Text': {
156
-          color: variables.brandPrimary,
157
-          fontWeight: platform === PLATFORM.IOS ? '600' : '500'
158
-        },
159
-        borderTopWidth: variables.borderWidth
160
-      },
161
-      borderBottomWidth: null
162
-    },
163
-    'NativeBase.Text': {
164
-      '.note': {
165
-        color: variables.listNoteColor,
166
-        fontWeight: '200'
167
-      }
168
-    },
169
-    'NativeBase.Icon': {
170
-      width: variables.iconFontSize + 5,
171
-      fontSize: variables.iconFontSize - 2
172
-    },
173
-    'NativeBase.IconNB': {
174
-      width: variables.iconFontSize + 5,
175
-      fontSize: variables.iconFontSize - 2
176
-    },
177
-    '.bordered': {
178
-      borderBottomWidth: StyleSheet.hairlineWidth,
179
-      borderColor: variables.cardBorderColor
180
-    },
181
-    '.first': {
182
-      borderTopLeftRadius: variables.cardBorderRadius,
183
-      borderTopRightRadius: variables.cardBorderRadius
184
-    },
185
-    '.last': {
186
-      borderBottomLeftRadius: variables.cardBorderRadius,
187
-      borderBottomRightRadius: variables.cardBorderRadius
188
-    },
189
-    flexDirection: 'row',
190
-    alignItems: 'center',
191
-    borderRadius: variables.cardBorderRadius,
192
-    padding: variables.cardItemPadding + 5,
193
-    paddingVertical: variables.cardItemPadding,
194
-    backgroundColor: variables.cardDefaultBg
195
-  };
196
-
197
-  return cardItemTheme;
198
-};

+ 0
- 38
native-base-theme/components/CheckBox.js View File

@@ -1,38 +0,0 @@
1
-// @flow
2
-
3
-import variable from './../variables/platform';
4
-
5
-export default (variables /* : * */ = variable) => {
6
-  const checkBoxTheme = {
7
-    '.checked': {
8
-      'NativeBase.Icon': {
9
-        color: variables.checkboxTickColor
10
-      },
11
-      'NativeBase.IconNB': {
12
-        color: variables.checkboxTickColor
13
-      }
14
-    },
15
-    'NativeBase.Icon': {
16
-      color: 'transparent',
17
-      lineHeight: variables.CheckboxIconSize,
18
-      marginTop: variables.CheckboxIconMarginTop,
19
-      fontSize: variables.CheckboxFontSize
20
-    },
21
-    'NativeBase.IconNB': {
22
-      color: 'transparent',
23
-      lineHeight: variables.CheckboxIconSize,
24
-      marginTop: variables.CheckboxIconMarginTop,
25
-      fontSize: variables.CheckboxFontSize
26
-    },
27
-    borderRadius: variables.CheckboxRadius,
28
-    overflow: 'hidden',
29
-    width: variables.checkboxSize,
30
-    height: variables.checkboxSize,
31
-    borderWidth: variables.CheckboxBorderWidth,
32
-    paddingLeft: variables.CheckboxPaddingLeft - 1,
33
-    paddingBottom: variables.CheckboxPaddingBottom,
34
-    left: 10
35
-  };
36
-
37
-  return checkBoxTheme;
38
-};

+ 0
- 17
native-base-theme/components/Container.js View File

@@ -1,17 +0,0 @@
1
-// @flow
2
-
3
-import { Platform, Dimensions } from 'react-native';
4
-
5
-import variable from './../variables/platform';
6
-import { PLATFORM } from './../variables/commonColor';
7
-
8
-const deviceHeight = Dimensions.get('window').height;
9
-export default (variables /* : * */ = variable) => {
10
-  const theme = {
11
-    flex: 1,
12
-    height: Platform.OS === PLATFORM.IOS ? deviceHeight : deviceHeight - 20,
13
-    backgroundColor: variables.containerBgColor
14
-  };
15
-
16
-  return theme;
17
-};

+ 0
- 14
native-base-theme/components/Content.js View File

@@ -1,14 +0,0 @@
1
-// @flow
2
-
3
-export default () => {
4
-  const contentTheme = {
5
-    flex: 1,
6
-    backgroundColor: 'transparent',
7
-    'NativeBase.Segment': {
8
-      borderWidth: 0,
9
-      backgroundColor: 'transparent'
10
-    }
11
-  };
12
-
13
-  return contentTheme;
14
-};

+ 0
- 25
native-base-theme/components/Fab.js View File

@@ -1,25 +0,0 @@
1
-// @flow
2
-
3
-export default () => {
4
-  const fabTheme = {
5
-    'NativeBase.Button': {
6
-      alignItems: 'center',
7
-      padding: null,
8
-      justifyContent: 'center',
9
-      'NativeBase.Icon': {
10
-        alignSelf: 'center',
11
-        fontSize: 20,
12
-        marginLeft: 0,
13
-        marginRight: 0
14
-      },
15
-      'NativeBase.IconNB': {
16
-        alignSelf: 'center',
17
-        fontSize: 20,
18
-        marginLeft: 0,
19
-        marginRight: 0
20
-      }
21
-    }
22
-  };
23
-
24
-  return fabTheme;
25
-};

+ 0
- 119
native-base-theme/components/Footer.js View File

@@ -1,119 +0,0 @@
1
-// @flow
2
-
3
-import variable from './../variables/platform';
4
-import { PLATFORM } from './../variables/commonColor';
5
-
6
-export default (variables /* : * */ = variable) => {
7
-  const platformStyle = variables.platformStyle;
8
-  const platform = variables.platform;
9
-
10
-  const iconCommon = {
11
-    'NativeBase.Icon': {
12
-      color: variables.tabBarActiveTextColor
13
-    }
14
-  };
15
-  const iconNBCommon = {
16
-    'NativeBase.IconNB': {
17
-      color: variables.tabBarActiveTextColor
18
-    }
19
-  };
20
-  const textCommon = {
21
-    'NativeBase.Text': {
22
-      color: variables.tabBarActiveTextColor
23
-    }
24
-  };
25
-  const footerTheme = {
26
-    'NativeBase.Left': {
27
-      'NativeBase.Button': {
28
-        '.transparent': {
29
-          backgroundColor: 'transparent',
30
-          borderColor: null,
31
-          elevation: 0,
32
-          shadowColor: null,
33
-          shadowOffset: null,
34
-          shadowRadius: null,
35
-          shadowOpacity: null,
36
-          ...iconCommon,
37
-          ...iconNBCommon,
38
-          ...textCommon
39
-        },
40
-        alignSelf: null,
41
-        ...iconCommon,
42
-        ...iconNBCommon
43
-        // ...textCommon
44
-      },
45
-      flex: 1,
46
-      alignSelf: 'center',
47
-      alignItems: 'flex-start'
48
-    },
49
-    'NativeBase.Body': {
50
-      flex: 1,
51
-      alignItems: 'center',
52
-      alignSelf: 'center',
53
-      flexDirection: 'row',
54
-      'NativeBase.Button': {
55
-        alignSelf: 'center',
56
-        '.transparent': {
57
-          backgroundColor: 'transparent',
58
-          borderColor: null,
59
-          elevation: 0,
60
-          shadowColor: null,
61
-          shadowOffset: null,
62
-          shadowRadius: null,
63
-          shadowOpacity: null,
64
-          ...iconCommon,
65
-          ...iconNBCommon,
66
-          ...textCommon
67
-        },
68
-        '.full': {
69
-          height: variables.footerHeight,
70
-          paddingBottom: variables.footerPaddingBottom,
71
-          flex: 1
72
-        },
73
-        ...iconCommon,
74
-        ...iconNBCommon
75
-        // ...textCommon
76
-      }
77
-    },
78
-    'NativeBase.Right': {
79
-      'NativeBase.Button': {
80
-        '.transparent': {
81
-          backgroundColor: 'transparent',
82
-          borderColor: null,
83
-          elevation: 0,
84
-          shadowColor: null,
85
-          shadowOffset: null,
86
-          shadowRadius: null,
87
-          shadowOpacity: null,
88
-          ...iconCommon,
89
-          ...iconNBCommon,
90
-          ...textCommon
91
-        },
92
-        alignSelf: null,
93
-        ...iconCommon,
94
-        ...iconNBCommon
95
-        // ...textCommon
96
-      },
97
-      flex: 1,
98
-      alignSelf: 'center',
99
-      alignItems: 'flex-end'
100
-    },
101
-    backgroundColor: variables.footerDefaultBg,
102
-    flexDirection: 'row',
103
-    justifyContent: 'center',
104
-    borderTopWidth:
105
-      platform === PLATFORM.IOS && platformStyle !== PLATFORM.MATERIAL
106
-        ? variables.borderWidth
107
-        : undefined,
108
-    borderColor:
109
-      platform === PLATFORM.IOS && platformStyle !== PLATFORM.MATERIAL
110
-        ? '#cbcbcb'
111
-        : undefined,
112
-    height: variables.footerHeight,
113
-    paddingBottom: variables.footerPaddingBottom,
114
-    elevation: 3,
115
-    left: 0,
116
-    right: 0
117
-  };
118
-  return footerTheme;
119
-};

+ 0
- 79
native-base-theme/components/FooterTab.js View File

@@ -1,79 +0,0 @@
1
-// @flow
2
-
3
-import { Platform } from 'react-native';
4
-
5
-import variable from './../variables/platform';
6
-import { PLATFORM } from './../variables/commonColor';
7
-
8
-export default (variables /* : * */ = variable) => {
9
-  const platform = variables.platform;
10
-
11
-  const footerTabTheme = {
12
-    'NativeBase.Button': {
13
-      '.active': {
14
-        'NativeBase.Text': {
15
-          color: variables.tabBarActiveTextColor,
16
-          fontSize: variables.tabBarTextSize,
17
-          lineHeight: 16
18
-        },
19
-        'NativeBase.Icon': {
20
-          color: variables.tabBarActiveTextColor
21
-        },
22
-        'NativeBase.IconNB': {
23
-          color: variables.tabBarActiveTextColor
24
-        },
25
-        backgroundColor: variables.tabActiveBgColor
26
-      },
27
-      flexDirection: null,
28
-      backgroundColor: 'transparent',
29
-      borderColor: null,
30
-      elevation: 0,
31
-      shadowColor: null,
32
-      shadowOffset: null,
33
-      shadowRadius: null,
34
-      shadowOpacity: null,
35
-      alignSelf: 'center',
36
-      flex: 1,
37
-      height: variables.footerHeight,
38
-      justifyContent: 'center',
39
-      '.badge': {
40
-        'NativeBase.Badge': {
41
-          'NativeBase.Text': {
42
-            fontSize: 11,
43
-            fontWeight: platform === PLATFORM.IOS ? '600' : undefined,
44
-            lineHeight: 14
45
-          },
46
-          top: -3,
47
-          alignSelf: 'center',
48
-          left: 10,
49
-          zIndex: 99,
50
-          height: 18,
51
-          padding: 1.7,
52
-          paddingHorizontal: 3
53
-        },
54
-        'NativeBase.Icon': {
55
-          marginTop: -18
56
-        }
57
-      },
58
-      'NativeBase.Icon': {
59
-        color: variables.tabBarTextColor
60
-      },
61
-      'NativeBase.IconNB': {
62
-        color: variables.tabBarTextColor
63
-      },
64
-      'NativeBase.Text': {
65
-        color: variables.tabBarTextColor,
66
-        fontSize: variables.tabBarTextSize,
67
-        lineHeight: 16
68
-      }
69
-    },
70
-    backgroundColor:
71
-      Platform.OS === PLATFORM.ANDROID ? variables.footerDefaultBg : undefined,
72
-    flexDirection: 'row',
73
-    justifyContent: 'space-between',
74
-    flex: 1,
75
-    alignSelf: 'stretch'
76
-  };
77
-
78
-  return footerTabTheme;
79
-};

+ 0
- 86
native-base-theme/components/Form.js View File

@@ -1,86 +0,0 @@
1
-// @flow
2
-
3
-export default () => {
4
-  const theme = {
5
-    'NativeBase.Item': {
6
-      '.fixedLabel': {
7
-        'NativeBase.Label': {
8
-          paddingLeft: null
9
-        },
10
-        marginLeft: 15
11
-      },
12
-      '.inlineLabel': {
13
-        'NativeBase.Label': {
14
-          paddingLeft: null
15
-        },
16
-        marginLeft: 15
17
-      },
18
-      '.placeholderLabel': {
19
-        'NativeBase.Input': {}
20
-      },
21
-      '.stackedLabel': {
22
-        'NativeBase.Label': {
23
-          top: 5,
24
-          paddingLeft: null
25
-        },
26
-        'NativeBase.Input': {
27
-          paddingLeft: null,
28
-          marginLeft: null
29
-        },
30
-        'NativeBase.Icon': {
31
-          marginTop: 36
32
-        },
33
-        marginLeft: 15
34
-      },
35
-      '.floatingLabel': {
36
-        'NativeBase.Input': {
37
-          paddingLeft: null,
38
-          top: 10,
39
-          marginLeft: null
40
-        },
41
-        'NativeBase.Label': {
42
-          left: 0,
43
-          top: 6
44
-        },
45
-        'NativeBase.Icon': {
46
-          top: 6
47
-        },
48
-        marginTop: 15,
49
-        marginLeft: 15
50
-      },
51
-      '.regular': {
52
-        'NativeBase.Label': {
53
-          left: 0
54
-        },
55
-        marginLeft: 0
56
-      },
57
-      '.rounded': {
58
-        'NativeBase.Label': {
59
-          left: 0
60
-        },
61
-        marginLeft: 0
62
-      },
63
-      '.underline': {
64
-        'NativeBase.Label': {
65
-          left: 0,
66
-          top: 0,
67
-          position: 'relative'
68
-        },
69
-        'NativeBase.Input': {
70
-          left: -15
71
-        },
72
-        marginLeft: 15
73
-      },
74
-      '.last': {
75
-        marginLeft: 0,
76
-        paddingLeft: 15
77
-      },
78
-      'NativeBase.Label': {
79
-        paddingRight: 5
80
-      },
81
-      marginLeft: 15
82
-    }
83
-  };
84
-
85
-  return theme;
86
-};

+ 0
- 13
native-base-theme/components/H1.js View File

@@ -1,13 +0,0 @@
1
-// @flow
2
-
3
-import variable from './../variables/platform';
4
-
5
-export default (variables /* : * */ = variable) => {
6
-  const h1Theme = {
7
-    color: variables.textColor,
8
-    fontSize: variables.fontSizeH1,
9
-    lineHeight: variables.lineHeightH1
10
-  };
11
-
12
-  return h1Theme;
13
-};

+ 0
- 13
native-base-theme/components/H2.js View File

@@ -1,13 +0,0 @@
1
-// @flow
2
-
3
-import variable from './../variables/platform';
4
-
5
-export default (variables /* : * */ = variable) => {
6
-  const h2Theme = {
7
-    color: variables.textColor,
8
-    fontSize: variables.fontSizeH2,
9
-    lineHeight: variables.lineHeightH2
10
-  };
11
-
12
-  return h2Theme;
13
-};

+ 0
- 13
native-base-theme/components/H3.js View File

@@ -1,13 +0,0 @@
1
-// @flow
2
-
3
-import variable from './../variables/platform';
4
-
5
-export default (variables /* : * */ = variable) => {
6
-  const h3Theme = {
7
-    color: variables.textColor,
8
-    fontSize: variables.fontSizeH3,
9
-    lineHeight: variables.lineHeightH3
10
-  };
11
-
12
-  return h3Theme;
13
-};

+ 0
- 419
native-base-theme/components/Header.js View File

@@ -1,419 +0,0 @@
1
-// @flow
2
-
3
-import { PixelRatio, StatusBar } from 'react-native';
4
-
5
-import variable from './../variables/platform';
6
-import { PLATFORM } from './../variables/commonColor';
7
-
8
-export default (variables /* : * */ = variable) => {
9
-  const platformStyle = variables.platformStyle;
10
-  const platform = variables.platform;
11
-
12
-  const headerTheme = {
13
-    '.span': {
14
-      height: 128,
15
-      'NativeBase.Left': {
16
-        alignSelf: 'flex-start'
17
-      },
18
-      'NativeBase.Body': {
19
-        alignSelf: 'flex-end',
20
-        alignItems: 'flex-start',
21
-        justifyContent: 'center',
22
-        paddingBottom: 26
23
-      },
24
-      'NativeBase.Right': {
25
-        alignSelf: 'flex-start'
26
-      }
27
-    },
28
-    '.hasSubtitle': {
29
-      'NativeBase.Body': {
30
-        'NativeBase.Title': {
31
-          fontSize: variables.titleFontSize - 2,
32
-          fontFamily: variables.titleFontfamily,
33
-          textAlign: 'center',
34
-          fontWeight: '500',
35
-          paddingBottom: 3
36
-        },
37
-        'NativeBase.Subtitle': {
38
-          fontSize: variables.subTitleFontSize,
39
-          fontFamily: variables.titleFontfamily,
40
-          color: variables.subtitleColor,
41
-          textAlign: 'center'
42
-        }
43
-      }
44
-    },
45
-    '.transparent': {
46
-      backgroundColor: 'transparent',
47
-      borderBottomColor: 'transparent',
48
-      elevation: 0,
49
-      shadowColor: null,
50
-      shadowOffset: null,
51
-      shadowRadius: null,
52
-      shadowOpacity: null,
53
-      paddingTop:
54
-        platform === PLATFORM.ANDROID ? StatusBar.currentHeight : undefined,
55
-      height:
56
-        platform === PLATFORM.ANDROID
57
-          ? variables.toolbarHeight + StatusBar.currentHeight
58
-          : variables.toolbarHeight
59
-    },
60
-    '.noShadow': {
61
-      elevation: 0,
62
-      shadowColor: null,
63
-      shadowOffset: null,
64
-      shadowRadius: null,
65
-      shadowOpacity: null
66
-    },
67
-    '.hasTabs': {
68
-      elevation: 0,
69
-      shadowColor: null,
70
-      shadowOffset: null,
71
-      shadowRadius: null,
72
-      shadowOpacity: null,
73
-      borderBottomWidth: null
74
-    },
75
-    '.hasSegment': {
76
-      elevation: 0,
77
-      shadowColor: null,
78
-      shadowOffset: null,
79
-      shadowRadius: null,
80
-      shadowOpacity: null,
81
-      borderBottomWidth: null,
82
-      'NativeBase.Left': {
83
-        flex: 0.3
84
-      },
85
-      'NativeBase.Right': {
86
-        flex: 0.3
87
-      },
88
-      'NativeBase.Body': {
89
-        flex: 1,
90
-        'NativeBase.Segment': {
91
-          marginRight: 0,
92
-          alignSelf: 'center',
93
-          'NativeBase.Button': {
94
-            paddingLeft: 0,
95
-            paddingRight: 0
96
-          }
97
-        }
98
-      }
99
-    },
100
-    '.noLeft': {
101
-      'NativeBase.Left': {
102
-        width: platform === PLATFORM.IOS ? undefined : 0,
103
-        flex: platform === PLATFORM.IOS ? 1 : 0
104
-      },
105
-      'NativeBase.Body': {
106
-        'NativeBase.Title': {
107
-          paddingLeft: platform === PLATFORM.IOS ? undefined : 10
108
-        },
109
-        'NativeBase.Subtitle': {
110
-          paddingLeft: platform === PLATFORM.IOS ? undefined : 10
111
-        }
112
-      }
113
-    },
114
-    'NativeBase.Button': {
115
-      justifyContent: 'center',
116
-      alignSelf: 'center',
117
-      alignItems: 'center',
118
-      '.transparent': {
119
-        'NativeBase.Text': {
120
-          color: variables.toolbarBtnTextColor,
121
-          fontWeight: '600'
122
-        },
123
-        'NativeBase.Icon': {
124
-          color: variables.toolbarBtnColor
125
-        },
126
-        'NativeBase.IconNB': {
127
-          color: variables.toolbarBtnColor
128
-        },
129
-        paddingHorizontal: variables.buttonPadding
130
-      },
131
-      paddingHorizontal: 15
132
-    },
133
-    '.searchBar': {
134
-      'NativeBase.Item': {
135
-        'NativeBase.Icon': {
136
-          backgroundColor: 'transparent',
137
-          color: variables.dropdownLinkColor,
138
-          fontSize: variables.toolbarSearchIconSize,
139
-          alignItems: 'center',
140
-          marginTop: 2,
141
-          paddingRight: 10,
142
-          paddingLeft: 10
143
-        },
144
-        'NativeBase.IconNB': {
145
-          backgroundColor: 'transparent',
146
-          color: null,
147
-          alignSelf: 'center'
148
-        },
149
-        'NativeBase.Input': {
150
-          alignSelf: 'center',
151
-          lineHeight: null,
152
-          height: variables.searchBarInputHeight
153
-        },
154
-        alignSelf: 'center',
155
-        alignItems: 'center',
156
-        justifyContent: 'flex-start',
157
-        flex: 1,
158
-        height: variables.searchBarHeight,
159
-        borderColor: 'transparent',
160
-        backgroundColor: variables.toolbarInputColor
161
-      },
162
-      'NativeBase.Button': {
163
-        '.transparent': {
164
-          'NativeBase.Text': {
165
-            fontWeight: '500'
166
-          },
167
-          paddingHorizontal: null,
168
-          paddingLeft: platform === PLATFORM.IOS ? 10 : null
169
-        },
170
-        paddingHorizontal: platform === PLATFORM.IOS ? undefined : null,
171
-        width: platform === PLATFORM.IOS ? undefined : 0,
172
-        height: platform === PLATFORM.IOS ? undefined : 0
173
-      }
174
-    },
175
-    '.rounded': {
176
-      'NativeBase.Item': {
177
-        borderRadius:
178
-          platform === PLATFORM.IOS && platformStyle !== PLATFORM.MATERIAL
179
-            ? 25
180
-            : 3
181
-      }
182
-    },
183
-    'NativeBase.Left': {
184
-      'NativeBase.Button': {
185
-        '.hasText': {
186
-          marginLeft: -10,
187
-          height: 30,
188
-          'NativeBase.Icon': {
189
-            color: variables.toolbarBtnColor,
190
-            fontSize: variables.iconHeaderSize,
191
-            marginTop: 2,
192
-            marginRight: 5,
193
-            marginLeft: 2
194
-          },
195
-          'NativeBase.Text': {
196
-            color: variables.toolbarBtnTextColor,
197
-            fontSize: platform === PLATFORM.IOS ? 17 : 0,
198
-            marginLeft: 7,
199
-            lineHeight: 19.5
200
-          },
201
-          'NativeBase.IconNB': {
202
-            color: variables.toolbarBtnColor,
203
-            fontSize: variables.iconHeaderSize,
204
-            marginTop: 2,
205
-            marginRight: 5,
206
-            marginLeft: 2
207
-          }
208
-        },
209
-        '.transparent': {
210
-          marginLeft:
211
-            platform === PLATFORM.IOS && platformStyle !== PLATFORM.MATERIAL
212
-              ? -3
213
-              : 0,
214
-          'NativeBase.Icon': {
215
-            color: variables.toolbarBtnColor,
216
-            fontSize:
217
-              platform === PLATFORM.IOS &&
218
-              variables.platformStyle !== PLATFORM.MATERIAL
219
-                ? variables.iconHeaderSize + 1
220
-                : variables.iconHeaderSize,
221
-            marginTop: 0,
222
-            marginRight: 2,
223
-            marginLeft: 1,
224
-            paddingTop: 1
225
-          },
226
-          'NativeBase.IconNB': {
227
-            color: variables.toolbarBtnColor,
228
-            fontSize:
229
-              platform === PLATFORM.IOS &&
230
-              variables.platformStyle !== PLATFORM.MATERIAL
231
-                ? variables.iconHeaderSize + 1
232
-                : variables.iconHeaderSize - 2,
233
-            marginTop: 0,
234
-            marginRight: 2,
235
-            marginLeft: 1,
236
-            paddingTop: 1
237
-          },
238
-          'NativeBase.Text': {
239
-            color: variables.toolbarBtnTextColor,
240
-            fontSize: platform === PLATFORM.IOS ? 17 : 0,
241
-            top: platform === PLATFORM.IOS ? 1 : -1.5,
242
-            paddingLeft:
243
-              platform === PLATFORM.IOS && platformStyle !== PLATFORM.MATERIAL
244
-                ? 2
245
-                : 5,
246
-            paddingRight:
247
-              platform === PLATFORM.IOS && platformStyle !== PLATFORM.MATERIAL
248
-                ? undefined
249
-                : 10
250
-          },
251
-          backgroundColor: 'transparent',
252
-          borderColor: null,
253
-          elevation: 0,
254
-          shadowColor: null,
255
-          shadowOffset: null,
256
-          shadowRadius: null,
257
-          shadowOpacity: null
258
-        },
259
-        'NativeBase.Icon': {
260
-          color: variables.toolbarBtnColor
261
-        },
262
-        'NativeBase.IconNB': {
263
-          color: variables.toolbarBtnColor
264
-        },
265
-        alignSelf: null,
266
-        paddingRight: variables.buttonPadding,
267
-        paddingLeft:
268
-          platform === PLATFORM.IOS && platformStyle !== PLATFORM.MATERIAL
269
-            ? 4
270
-            : 8
271
-      },
272
-      flex:
273
-        platform === PLATFORM.IOS && platformStyle !== PLATFORM.MATERIAL
274
-          ? 1
275
-          : 0.4,
276
-      alignSelf: 'center',
277
-      alignItems: 'flex-start'
278
-    },
279
-    'NativeBase.Body': {
280
-      flex: 1,
281
-      alignItems:
282
-        platform === PLATFORM.IOS && platformStyle !== PLATFORM.MATERIAL
283
-          ? 'center'
284
-          : 'flex-start',
285
-      alignSelf: 'center',
286
-      'NativeBase.Segment': {
287
-        borderWidth: 0,
288
-        alignSelf: 'flex-end',
289
-        marginRight: platform === PLATFORM.IOS ? -40 : -55
290
-      },
291
-      'NativeBase.Button': {
292
-        alignSelf: 'center',
293
-        '.transparent': {
294
-          backgroundColor: 'transparent'
295
-        },
296
-        'NativeBase.Icon': {
297
-          color: variables.toolbarBtnColor
298
-        },
299
-        'NativeBase.IconNB': {
300
-          color: variables.toolbarBtnColor
301
-        },
302
-        'NativeBase.Text': {
303
-          color: variables.inverseTextColor,
304
-          backgroundColor: 'transparent'
305
-        }
306
-      }
307
-    },
308
-    'NativeBase.Right': {
309
-      'NativeBase.Button': {
310
-        '.hasText': {
311
-          height: 30,
312
-          'NativeBase.Icon': {
313
-            color: variables.toolbarBtnColor,
314
-            fontSize: variables.iconHeaderSize - 2,
315
-            marginTop: 2,
316
-            marginRight: 2,
317
-            marginLeft: 5
318
-          },
319
-          'NativeBase.Text': {
320
-            color: variables.toolbarBtnTextColor,
321
-            fontSize: platform === PLATFORM.IOS ? 17 : 14,
322
-            lineHeight: 19.5
323
-          },
324
-          'NativeBase.IconNB': {
325
-            color: variables.toolbarBtnColor,
326
-            fontSize: variables.iconHeaderSize - 2,
327
-            marginTop: 2,
328
-            marginRight: 2,
329
-            marginLeft: 5
330
-          }
331
-        },
332
-        '.transparent': {
333
-          marginRight: platform === PLATFORM.IOS ? -9 : -5,
334
-          paddingLeft: 15,
335
-          paddingRight: 12,
336
-          paddingHorizontal: 15,
337
-          borderRadius: 50,
338
-          'NativeBase.Icon': {
339
-            color: variables.toolbarBtnColor,
340
-            fontSize: variables.iconHeaderSize - 2,
341
-            marginTop: 0,
342
-            marginLeft: 2,
343
-            marginRight: 0
344
-            // paddingTop: 0
345
-          },
346
-          'NativeBase.IconNB': {
347
-            color: variables.toolbarBtnColor,
348
-            fontSize: variables.iconHeaderSize - 2,
349
-            marginTop: 0,
350
-            marginLeft: 2,
351
-            marginRight: 0
352
-            // paddingTop: 0
353
-          },
354
-          'NativeBase.Text': {
355
-            color: variables.toolbarBtnTextColor,
356
-            fontSize: platform === PLATFORM.IOS ? 17 : 14,
357
-            top: platform === PLATFORM.IOS ? 1 : -1.5,
358
-            paddingRight:
359
-              platform === PLATFORM.IOS &&
360
-              variables.platformStyle !== PLATFORM.MATERIAL
361
-                ? 0
362
-                : undefined
363
-          },
364
-          backgroundColor: 'transparent',
365
-          borderColor: null,
366
-          elevation: 0,
367
-          shadowColor: null,
368
-          shadowOffset: null,
369
-          shadowRadius: null,
370
-          shadowOpacity: null
371
-        },
372
-        'NativeBase.Icon': {
373
-          color: variables.toolbarBtnColor
374
-        },
375
-        'NativeBase.IconNB': {
376
-          color: variables.toolbarBtnColor
377
-        },
378
-        alignSelf: null,
379
-        paddingHorizontal: variables.buttonPadding
380
-      },
381
-      flex: 1,
382
-      alignSelf: 'center',
383
-      alignItems: 'flex-end',
384
-      flexDirection: 'row',
385
-      justifyContent: 'flex-end'
386
-    },
387
-    backgroundColor: variables.toolbarDefaultBg,
388
-    flexDirection: 'row',
389
-    // paddingHorizontal: 10,
390
-    paddingLeft:
391
-      platform === PLATFORM.IOS && variables.platformStyle !== PLATFORM.MATERIAL
392
-        ? 6
393
-        : 10,
394
-    paddingRight: 10,
395
-    justifyContent: 'center',
396
-    paddingTop: platform === PLATFORM.IOS ? 18 : 0,
397
-    borderBottomWidth:
398
-      platform === PLATFORM.IOS
399
-        ? 1 / PixelRatio.getPixelSizeForLayoutSize(1)
400
-        : 0,
401
-    borderBottomColor: variables.toolbarDefaultBorder,
402
-    height:
403
-      variables.platform === PLATFORM.IOS &&
404
-      variables.platformStyle === PLATFORM.MATERIAL
405
-        ? variables.toolbarHeight + 10
406
-        : variables.toolbarHeight,
407
-    elevation: 3,
408
-    shadowColor: platformStyle === PLATFORM.MATERIAL ? '#000' : undefined,
409
-    shadowOffset:
410
-      platformStyle === PLATFORM.MATERIAL ? { width: 0, height: 2 } : undefined,
411
-    shadowOpacity: platformStyle === PLATFORM.MATERIAL ? 0.2 : undefined,
412
-    shadowRadius: platformStyle === PLATFORM.MATERIAL ? 1.2 : undefined,
413
-    top: 0,
414
-    left: 0,
415
-    right: 0
416
-  };
417
-
418
-  return headerTheme;
419
-};

+ 0
- 12
native-base-theme/components/Icon.js View File

@@ -1,12 +0,0 @@
1
-// @flow
2
-
3
-import variable from './../variables/platform';
4
-
5
-export default (variables /* : * */ = variable) => {
6
-  const iconTheme = {
7
-    fontSize: variables.iconFontSize,
8
-    color: variable.textColor
9
-  };
10
-
11
-  return iconTheme;
12
-};

+ 0
- 19
native-base-theme/components/Input.js View File

@@ -1,19 +0,0 @@
1
-// @flow
2
-
3
-import variable from './../variables/platform';
4
-
5
-export default (variables /* : * */ = variable) => {
6
-  const inputTheme = {
7
-    '.multiline': {
8
-      height: null
9
-    },
10
-    height: variables.inputHeightBase,
11
-    color: variables.inputColor,
12
-    paddingLeft: 5,
13
-    paddingRight: 5,
14
-    flex: 1,
15
-    fontSize: variables.inputFontSize
16
-  };
17
-
18
-  return inputTheme;
19
-};

+ 0
- 132
native-base-theme/components/InputGroup.js View File

@@ -1,132 +0,0 @@
1
-// @flow
2
-
3
-import variable from './../variables/platform';
4
-
5
-export default (variables /* : * */ = variable) => {
6
-  const inputGroupTheme = {
7
-    'NativeBase.Icon': {
8
-      fontSize: 24,
9
-      color: variables.sTabBarActiveTextColor,
10
-      paddingHorizontal: 5
11
-    },
12
-    'NativeBase.IconNB': {
13
-      fontSize: 24,
14
-      color: variables.sTabBarActiveTextColor,
15
-      paddingHorizontal: 5
16
-    },
17
-    'NativeBase.Input': {
18
-      height: variables.inputHeightBase,
19
-      color: variables.inputColor,
20
-      paddingLeft: 5,
21
-      paddingRight: 5,
22
-      flex: 1,
23
-      fontSize: variables.inputFontSize,
24
-      lineHeight: variables.inputLineHeight
25
-    },
26
-    '.underline': {
27
-      '.success': {
28
-        borderColor: variables.inputSuccessBorderColor
29
-      },
30
-      '.error': {
31
-        borderColor: variables.inputErrorBorderColor
32
-      },
33
-      paddingLeft: 5,
34
-      borderWidth: variables.borderWidth,
35
-      borderTopWidth: 0,
36
-      borderRightWidth: 0,
37
-      borderLeftWidth: 0,
38
-      borderColor: variables.inputBorderColor
39
-    },
40
-    '.regular': {
41
-      '.success': {
42
-        borderColor: variables.inputSuccessBorderColor
43
-      },
44
-      '.error': {
45
-        borderColor: variables.inputErrorBorderColor
46
-      },
47
-      paddingLeft: 5,
48
-      borderWidth: variables.borderWidth,
49
-      borderColor: variables.inputBorderColor
50
-    },
51
-    '.rounded': {
52
-      '.success': {
53
-        borderColor: variables.inputSuccessBorderColor
54
-      },
55
-      '.error': {
56
-        borderColor: variables.inputErrorBorderColor
57
-      },
58
-      paddingLeft: 5,
59
-      borderWidth: variables.borderWidth,
60
-      borderRadius: variables.inputGroupRoundedBorderRadius,
61
-      borderColor: variables.inputBorderColor
62
-    },
63
-
64
-    '.success': {
65
-      'NativeBase.Icon': {
66
-        color: variables.inputSuccessBorderColor
67
-      },
68
-      'NativeBase.IconNB': {
69
-        color: variables.inputSuccessBorderColor
70
-      },
71
-      '.rounded': {
72
-        borderRadius: 30,
73
-        borderColor: variables.inputSuccessBorderColor
74
-      },
75
-      '.regular': {
76
-        borderColor: variables.inputSuccessBorderColor
77
-      },
78
-      '.underline': {
79
-        borderWidth: variables.borderWidth,
80
-        borderTopWidth: 0,
81
-        borderRightWidth: 0,
82
-        borderLeftWidth: 0,
83
-        borderColor: variables.inputSuccessBorderColor
84
-      },
85
-      borderColor: variables.inputSuccessBorderColor
86
-    },
87
-
88
-    '.error': {
89
-      'NativeBase.Icon': {
90
-        color: variables.inputErrorBorderColor
91
-      },
92
-      'NativeBase.IconNB': {
93
-        color: variables.inputErrorBorderColor
94
-      },
95
-      '.rounded': {
96
-        borderRadius: 30,
97
-        borderColor: variables.inputErrorBorderColor
98
-      },
99
-      '.regular': {
100
-        borderColor: variables.inputErrorBorderColor
101
-      },
102
-      '.underline': {
103
-        borderWidth: variables.borderWidth,
104
-        borderTopWidth: 0,
105
-        borderRightWidth: 0,
106
-        borderLeftWidth: 0,
107
-        borderColor: variables.inputErrorBorderColor
108
-      },
109
-      borderColor: variables.inputErrorBorderColor
110
-    },
111
-    '.disabled': {
112
-      'NativeBase.Icon': {
113
-        color: '#384850'
114
-      },
115
-      'NativeBase.IconNB': {
116
-        color: '#384850'
117
-      }
118
-    },
119
-
120
-    paddingLeft: 5,
121
-    borderWidth: variables.borderWidth,
122
-    borderTopWidth: 0,
123
-    borderRightWidth: 0,
124
-    borderLeftWidth: 0,
125
-    borderColor: variables.inputBorderColor,
126
-    backgroundColor: 'transparent',
127
-    flexDirection: 'row',
128
-    alignItems: 'center'
129
-  };
130
-
131
-  return inputGroupTheme;
132
-};

+ 0
- 241
native-base-theme/components/Item.js View File

@@ -1,241 +0,0 @@
1
-// @flow
2
-
3
-import { Platform } from 'react-native';
4
-
5
-import variable from './../variables/platform';
6
-import { PLATFORM } from './../variables/commonColor';
7
-
8
-export default (variables /* : * */ = variable) => {
9
-  const itemTheme = {
10
-    '.floatingLabel': {
11
-      'NativeBase.Input': {
12
-        height: 50,
13
-        top: 8,
14
-        paddingTop: 3,
15
-        paddingBottom: 7,
16
-        '.multiline': {
17
-          minHeight: variables.inputHeightBase,
18
-          paddingTop: Platform.OS === PLATFORM.IOS ? 10 : 3,
19
-          paddingBottom: Platform.OS === PLATFORM.IOS ? 14 : 10
20
-        }
21
-      },
22
-      'NativeBase.Label': {
23
-        paddingTop: 5
24
-      },
25
-      'NativeBase.Icon': {
26
-        top: 6,
27
-        paddingTop: 8
28
-      },
29
-      'NativeBase.IconNB': {
30
-        top: 6,
31
-        paddingTop: 8
32
-      }
33
-    },
34
-    '.fixedLabel': {
35
-      'NativeBase.Label': {
36
-        position: null,
37
-        top: null,
38
-        left: null,
39
-        right: null,
40
-        flex: 1,
41
-        height: null,
42
-        width: null,
43
-        fontSize: variables.inputFontSize
44
-      },
45
-      'NativeBase.Input': {
46
-        flex: 2,
47
-        fontSize: variables.inputFontSize
48
-      }
49
-    },
50
-    '.stackedLabel': {
51
-      'NativeBase.Label': {
52
-        position: null,
53
-        top: null,
54
-        left: null,
55
-        right: null,
56
-        paddingTop: 5,
57
-        alignSelf: 'flex-start',
58
-        fontSize: variables.inputFontSize - 2
59
-      },
60
-      'NativeBase.Icon': {
61
-        marginTop: 36
62
-      },
63
-      'NativeBase.Input': {
64
-        alignSelf: Platform.OS === PLATFORM.IOS ? 'stretch' : 'flex-start',
65
-        flex: 1,
66
-        width: Platform.OS === PLATFORM.IOS ? null : variables.deviceWidth - 25,
67
-        fontSize: variables.inputFontSize,
68
-        lineHeight: variables.inputLineHeight - 6,
69
-        '.secureTextEntry': {
70
-          fontSize: variables.inputFontSize
71
-        },
72
-        '.multiline': {
73
-          paddingTop: Platform.OS === PLATFORM.IOS ? 9 : undefined,
74
-          paddingBottom: Platform.OS === PLATFORM.IOS ? 9 : undefined
75
-        }
76
-      },
77
-      flexDirection: null,
78
-      minHeight: variables.inputHeightBase + 15
79
-    },
80
-    '.inlineLabel': {
81
-      'NativeBase.Label': {
82
-        position: null,
83
-        top: null,
84
-        left: null,
85
-        right: null,
86
-        paddingRight: 20,
87
-        height: null,
88
-        width: null,
89
-        fontSize: variables.inputFontSize
90
-      },
91
-      'NativeBase.Input': {
92
-        paddingLeft: 5,
93
-        fontSize: variables.inputFontSize
94
-      },
95
-      flexDirection: 'row'
96
-    },
97
-    'NativeBase.Label': {
98
-      fontSize: variables.inputFontSize,
99
-      color: variables.inputColorPlaceholder,
100
-      paddingRight: 5
101
-    },
102
-    'NativeBase.Icon': {
103
-      fontSize: 24,
104
-      paddingRight: 8
105
-    },
106
-    'NativeBase.IconNB': {
107
-      fontSize: 24,
108
-      paddingRight: 8
109
-    },
110
-    'NativeBase.Input': {
111
-      '.multiline': {
112
-        height: null
113
-      },
114
-      height: variables.inputHeightBase,
115
-      color: variables.inputColor,
116
-      flex: 1,
117
-      top: Platform.OS === PLATFORM.IOS ? 1.5 : undefined,
118
-      fontSize: variables.inputFontSize
119
-    },
120
-    '.underline': {
121
-      'NativeBase.Input': {
122
-        paddingLeft: 15
123
-      },
124
-      '.success': {
125
-        borderColor: variables.inputSuccessBorderColor
126
-      },
127
-      '.error': {
128
-        borderColor: variables.inputErrorBorderColor
129
-      },
130
-      borderWidth: variables.borderWidth * 2,
131
-      borderTopWidth: 0,
132
-      borderRightWidth: 0,
133
-      borderLeftWidth: 0,
134
-      borderColor: variables.inputBorderColor
135
-    },
136
-    '.regular': {
137
-      'NativeBase.Input': {
138
-        paddingLeft: 8
139
-      },
140
-      'NativeBase.Icon': {
141
-        paddingLeft: 10
142
-      },
143
-      '.success': {
144
-        borderColor: variables.inputSuccessBorderColor
145
-      },
146
-      '.error': {
147
-        borderColor: variables.inputErrorBorderColor
148
-      },
149