72 lines
1.3 KiB
TypeScript
72 lines
1.3 KiB
TypeScript
// components/text-input.styles.ts
|
|
import { AccentColor, MainColor } from "@/constants/color-palet";
|
|
import { StyleSheet } from "react-native";
|
|
|
|
export const textInputStyles = StyleSheet.create({
|
|
// Container utama input (View luar)
|
|
container: {
|
|
marginBottom: 16,
|
|
},
|
|
|
|
// Label di atas input
|
|
label: {
|
|
fontSize: 14,
|
|
marginBottom: 6,
|
|
fontWeight: "500",
|
|
color: MainColor.white,
|
|
},
|
|
|
|
// Tanda bintang merah untuk required
|
|
required: {
|
|
color: "red",
|
|
},
|
|
|
|
// Pesan error di bawah input
|
|
errorMessage: {
|
|
marginTop: 4,
|
|
fontSize: 12,
|
|
color: MainColor.red,
|
|
},
|
|
|
|
// Wrapper input (View pembungkus TextInput)
|
|
inputContainer: {
|
|
flexDirection: "row",
|
|
alignItems: "center",
|
|
borderWidth: 1,
|
|
borderColor: AccentColor.white,
|
|
backgroundColor: MainColor.login,
|
|
paddingHorizontal: 12,
|
|
height: 50,
|
|
},
|
|
|
|
// Style saat disabled
|
|
disabled: {
|
|
backgroundColor: "#f9f9f9",
|
|
borderColor: "#e0e0e0",
|
|
},
|
|
|
|
// Input utama (TextInput)
|
|
input: {
|
|
flex: 1,
|
|
fontSize: 16,
|
|
paddingVertical: 0,
|
|
},
|
|
|
|
// Ikon di kiri/kanan
|
|
icon: {
|
|
marginHorizontal: 4,
|
|
justifyContent: "center",
|
|
},
|
|
|
|
// Teks ikon jika berupa string
|
|
iconText: {
|
|
fontSize: 16,
|
|
color: "#000",
|
|
},
|
|
|
|
// Border merah jika ada error
|
|
errorBorder: {
|
|
borderColor: "red",
|
|
},
|
|
});
|