wibu/hipmi-mobile
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix styles dan feature component text

Browse Source
This commit is contained in:
Bagasbanuna02
2025-07-02 14:55:12 +08:00
parent 9667065bb3
commit e2744f0344
20 changed files with 258 additions and 80 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
screens/Authentication/LoginView.tsx
View File

@@ -1,12 +1,12 @@
import ButtonCustom from "@/components/Button/ButtonCustom";
import Spacing from "@/components/_ShareComponent/Spacing";
import ViewWrapper from "@/components/_ShareComponent/ViewWrapper";
import { MainColor } from "@/constants/color-palet";
import { Styles } from "@/styles/global-styles";
import { GStyles } from "@/styles/global-styles";
import { router } from "expo-router";
import { useState } from "react";
import { Text, View } from "react-native";
import PhoneInput, { ICountry } from "react-native-international-phone-number";
import ButtonCustom from "@/components/Button/ButtonCustom";
import Spacing from "@/components/_ShareComponent/Spacing";
import ViewWrapper from "@/components/_ShareComponent/ViewWrapper";
export default function LoginView() {
@@ -25,17 +25,17 @@ export default function LoginView() {
const callingCode = selectedCountry?.callingCode.replace(/^\+/, "") || "";
const fixNumber = callingCode + inputValue;
console.log(fixNumber);
router.push("/verification");
router.navigate("/(application)/profile/1");
}
return (
<ViewWrapper withBackground>
<View style={Styles.authContainer}>
<View style={GStyles.authContainer}>
<View>
<View style={Styles.authContainerTitle}>
<Text style={Styles.authSubTitle}>WELCOME TO</Text>
<View style={GStyles.authContainerTitle}>
<Text style={GStyles.authSubTitle}>WELCOME TO</Text>
<Spacing height={5} />
<Text style={Styles.authTitle}>HIPMI BADUNG APPS</Text>
<Text style={GStyles.authTitle}>HIPMI BADUNG APPS</Text>
<Spacing height={5} />
</View>
<Spacing height={50} />

12
screens/Authentication/RegisterView.tsx
View File

@@ -3,7 +3,7 @@ import ViewWrapper from "@/components/_ShareComponent/ViewWrapper";
import ButtonCustom from "@/components/Button/ButtonCustom";
import { TextInputCustom } from "@/components/TextInput/TextInputCustom";
import { MainColor } from "@/constants/color-palet";
import { Styles } from "@/styles/global-styles";
import { GStyles } from "@/styles/global-styles";
import { MaterialCommunityIcons } from "@expo/vector-icons";
import { router } from "expo-router";
import { Text, View } from "react-native";
@@ -12,10 +12,10 @@ export default function RegisterView() {
return (
<>
<ViewWrapper withBackground>
<View style={Styles.authContainer}>
<View style={GStyles.authContainer}>
<View>
<View style={Styles.authContainerTitle}>
<Text style={Styles.authTitle}>REGISTRASI</Text>
<View style={GStyles.authContainerTitle}>
<Text style={GStyles.authTitle}>REGISTRASI</Text>
<Spacing />
<MaterialCommunityIcons
name="account"
@@ -24,10 +24,10 @@ export default function RegisterView() {
/>
<Spacing />
<Text style={Styles.textLabel}>
<Text style={GStyles.textLabel}>
Anda akan terdaftar dengan nomor
</Text>
<Text style={Styles.textLabel}>+6282xxxxxxxxx</Text>
<Text style={GStyles.textLabel}>+6282xxxxxxxxx</Text>
<Spacing />
</View>
<TextInputCustom placeholder="Masukkan username" />

16
screens/Authentication/VerificationView.tsx
View File

@@ -2,7 +2,7 @@ import Spacing from "@/components/_ShareComponent/Spacing";
import ViewWrapper from "@/components/_ShareComponent/ViewWrapper";
import ButtonCustom from "@/components/Button/ButtonCustom";
import { MainColor } from "@/constants/color-palet";
import { Styles } from "@/styles/global-styles";
import { GStyles } from "@/styles/global-styles";
import { router } from "expo-router";
import { Text, View } from "react-native";
import { OtpInput } from "react-native-otp-entry";
@@ -11,13 +11,13 @@ export default function VerificationView() {
return (
<>
<ViewWrapper withBackground>
<View style={Styles.authContainer}>
<View style={GStyles.authContainer}>
<View>
<View style={Styles.authContainerTitle}>
<Text style={Styles.authTitle}>Verifikasi KOde OTP</Text>
<View style={GStyles.authContainerTitle}>
<Text style={GStyles.authTitle}>Verifikasi KOde OTP</Text>
<Spacing height={30} />
<Text style={Styles.textLabel}>Masukan 4 digit kode otp</Text>
<Text style={Styles.textLabel}>
<Text style={GStyles.textLabel}>Masukan 4 digit kode otp</Text>
<Text style={GStyles.textLabel}>
Yang di kirim ke +6282xxxxxxxxx
</Text>
<Spacing height={30} />
@@ -39,9 +39,9 @@ export default function VerificationView() {
}}
/>
<Spacing height={30} />
<Text style={Styles.textLabel}>
<Text style={GStyles.textLabel}>
Tidak menerima kode ?{" "}
<Text style={Styles.textLabel}>Kirim Ulang</Text>
<Text style={GStyles.textLabel}>Kirim Ulang</Text>
</Text>
</View>
<Spacing height={30} />

6
screens/Home/HomeView.tsx
View File

@@ -1,18 +1,18 @@
import Spacing from "@/components/_ShareComponent/Spacing";
import { Styles } from "@/styles/global-styles";
import DynamicTruncatedText from "@/components/_ShareComponent/TruncatedText";
import { GStyles } from "@/styles/global-styles";
import { Ionicons } from "@expo/vector-icons";
import { Image } from "expo-image";
import { router } from "expo-router";
import { ScrollView, Text, TouchableOpacity, View } from "react-native";
import Icon from "react-native-vector-icons/FontAwesome";
import DynamicTruncatedText from "@/components/_ShareComponent/TruncatedText";
import { stylesHome } from "./homeViewStyle";
export default function HomeView() {
return (
<>
<ScrollView contentContainerStyle={{ flexGrow: 1 }}>
<View style={Styles.homeContainer}>
<View style={GStyles.homeContainer}>
<Spacing height={20} />
<View
style={{

12
screens/Home/tabSection.tsx
View File

@@ -1,5 +1,5 @@
import { ICustomTab, ITabs } from "@/components/_Interface/types";
import { Styles } from "@/styles/global-styles";
import { GStyles } from "@/styles/global-styles";
import { Ionicons } from "@expo/vector-icons";
import { router } from "expo-router";
import React from "react";
@@ -8,12 +8,12 @@ import { Text, TouchableOpacity, View } from "react-native";
const CustomTab = ({ icon, label, isActive, onPress }: ICustomTab) => (
<TouchableOpacity
style={[Styles.tabItem, isActive && Styles.activeTab]}
style={[GStyles.tabItem, isActive && GStyles.activeTab]}
onPress={onPress}
activeOpacity={0.7}
>
<View
style={[Styles.iconContainer, isActive && Styles.activeIconContainer]}
style={[GStyles.iconContainer, isActive && GStyles.activeIconContainer]}
>
<Ionicons
name={icon as any}
@@ -21,7 +21,7 @@ const CustomTab = ({ icon, label, isActive, onPress }: ICustomTab) => (
color={isActive ? "#fff" : "#666"}
/>
</View>
<Text style={[Styles.tabLabel, isActive && Styles.activeTabLabel]}>
<Text style={[GStyles.tabLabel, isActive && GStyles.activeTabLabel]}>
{label}
</Text>
</TouchableOpacity>
@@ -30,8 +30,8 @@ const CustomTab = ({ icon, label, isActive, onPress }: ICustomTab) => (
export default function TabSection({ tabs }: { tabs: ITabs[] }) {
return (
<>
<View style={Styles.tabBar}>
<View style={Styles.tabContainer}>
<View style={GStyles.tabBar}>
<View style={GStyles.tabContainer}>
{tabs.map((e) => (
<CustomTab
key={e.id}

104
screens/Profile/profilSection.tsx Normal file
View File

@@ -0,0 +1,104 @@
import { Spacing, TextCustom } from "@/components";
import { AccentColor, MainColor } from "@/constants/color-palet";
import { ICON_SIZE_SMALL } from "@/constants/constans-value";
import { FontAwesome5, Ionicons } from "@expo/vector-icons";
import { router, useLocalSearchParams } from "expo-router";
import { Text, TouchableHighlight, View } from "react-native";
export default function ProfilSection() {
const { id } = useLocalSearchParams();
const listData = [
{
icon: (
<Ionicons name="call-outline" size={ICON_SIZE_SMALL} color="white" />
),
label: "+6282340374412",
},
{
icon: (
<Ionicons name="mail-outline" size={ICON_SIZE_SMALL} color="white" />
),
label: "bagasbanuna@gmail.com",
},
{
icon: (
<Ionicons
name="location-outline"
size={ICON_SIZE_SMALL}
color="white"
/>
),
label: "Jalan Raya Sesetan No. 123, Bandung, Indonesia",
},
{
icon: (
<FontAwesome5 name="transgender" size={ICON_SIZE_SMALL} color="white" />
),
label: "Laki-laki",
},
];
return (
<>
<View
style={{
backgroundColor: MainColor.soft_darkblue,
borderColor: AccentColor.blue,
borderWidth: 1,
padding: 10,
borderRadius: 6,
marginTop: 10,
}}
>
<View
style={{
flexDirection: "row",
alignItems: "center",
flexWrap: "wrap",
// backgroundColor: MainColor.red,
}}
>
{listData.map((item, index) => (
<View
key={index}
style={{
flexDirection: "row",
alignItems: "center",
marginBottom: 20,
// flexWrap: "wrap",
// backgroundColor: "gray",
}}
>
{item.icon}
<Spacing />
<TextCustom bold style={{ backgroundColor: "" }}>
{`${item.label} Lorem, ipsum dolor sit amet consectetur adipisicing elit. Officiis dolorem ipsam velit culpa consequuntur porro esse asperiores, debitis, qui numquam excepturi tempora fuga dolor totam quam, provident ipsum repellat hic.`}
</TextCustom>
{/* <View style={{ flexDirection: "row", alignItems: "center" }}>
{item.icon}
<Spacing />
</View> */}
</View>
))}
</View>
</View>
<TouchableHighlight
onPress={() => router.push(`/(application)/portofolio/${id}`)}
>
<View
style={{
backgroundColor: MainColor.white,
padding: 10,
borderRadius: 10,
marginTop: 10,
}}
>
<Text>Portofolio</Text>
</View>
</TouchableHighlight>
</>
);
}