import React from "react";
import { StyleSheet, Image } from "react-native";
import Logo from "../../assets/logo192.png";
import { useTranslation } from "react-i18next";
import { H1, Container, Content } from "native-base";
import styles from "../styles";

export default function ScreenSplash() {
  const { t } = useTranslation();
  return (
    <Container>
      <Content
        contentContainerStyle={[
          styles.contentContainer__centered,
          localStyles.middleAlign,
        ]}
      >
        <Image style={localStyles.logo} source={Logo} />
        <H1>{t("app.title")}</H1>
      </Content>
    </Container>
  );
}
const localStyles = StyleSheet.create({
  middleAlign: {
    alignItems: "center",
  },
  content: {
    paddingBottom: 150,
  },
  logo: { width: 100, height: 100, margin: 20 },
});