@questlabs/react-native-sdk

import { StyleSheet } from "react-native"; import { Dimensions } from "react-native"; const windowWidth = Dimensions.get("screen").width; export const styles = StyleSheet.create({ backgroundOverlay: { ...StyleSheet.absoluteFillObject, backgroundColor: "black", opacity: 0.5, borderRadius: 10, }, mainViewStyle: { backgroundColor: "#FFF", elevation: 10, borderRadius: 10, width: windowWidth * 0.96, maxWidth: 376, }, headerViewStyle: { display: "flex", padding: 20, alignItems: "center", gap: 4, }, headerTextStyle: { fontSize: 20, fontWeight: "600", color: "#252525", textAlign: "center", }, headerTextStyle2: { fontSize: 12, fontWeight: "400", color: "#B9B9B9", textAlign: "center", lineHeight: 16, }, emailTextStyle: { color: "#252525", fontSize: 12, fontStyle: "normal", fontWeight: "400", lineHeight: 16, }, inputViewStyle: { flexDirection: "row", alignItems: "center", borderColor: "#ECECEC", borderWidth: 1.5, paddingVertical: 10, paddingHorizontal: 12, borderRadius: 10, marginTop: 4, gap: 8, }, inputTextStyle: { alignItems: "center", fontSize: 14, fontWeight: "400", height: 20, lineHeight: 20, flex: 1, }, crossIconStyle: { position: "absolute", right: 10, }, errorViewStyle: { flexDirection: "row", alignItems: "center", marginTop: 4, paddingHorizontal: 20, }, errorTextStyle: { color: "#ED0A34", fontSize: 12, fontWeight: "500", lineHeight: 16, }, continueBtnViewStyle: { marginTop: 20, backgroundColor: "#9035FF", borderRadius: 10, justifyContent: "center", alignItems: "center", marginHorizontal: 20, paddingVertical: 10, paddingHorizontal: 20, }, continueBtnTextStyle: { color: "#FFF", fontSize: 14, fontWeight: "600", lineHeight: 20, }, continueViewStyle: { flexDirection: "row", marginTop: 12, alignItems: "center", justifyContent: "space-between", paddingHorizontal: 20, }, continueLineStyle: { borderWidth: 0.2, borderColor: "#EEEEEE", width: "45%", height: 0, }, continueTextStyle: { fontSize: 10, fontWeight: "400", color: "#AFAFAF", }, googleViewStyle: { marginTop: 12, borderWidth: 1, borderRadius: 10, borderColor: "#EFEFEF", justifyContent: "center", flexDirection: "row", alignItems: "center", paddingVertical: 10, marginHorizontal: 20, backgroundColor: "transparent", marginBottom: 20, gap: 8, }, googleTextStyle: { color: "#333", fontSize: 14, fontWeight: "400", lineHeight: 20, }, otpTextStyle: { fontSize: 20, fontWeight: "600", color: "#141414", textAlign: "center", paddingVertical: 3, lineHeight: 30, }, headerTextStyle3: { fontSize: 12, fontWeight: "400", color: "#B9B9B9", textAlign: "center", lineHeight: 16, marginTop: 4, }, clockTextStyle: { fontSize: 12, fontWeight: "400", color: "#B9B9B9", lineHeight: 16, }, resendTextStyle: { fontSize: 12, fontWeight: "600", color: "#333", }, otpLableViewStyle: { paddingHorizontal: 20, }, otpLableTextStyle: { fontSize: 12, fontWeight: "400", color: "#252525", lineHeight: 16, marginTop: 4, }, otpContViewStyle: { marginTop: 4, flexDirection: "row", justifyContent: "space-between", alignItems: "center", width: "100%", }, otpInputTextStyle: { padding: 8, width: "15.7%", maxWidth: 50, height: 40, borderRadius: 10, textAlign: "center", borderWidth: 1.5, borderColor: "#F6F6F6", }, verifyView: { paddingVertical: 20, paddingHorizontal: 20, }, verifyBtnViewStyle: { backgroundColor: "#9035FF", borderRadius: 10, justifyContent: "center", alignItems: "center", paddingVertical: 10, paddingHorizontal: 20, }, verifyBtnTextStyle: { color: "#FFF", fontSize: 14, fontWeight: "600", lineHeight: 20, }, footerView: { display: "flex", paddingVertical: 10, paddingHorizontal: 20, justifyContent: "center", gap: 8, alignSelf: "stretch", backgroundColor: "#FBFBFB", borderBottomStartRadius: 12, borderBottomEndRadius: 12, }, footerText: { fontSize: 12, fontStyle: "normal", fontWeight: "400", lineHeight: 16, color: "#B9B9B9", textAlign: "center", }, });