import React, { FC } from "react";
import {
  View,
  TouchableOpacity,
  TouchableOpacityProps,
  TextStyle,
} from "react-native";
import { Ionicons } from "@expo/vector-icons";
export const LandscapeBackButton: FC<{
  onPress: () => void;
}> = ({ onPress }) => {
  type stylesType = {
    touch: TouchableOpacityProps["style"];
    text: TextStyle;
  };
  const styles: stylesType = {
    touch: {
      position: "absolute",
      left: 10,
      width: 50,
      height: 50,
      backgroundColor: "#0099CC",
      borderColor: "white",
      borderStyle: "solid",
      borderWidth: 1,
      borderRadius: 50,
      alignContent: "center",
      alignSelf: "center",
      alignItems: "center",
      display: "flex",
    },
    text: {
      textAlign: "center",
      width: "auto",
      height: "auto",
      textAlignVertical: "center",
      fontWeight: "bold",
      color: "white",
    },
  };
  return (
    <TouchableOpacity onPress={onPress} style={styles.touch}>
      <View style={{ flex: 1 }} />
      <Ionicons name="arrow-back" color="white" size={30} />
      <View style={{ flex: 1 }} />
    </TouchableOpacity>
  );
};