import { Slot } from 'expo-router';
import {StyleSheet, View,Text} from "react-native";
import {useEffect} from "react";

export default function LoginLayout() {
    return (
        <View style={styles.layoutBox}>
            <View style={styles.background}>
                <View style={styles.backgroundRectangular1}></View>
                <View style={styles.backgroundRectangular2}></View>
                <View style={styles.backgroundEllipse1}></View>
                <View style={styles.backgroundEllipse2}></View>
            </View>
            <Slot />
        </View>
    );
}

const styles = StyleSheet.create({
    layoutBox:{
        height:'100%',
        width:'100%',
        position:'relative',
        backgroundColor:'white',
    },
    background:{
        position:'absolute',
        top:0,
        left:0,
        width:'100%',
        height:'100%',
        zIndex:-1,
    },
    backgroundRectangular1:{
        position:"absolute",
        width: 372,
        height: 372,
        left:'-50%',
        bottom:'-20%',
        transform:'rotate(27.089deg)',
        borderStyle:'solid',
        borderColor:'#F1F4FF',
        borderWidth:2,
    },
    backgroundRectangular2:{
        position:"absolute",
        width: 372,
        height: 372,
        left:'-50%',
        bottom:'-20%',
        borderStyle:'solid',
        borderColor:'#F1F4FF',
        borderWidth:2,
    },
    backgroundEllipse1:{
        position:"absolute",
        width: 496,
        height: 496,
        right:'-40%',
        top:'-20%',
        borderRadius:496,
        borderStyle:'solid',
        borderColor:'#F1F4FF',
        borderWidth:3,
    },
    backgroundEllipse2:{
        position:"absolute",
        width: 635,
        height: 635,
        right:'-90%',
        top:'-38%',
        borderRadius:496,
        backgroundColor:'#F8F9FF'
    }
});