51 lines
1.3 KiB
TypeScript
51 lines
1.3 KiB
TypeScript
import {
|
|
View,
|
|
ScrollView,
|
|
KeyboardAvoidingView,
|
|
Platform,
|
|
useWindowDimensions,
|
|
} from "react-native";
|
|
import { StatusBar } from "expo-status-bar";
|
|
import { LinearGradient } from "expo-linear-gradient";
|
|
|
|
interface AuthLayoutProps {
|
|
children: React.ReactNode;
|
|
}
|
|
|
|
export const AuthLayout = ({ children }: AuthLayoutProps) => {
|
|
const { width } = useWindowDimensions();
|
|
const isWideScreen = width > 768;
|
|
|
|
return (
|
|
<KeyboardAvoidingView
|
|
behavior={Platform.OS === "ios" ? "padding" : "height"}
|
|
style={{ flex: 1 }}
|
|
>
|
|
<StatusBar style="light" />
|
|
<LinearGradient
|
|
colors={["#A78FA1", "#6750a4", "#49385D"]}
|
|
style={{ flex: 1 }}
|
|
>
|
|
<ScrollView
|
|
contentContainerStyle={{
|
|
flexGrow: 1,
|
|
justifyContent: "center",
|
|
paddingHorizontal: isWideScreen ? 32 : 16,
|
|
paddingVertical: isWideScreen ? 32 : 24,
|
|
}}
|
|
keyboardShouldPersistTaps="handled"
|
|
>
|
|
<View
|
|
style={{
|
|
alignSelf: isWideScreen ? "center" : "stretch",
|
|
width: isWideScreen ? 550 : "100%",
|
|
}}
|
|
>
|
|
{children}
|
|
</View>
|
|
</ScrollView>
|
|
</LinearGradient>
|
|
</KeyboardAvoidingView>
|
|
);
|
|
};
|