log in css mobile

This commit is contained in:
Maria Sanchez 2022-08-05 15:38:20 -06:00
parent 8906880a60
commit 36e5839b04
2 changed files with 24 additions and 12 deletions

View File

@ -14,6 +14,7 @@ import {
FormControl, FormControl,
Input, Input,
Button, Button,
Image
} from "native-base"; } from "native-base";
import NativeBaseIcon from "./components/NativeBaseIcon"; import NativeBaseIcon from "./components/NativeBaseIcon";
import { Platform } from "react-native"; import { Platform } from "react-native";
@ -25,13 +26,23 @@ const config = {
}; };
// extend the theme // extend the theme
export const theme = extendTheme({ config }); export const theme = extendTheme({ config,
colors: {
brown: "#D7A86E"
} });
//const logo = require('./assets/')
export default function App() { export default function App() {
return ( return (
<NativeBaseProvider> <NativeBaseProvider>
<Center w="100%"> <Center w="100%">
<Box safeArea p="2" py="8" w="90%" maxW="290"> <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 <Heading
size="lg" size="lg"
fontWeight="600" fontWeight="600"
@ -40,7 +51,7 @@ export default function App() {
color: "warmGray.50", color: "warmGray.50",
}} }}
> >
Welcome To Katoikia Bienvenido a Katoikia
</Heading> </Heading>
<Heading <Heading
mt="1" mt="1"
@ -51,16 +62,16 @@ export default function App() {
fontWeight="medium" fontWeight="medium"
size="xs" size="xs"
> >
Sign in to continue! Su app de comunidad de confianza
</Heading> </Heading>
<VStack space={3} mt="5"> <VStack space={3} mt="5">
<FormControl> <FormControl>
<FormControl.Label> Email ID</FormControl.Label> <FormControl.Label> Correo Electrónico</FormControl.Label>
<Input /> <Input />
</FormControl> </FormControl>
<FormControl> <FormControl>
<FormControl.Label> Password </FormControl.Label> <FormControl.Label> Contraseña </FormControl.Label>
<Input type="password" /> <Input type="password" />
<Link <Link
_text={{ _text={{
@ -71,15 +82,16 @@ export default function App() {
alignSelf="flex-end" alignSelf="flex-end"
mt="1" mt="1"
> >
Forget Password? Recuperar contraseña
</Link> </Link>
</FormControl> </FormControl>
<Button mt="2" colorScheme="indigo"> <Button mt="2" colorScheme="primary"
<Text>Sign in </Text> >
<Text>Continuar</Text>
</Button> </Button>
<HStack mt="6" justifyContent="center"> <HStack mt="6" justifyContent="center">
<Text {/* <Text
fontSize="sm" fontSize="sm"
color="coolGray.600" color="coolGray.600"
_dark={{ _dark={{
@ -87,16 +99,16 @@ export default function App() {
}} }}
> >
I'm a new user. I'm a new user.
</Text> </Text> */}
<Link <Link
_text={{ _text={{
color: "indigo.500", color: "warning.300",
fontWeight: "medium", fontWeight: "medium",
fontSize: "sm", fontSize: "sm",
}} }}
href="#" href="#"
> >
Sign Up Regístrese aquí
</Link> </Link>
</HStack> </HStack>
</VStack> </VStack>

Binary file not shown.

After

Width:  |  Height:  |  Size: 37 KiB