commit
92d1457386
|
@ -1,6 +1,5 @@
|
||||||
node_modules/
|
node_modules/
|
||||||
.expo/
|
.expo/
|
||||||
dist/
|
|
||||||
npm-debug.*
|
npm-debug.*
|
||||||
*.jks
|
*.jks
|
||||||
*.p8
|
*.p8
|
||||||
|
@ -9,6 +8,6 @@ npm-debug.*
|
||||||
*.mobileprovision
|
*.mobileprovision
|
||||||
*.orig.*
|
*.orig.*
|
||||||
web-build/
|
web-build/
|
||||||
|
.vscode
|
||||||
# macOS
|
|
||||||
.DS_Store
|
.DS_Store
|
||||||
|
|
||||||
|
|
|
@ -0,0 +1,138 @@
|
||||||
|
import React from "react";
|
||||||
|
import {
|
||||||
|
Text,
|
||||||
|
Link,
|
||||||
|
HStack,
|
||||||
|
Center,
|
||||||
|
Heading,
|
||||||
|
Switch,
|
||||||
|
useColorMode,
|
||||||
|
NativeBaseProvider,
|
||||||
|
extendTheme,
|
||||||
|
VStack,
|
||||||
|
Box,
|
||||||
|
FormControl,
|
||||||
|
Input,
|
||||||
|
Button,
|
||||||
|
Image
|
||||||
|
} from "native-base";
|
||||||
|
import NativeBaseIcon from "./components/NativeBaseIcon";
|
||||||
|
import { Platform } from "react-native";
|
||||||
|
|
||||||
|
// Define the config
|
||||||
|
const config = {
|
||||||
|
useSystemColorMode: false,
|
||||||
|
initialColorMode: "dark",
|
||||||
|
};
|
||||||
|
|
||||||
|
// extend the theme
|
||||||
|
export const theme = extendTheme({ config,
|
||||||
|
colors: {
|
||||||
|
brown: "#D7A86E"
|
||||||
|
} });
|
||||||
|
|
||||||
|
//const logo = require('./assets/')
|
||||||
|
|
||||||
|
export default function App() {
|
||||||
|
return (
|
||||||
|
<NativeBaseProvider>
|
||||||
|
<Center w="100%">
|
||||||
|
<Box safeArea p="2" py="8" w="90%" maxW="290">
|
||||||
|
{/* <Image source={{
|
||||||
|
uri: logo.default.src
|
||||||
|
}} width={500} height={500}
|
||||||
|
alt="Katoikia logo" size="xl" /> */}
|
||||||
|
|
||||||
|
<Heading
|
||||||
|
size="lg"
|
||||||
|
fontWeight="600"
|
||||||
|
color="coolGray.800"
|
||||||
|
_dark={{
|
||||||
|
color: "warmGray.50",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
Bienvenido a Katoikia
|
||||||
|
</Heading>
|
||||||
|
<Heading
|
||||||
|
mt="1"
|
||||||
|
_dark={{
|
||||||
|
color: "warmGray.200",
|
||||||
|
}}
|
||||||
|
color="coolGray.600"
|
||||||
|
fontWeight="medium"
|
||||||
|
size="xs"
|
||||||
|
>
|
||||||
|
Su app de comunidad de confianza
|
||||||
|
</Heading>
|
||||||
|
|
||||||
|
<VStack space={3} mt="5">
|
||||||
|
<FormControl>
|
||||||
|
<FormControl.Label> Correo Electrónico</FormControl.Label>
|
||||||
|
<Input />
|
||||||
|
</FormControl>
|
||||||
|
<FormControl>
|
||||||
|
<FormControl.Label> Contraseña </FormControl.Label>
|
||||||
|
<Input type="password" />
|
||||||
|
<Link
|
||||||
|
_text={{
|
||||||
|
fontSize: "xs",
|
||||||
|
fontWeight: "500",
|
||||||
|
color: "indigo.500",
|
||||||
|
}}
|
||||||
|
alignSelf="flex-end"
|
||||||
|
mt="1"
|
||||||
|
>
|
||||||
|
Recuperar contraseña
|
||||||
|
|
||||||
|
</Link>
|
||||||
|
</FormControl>
|
||||||
|
<Button mt="2" colorScheme="primary"
|
||||||
|
>
|
||||||
|
<Text>Continuar</Text>
|
||||||
|
</Button>
|
||||||
|
<HStack mt="6" justifyContent="center">
|
||||||
|
{/* <Text
|
||||||
|
fontSize="sm"
|
||||||
|
color="coolGray.600"
|
||||||
|
_dark={{
|
||||||
|
color: "warmGray.200",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
I'm a new user.
|
||||||
|
</Text> */}
|
||||||
|
<Link
|
||||||
|
_text={{
|
||||||
|
color: "warning.300",
|
||||||
|
fontWeight: "medium",
|
||||||
|
fontSize: "sm",
|
||||||
|
}}
|
||||||
|
href="#"
|
||||||
|
>
|
||||||
|
Regístrese aquí
|
||||||
|
</Link>
|
||||||
|
</HStack>
|
||||||
|
</VStack>
|
||||||
|
</Box>
|
||||||
|
</Center>
|
||||||
|
|
||||||
|
</NativeBaseProvider>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Color Switch Component
|
||||||
|
function ToggleDarkMode() {
|
||||||
|
const { colorMode, toggleColorMode } = useColorMode();
|
||||||
|
return (
|
||||||
|
<HStack space={2} alignItems="center">
|
||||||
|
<Text>Dark</Text>
|
||||||
|
<Switch
|
||||||
|
isChecked={colorMode === "light"}
|
||||||
|
onToggle={toggleColorMode}
|
||||||
|
aria-label={
|
||||||
|
colorMode === "light" ? "switch to dark mode" : "switch to light mode"
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
<Text>Light</Text>
|
||||||
|
</HStack>
|
||||||
|
);
|
||||||
|
}
|
|
@ -1,20 +0,0 @@
|
||||||
import { StatusBar } from 'expo-status-bar';
|
|
||||||
import { StyleSheet, Text, View } from 'react-native';
|
|
||||||
|
|
||||||
export default function App() {
|
|
||||||
return (
|
|
||||||
<View style={styles.container}>
|
|
||||||
<Text>Open up App.tsx to start working on your app!</Text>
|
|
||||||
<StatusBar style="auto" />
|
|
||||||
</View>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
const styles = StyleSheet.create({
|
|
||||||
container: {
|
|
||||||
flex: 1,
|
|
||||||
backgroundColor: '#fff',
|
|
||||||
alignItems: 'center',
|
|
||||||
justifyContent: 'center',
|
|
||||||
},
|
|
||||||
});
|
|
|
@ -0,0 +1,9 @@
|
||||||
|
# NativeBase Expo Template
|
||||||
|
|
||||||
|
The official NativeBase template for [Expo](https://docs.expo.io/)
|
||||||
|
|
||||||
|
## Usage
|
||||||
|
|
||||||
|
```sh
|
||||||
|
expo init my-app --template @native-base/expo-template
|
||||||
|
```
|
|
@ -1,11 +1,10 @@
|
||||||
{
|
{
|
||||||
"expo": {
|
"expo": {
|
||||||
"name": "mobile-ui",
|
"name": "my-app",
|
||||||
"slug": "mobile-ui",
|
"slug": "my-app",
|
||||||
"version": "1.0.0",
|
"version": "1.0.0",
|
||||||
"orientation": "portrait",
|
"orientation": "portrait",
|
||||||
"icon": "./assets/icon.png",
|
"icon": "./assets/icon.png",
|
||||||
"userInterfaceStyle": "light",
|
|
||||||
"splash": {
|
"splash": {
|
||||||
"image": "./assets/splash.png",
|
"image": "./assets/splash.png",
|
||||||
"resizeMode": "contain",
|
"resizeMode": "contain",
|
||||||
|
|
Binary file not shown.
After Width: | Height: | Size: 37 KiB |
Binary file not shown.
Before Width: | Height: | Size: 46 KiB After Width: | Height: | Size: 47 KiB |
|
@ -0,0 +1,44 @@
|
||||||
|
import React from "react";
|
||||||
|
import { Icon } from "native-base";
|
||||||
|
import { G, Path } from "react-native-svg";
|
||||||
|
const NativeBaseIcon = () => {
|
||||||
|
return (
|
||||||
|
<Icon size="220px" viewBox="0 0 602.339 681.729">
|
||||||
|
<G
|
||||||
|
id="Group_403"
|
||||||
|
data-name="Group 403"
|
||||||
|
transform="translate(14575 1918.542)"
|
||||||
|
>
|
||||||
|
<Path
|
||||||
|
id="Path_1"
|
||||||
|
data-name="Path 1"
|
||||||
|
d="M488.722,0A45.161,45.161,0,0,1,527.83,22.576L675.676,278.584a45.162,45.162,0,0,1,0,45.171L527.83,579.763a45.162,45.162,0,0,1-39.108,22.576H193.008A45.162,45.162,0,0,1,153.9,579.763L6.053,323.755a45.162,45.162,0,0,1,0-45.171L153.9,22.576A45.162,45.162,0,0,1,193.008,0Z"
|
||||||
|
transform="translate(-13972.661 -1918.542) rotate(90)"
|
||||||
|
fill="#356290"
|
||||||
|
/>
|
||||||
|
<Path
|
||||||
|
id="Path_252"
|
||||||
|
data-name="Path 252"
|
||||||
|
d="M401.1,0A60.816,60.816,0,0,1,453.77,30.405L567.2,226.844a60.816,60.816,0,0,1,0,60.82L453.77,484.1A60.816,60.816,0,0,1,401.1,514.509H174.241A60.816,60.816,0,0,1,121.575,484.1L8.149,287.665a60.816,60.816,0,0,1,0-60.82L121.575,30.405A60.816,60.816,0,0,1,174.241,0Z"
|
||||||
|
transform="translate(-14016.576 -1865.281) rotate(90)"
|
||||||
|
fill="#1784b2"
|
||||||
|
/>
|
||||||
|
<Path
|
||||||
|
id="Path_251"
|
||||||
|
data-name="Path 251"
|
||||||
|
d="M345.81,0a36.573,36.573,0,0,1,31.674,18.288L480.566,196.856a36.573,36.573,0,0,1,0,36.569L377.484,411.993a36.573,36.573,0,0,1-31.674,18.288H139.655a36.572,36.572,0,0,1-31.674-18.288L4.9,233.425a36.573,36.573,0,0,1,0-36.569L107.981,18.288A36.573,36.573,0,0,1,139.655,0Z"
|
||||||
|
transform="translate(-14058.69 -1820.41) rotate(90)"
|
||||||
|
fill="#50bfc3"
|
||||||
|
/>
|
||||||
|
<Path
|
||||||
|
id="_x3C__x2F__x3E_"
|
||||||
|
d="M187.066,335.455V297.993l-65.272-21.949,65.272-22.523V216.059L81,259.5v32.521Zm38.726,29.3L286.123,174H256.7l-60.33,190.759Zm72.052-29.3,106.066-43.783V259.267L297.844,216.059V254.44l59.3,23.328-59.3,19.421Z"
|
||||||
|
transform="translate(-14516.286 -1846.988)"
|
||||||
|
fill="#fff"
|
||||||
|
/>
|
||||||
|
</G>
|
||||||
|
</Icon>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default NativeBaseIcon;
|
File diff suppressed because it is too large
Load Diff
|
@ -1,7 +1,14 @@
|
||||||
{
|
{
|
||||||
"name": "mobile-ui",
|
"name": "my-app",
|
||||||
"version": "1.0.0",
|
"version": "1.0.0",
|
||||||
"main": "node_modules/expo/AppEntry.js",
|
"main": "node_modules/expo/AppEntry.js",
|
||||||
|
"keywords": [
|
||||||
|
"react",
|
||||||
|
"expo",
|
||||||
|
"template",
|
||||||
|
"nativebase"
|
||||||
|
],
|
||||||
|
"license": "MIT",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"start": "expo start",
|
"start": "expo start",
|
||||||
"android": "expo start --android",
|
"android": "expo start --android",
|
||||||
|
@ -10,20 +17,23 @@
|
||||||
"eject": "expo eject"
|
"eject": "expo eject"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"expo": "~45.0.0",
|
"expo": "^44.0.0",
|
||||||
"expo-cli": "^5.4.12",
|
"expo-status-bar": "~1.2.0",
|
||||||
"expo-status-bar": "~1.3.0",
|
"native-base": "3.4.0",
|
||||||
"react": "17.0.2",
|
"react": "17.0.1",
|
||||||
"react-dom": "17.0.2",
|
"react-dom": "17.0.1",
|
||||||
"react-native": "0.68.2",
|
"react-native": "0.64.3",
|
||||||
"react-native-web": "0.17.7",
|
"react-native-safe-area-context": "3.3.2",
|
||||||
"sharp-cli": "^2.1.1"
|
"react-native-svg": "12.1.1",
|
||||||
|
"react-native-web": "0.17.1"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@babel/core": "^7.12.9",
|
"@babel/core": "^7.12.9"
|
||||||
"@types/react": "~17.0.21",
|
|
||||||
"@types/react-native": "~0.66.13",
|
|
||||||
"typescript": "~4.3.5"
|
|
||||||
},
|
},
|
||||||
|
"bugs": {
|
||||||
|
"url": "https://github.com/GeekyAnts/nativebase-templates/issues"
|
||||||
|
},
|
||||||
|
"homepage": "https://github.com/GeekyAnts/nativebase-templates#readme",
|
||||||
|
"author": "Aditya Jamuar",
|
||||||
"private": true
|
"private": true
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,6 +0,0 @@
|
||||||
{
|
|
||||||
"extends": "expo/tsconfig.base",
|
|
||||||
"compilerOptions": {
|
|
||||||
"strict": true
|
|
||||||
}
|
|
||||||
}
|
|
File diff suppressed because it is too large
Load Diff
|
@ -24,5 +24,8 @@
|
||||||
"js-beautify --config .jsbeautifyrc --type 'html' --replace",
|
"js-beautify --config .jsbeautifyrc --type 'html' --replace",
|
||||||
"git add"
|
"git add"
|
||||||
]
|
]
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"@react-navigation/native": "^6.0.11"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Binary file not shown.
Loading…
Reference in New Issue