12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273 |
- import React from "react";
- import { View, Text, TouchableOpacity, StyleSheet, Image } from "react-native";
- import MaterialIcons from "@expo/vector-icons/MaterialIcons";
- import Layout from "@components/Layout/Layout";
- import { useTranslation } from "react-i18next";
- import { useTheme } from "@styles";
-
- const OnboardingScreen = ({ navigation }) => {
- const { t } = useTranslation();
- const { isDark } = useTheme();
- return (
- <Layout>
- <View style={styles.container}>
- <View style={{ marginTop: 20 }}>
- <Text
- style={[styles.headText, { color: isDark ? "#fff" : "#20315f" }]}
- >
- DILIGENT
- </Text>
- </View>
- <View style={styles.logo}>
- <Image
- style={{ width: 300, height: 300 }}
- source={require("../assets/images/diligent-logo.png")}
- />
- </View>
- <TouchableOpacity
- style={styles.button}
- onPress={() => navigation.navigate("Login")}
- >
- <Text style={styles.buttonText}>{t("common.letsBegin")}</Text>
- <MaterialIcons name="arrow-forward-ios" size={22} color="#fff" />
- </TouchableOpacity>
- </View>
- </Layout>
- );
- };
-
- const styles = StyleSheet.create({
- container: {
- flex: 1,
- justifyContent: "center",
- alignItems: "center",
- },
- headText: {
- fontWeight: "bold",
- fontSize: 70,
- fontFamily: "poppins-semibold",
- },
- logo: {
- flex: 1,
- justifyContent: "center",
- alignItems: "center",
- },
- button: {
- backgroundColor: "#AD40AF",
- padding: 20,
- width: "90%",
- borderRadius: 10,
- marginBottom: 50,
- flexDirection: "row",
- justifyContent: "space-between",
- },
- buttonText: {
- color: "white",
- fontSize: 18,
- textAlign: "center",
- fontWeight: "bold",
- fontFamily: "poppins-regular",
- },
- });
-
- export default OnboardingScreen;
|