feat: 样式改版
This commit is contained in:
parent
d7e07b327a
commit
f975ef6ec4
@ -129,8 +129,8 @@ export default function OwnerPage() {
|
|||||||
|
|
||||||
{/* 作品数据 */}
|
{/* 作品数据 */}
|
||||||
<View className='flex flex-row justify-between gap-[1rem]'>
|
<View className='flex flex-row justify-between gap-[1rem]'>
|
||||||
<CreateCountComponent title={t("generalSetting.storiesCreated", { ns: "personal" })} icon={<StoriesSvg width={30} height={30} />} number={userInfoDetails.stories_count} />
|
<CreateCountComponent title={t("generalSetting.storiesCreated", { ns: "personal" })} icon={<StoriesSvg width={16} height={16} />} number={userInfoDetails.stories_count} />
|
||||||
<CreateCountComponent title={t("generalSetting.conversationsWithMemo", { ns: "personal" })} icon={<ConversationsSvg width={30} height={30} />} number={userInfoDetails.conversations_count} />
|
<CreateCountComponent title={t("generalSetting.conversationsWithMemo", { ns: "personal" })} icon={<ConversationsSvg width={16} height={16} />} number={userInfoDetails.conversations_count} />
|
||||||
</View>
|
</View>
|
||||||
|
|
||||||
{/* 排行榜 */}
|
{/* 排行榜 */}
|
||||||
|
|||||||
@ -221,7 +221,7 @@ const Setting = () => {
|
|||||||
<TouchableOpacity onPress={() => { router.push('/owner') }}>
|
<TouchableOpacity onPress={() => { router.push('/owner') }}>
|
||||||
<ReturnArrowSvg />
|
<ReturnArrowSvg />
|
||||||
</TouchableOpacity>
|
</TouchableOpacity>
|
||||||
<Text style={styles.modalTitle}>{t('generalSetting.allTitle', { ns: 'personal' })}</Text>
|
<ThemedText style={styles.modalTitle} >{t('generalSetting.allTitle', { ns: 'personal' })}</ThemedText>
|
||||||
<Text style={{ opacity: 0 }}>×</Text>
|
<Text style={{ opacity: 0 }}>×</Text>
|
||||||
</View>
|
</View>
|
||||||
<ScrollView style={styles.modalContent} showsVerticalScrollIndicator={false}>
|
<ScrollView style={styles.modalContent} showsVerticalScrollIndicator={false}>
|
||||||
@ -269,11 +269,11 @@ const Setting = () => {
|
|||||||
</View> */}
|
</View> */}
|
||||||
{/* 权限信息 */}
|
{/* 权限信息 */}
|
||||||
<View style={{ marginTop: 16 }}>
|
<View style={{ marginTop: 16 }}>
|
||||||
<ThemedText style={{ marginLeft: 16, marginVertical: 8, color: '#AC7E35', fontSize: 14, fontWeight: '600' }}>{t('permission.permissionManagement', { ns: 'personal' })}</ThemedText>
|
<ThemedText style={{ marginLeft: 16, marginVertical: 8, color: '#AC7E35', fontSize: 14, fontWeight: '600' }} type="sfPro">{t('permission.permissionManagement', { ns: 'personal' })}</ThemedText>
|
||||||
<View style={styles.content}>
|
<View style={styles.content}>
|
||||||
{/* 相册权限 */}
|
{/* 相册权限 */}
|
||||||
<View style={styles.item}>
|
<View style={styles.item}>
|
||||||
<ThemedText style={styles.itemText}>{t('permission.galleryAccess', { ns: 'personal' })}</ThemedText>
|
<ThemedText style={styles.itemText} type="sfPro">{t('permission.galleryAccess', { ns: 'personal' })}</ThemedText>
|
||||||
<CustomSwitch
|
<CustomSwitch
|
||||||
isEnabled={albumEnabled}
|
isEnabled={albumEnabled}
|
||||||
toggleSwitch={toggleAlbum}
|
toggleSwitch={toggleAlbum}
|
||||||
@ -284,7 +284,7 @@ const Setting = () => {
|
|||||||
{/* 位置权限 */}
|
{/* 位置权限 */}
|
||||||
<View style={styles.item}>
|
<View style={styles.item}>
|
||||||
<View>
|
<View>
|
||||||
<ThemedText style={styles.itemText}>{t('permission.locationPermission', { ns: 'personal' })}</ThemedText>
|
<ThemedText style={styles.itemText} type="sfPro">{t('permission.locationPermission', { ns: 'personal' })}</ThemedText>
|
||||||
</View>
|
</View>
|
||||||
<CustomSwitch
|
<CustomSwitch
|
||||||
isEnabled={locationEnabled}
|
isEnabled={locationEnabled}
|
||||||
@ -294,7 +294,7 @@ const Setting = () => {
|
|||||||
<Divider />
|
<Divider />
|
||||||
<View style={styles.item}>
|
<View style={styles.item}>
|
||||||
<View>
|
<View>
|
||||||
<ThemedText style={styles.itemText}>{t('permission.pushNotification', { ns: 'personal' })}</ThemedText>
|
<ThemedText style={styles.itemText} type="sfPro">{t('permission.pushNotification', { ns: 'personal' })}</ThemedText>
|
||||||
</View>
|
</View>
|
||||||
<CustomSwitch
|
<CustomSwitch
|
||||||
isEnabled={notificationsEnabled}
|
isEnabled={notificationsEnabled}
|
||||||
@ -335,62 +335,62 @@ const Setting = () => {
|
|||||||
</View> */}
|
</View> */}
|
||||||
{/* 协议 */}
|
{/* 协议 */}
|
||||||
<View style={{ marginTop: 16 }}>
|
<View style={{ marginTop: 16 }}>
|
||||||
<ThemedText style={{ marginLeft: 16, marginVertical: 8, color: '#AC7E35', fontSize: 14, fontWeight: '600' }}>{t('lcenses.title', { ns: 'personal' })}</ThemedText>
|
<ThemedText style={{ marginLeft: 16, marginVertical: 8, color: '#AC7E35', fontSize: 14, fontWeight: '600' }} type="sfPro">{t('lcenses.title', { ns: 'personal' })}</ThemedText>
|
||||||
<View style={styles.content}>
|
<View style={styles.content}>
|
||||||
<TouchableOpacity style={styles.item} onPress={() => { setModalType('privacy'); setPrivacyModalVisible(true) }} >
|
<TouchableOpacity style={styles.item} onPress={() => { setModalType('privacy'); setPrivacyModalVisible(true) }} >
|
||||||
<ThemedText style={styles.itemText}>{t('lcenses.privacyPolicy', { ns: 'personal' })}</ThemedText>
|
<ThemedText style={styles.itemText} type="sfPro">{t('lcenses.privacyPolicy', { ns: 'personal' })}</ThemedText>
|
||||||
<RightArrowSvg />
|
<RightArrowSvg />
|
||||||
</TouchableOpacity>
|
</TouchableOpacity>
|
||||||
<Divider />
|
<Divider />
|
||||||
<TouchableOpacity style={styles.item} onPress={() => { setModalType('terms'); setPrivacyModalVisible(true) }} >
|
<TouchableOpacity style={styles.item} onPress={() => { setModalType('terms'); setPrivacyModalVisible(true) }} >
|
||||||
<ThemedText style={styles.itemText}>{t('lcenses.applyPermission', { ns: 'personal' })}</ThemedText>
|
<ThemedText style={styles.itemText} type="sfPro">{t('lcenses.applyPermission', { ns: 'personal' })}</ThemedText>
|
||||||
<RightArrowSvg />
|
<RightArrowSvg />
|
||||||
</TouchableOpacity>
|
</TouchableOpacity>
|
||||||
<Divider />
|
<Divider />
|
||||||
<TouchableOpacity style={styles.item} onPress={() => { setModalType('user'); setPrivacyModalVisible(true) }} >
|
<TouchableOpacity style={styles.item} onPress={() => { setModalType('user'); setPrivacyModalVisible(true) }} >
|
||||||
<ThemedText style={styles.itemText}>{t('lcenses.userAgreement', { ns: 'personal' })}</ThemedText>
|
<ThemedText style={styles.itemText} type="sfPro">{t('lcenses.userAgreement', { ns: 'personal' })}</ThemedText>
|
||||||
<RightArrowSvg />
|
<RightArrowSvg />
|
||||||
</TouchableOpacity>
|
</TouchableOpacity>
|
||||||
<Divider />
|
<Divider />
|
||||||
<TouchableOpacity style={styles.item} onPress={() => { setModalType('ai'); setPrivacyModalVisible(true) }} >
|
<TouchableOpacity style={styles.item} onPress={() => { setModalType('ai'); setPrivacyModalVisible(true) }} >
|
||||||
<ThemedText style={styles.itemText}>{t('lcenses.aiPolicy', { ns: 'personal' })}</ThemedText>
|
<ThemedText style={styles.itemText} type="sfPro">{t('lcenses.aiPolicy', { ns: 'personal' })}</ThemedText>
|
||||||
<RightArrowSvg />
|
<RightArrowSvg />
|
||||||
</TouchableOpacity>
|
</TouchableOpacity>
|
||||||
<Divider />
|
<Divider />
|
||||||
<TouchableOpacity style={styles.item} onPress={() => { setLcensesModalVisible(true) }} >
|
<TouchableOpacity style={styles.item} onPress={() => { setLcensesModalVisible(true) }} >
|
||||||
<ThemedText style={styles.itemText}>{t('lcenses.qualification', { ns: 'personal' })}</ThemedText>
|
<ThemedText style={styles.itemText} type="sfPro">{t('lcenses.qualification', { ns: 'personal' })}</ThemedText>
|
||||||
<RightArrowSvg />
|
<RightArrowSvg />
|
||||||
</TouchableOpacity>
|
</TouchableOpacity>
|
||||||
<Divider />
|
<Divider />
|
||||||
<TouchableOpacity style={[styles.item, { display: language == "en" ? 'none' : 'flex' }]} onPress={() => Linking.openURL("https://beian.miit.gov.cn/")} >
|
<TouchableOpacity style={[styles.item, { display: language == "en" ? 'none' : 'flex' }]} onPress={() => Linking.openURL("https://beian.miit.gov.cn/")} >
|
||||||
<ThemedText style={styles.itemText}>{t('lcenses.ICP', { ns: 'personal' })}沪ICP备2025133004号-2A</ThemedText>
|
<ThemedText style={styles.itemText} type="sfPro">{t('lcenses.ICP', { ns: 'personal' })}沪ICP备2025133004号-2A</ThemedText>
|
||||||
<RightArrowSvg />
|
<RightArrowSvg />
|
||||||
</TouchableOpacity>
|
</TouchableOpacity>
|
||||||
</View>
|
</View>
|
||||||
</View>
|
</View>
|
||||||
{/* 其他信息 */}
|
{/* 其他信息 */}
|
||||||
<View style={{ marginTop: 16 }}>
|
<View style={{ marginTop: 16 }}>
|
||||||
<ThemedText style={{ marginLeft: 16, marginVertical: 8, color: '#AC7E35', fontSize: 14, fontWeight: '600' }}>{t('generalSetting.otherInformation', { ns: 'personal' })}</ThemedText>
|
<ThemedText style={{ marginLeft: 16, marginVertical: 8, color: '#AC7E35', fontSize: 14, fontWeight: '600' }} type="sfPro">{t('generalSetting.otherInformation', { ns: 'personal' })}</ThemedText>
|
||||||
<View style={styles.content}>
|
<View style={styles.content}>
|
||||||
<TouchableOpacity style={styles.item} onPress={() => Linking.openURL("https://work.weixin.qq.com/kfid/kfca0ac87f4e05e8bfd")} >
|
<TouchableOpacity style={styles.item} onPress={() => Linking.openURL("https://work.weixin.qq.com/kfid/kfca0ac87f4e05e8bfd")} >
|
||||||
<ThemedText style={styles.itemText}>{t('generalSetting.contactUs', { ns: 'personal' })}</ThemedText>
|
<ThemedText style={styles.itemText} type="sfPro">{t('generalSetting.contactUs', { ns: 'personal' })}</ThemedText>
|
||||||
{/* <RightArrowSvg /> */}
|
{/* <RightArrowSvg /> */}
|
||||||
</TouchableOpacity>
|
</TouchableOpacity>
|
||||||
<Divider />
|
<Divider />
|
||||||
<View style={styles.item}>
|
<View style={styles.item}>
|
||||||
<ThemedText style={styles.itemText}>{t('generalSetting.version', { ns: 'personal' })}</ThemedText>
|
<ThemedText style={styles.itemText} type="sfPro">{t('generalSetting.version', { ns: 'personal' })}</ThemedText>
|
||||||
<ThemedText style={styles.itemText}>{"0.5.0"}</ThemedText>
|
<ThemedText style={styles.itemText}>{"0.5.0"}</ThemedText>
|
||||||
</View>
|
</View>
|
||||||
</View>
|
</View>
|
||||||
</View>
|
</View>
|
||||||
{/* 退出 */}
|
{/* 退出 */}
|
||||||
<TouchableOpacity style={[styles.premium, { marginVertical: 8 }]} onPress={handleLogout}>
|
<TouchableOpacity style={[styles.premium, { marginVertical: 8 }]} onPress={handleLogout}>
|
||||||
<ThemedText style={{ color: '#E2793F', fontSize: 14, fontWeight: '600' }}>{t('generalSetting.logout', { ns: 'personal' })}</ThemedText>
|
<ThemedText style={{ color: '#E2793F', fontSize: 14, fontWeight: '600' }} type="sfPro">{t('generalSetting.logout', { ns: 'personal' })}</ThemedText>
|
||||||
<LogoutSvg />
|
<LogoutSvg />
|
||||||
</TouchableOpacity>
|
</TouchableOpacity>
|
||||||
{/* 注销账号 */}
|
{/* 注销账号 */}
|
||||||
<TouchableOpacity style={[styles.premium, { marginVertical: 8 }]} onPress={() => setDeleteModalVisible(true)}>
|
<TouchableOpacity style={[styles.premium, { marginVertical: 8 }]} onPress={() => setDeleteModalVisible(true)}>
|
||||||
<ThemedText style={{ color: '#E2793F', fontSize: 14, fontWeight: '600' }}>{t('generalSetting.deleteAccount', { ns: 'personal' })}</ThemedText>
|
<ThemedText style={{ color: '#E2793F', fontSize: 14, fontWeight: '600' }} type="sfPro">{t('generalSetting.deleteAccount', { ns: 'personal' })}</ThemedText>
|
||||||
<DeleteSvg />
|
<DeleteSvg />
|
||||||
</TouchableOpacity>
|
</TouchableOpacity>
|
||||||
</ScrollView>
|
</ScrollView>
|
||||||
|
|||||||
@ -172,7 +172,7 @@ export default function OwnerPage() {
|
|||||||
<TouchableOpacity onPress={() => { router.push('/owner') }} style={{ padding: 16 }}>
|
<TouchableOpacity onPress={() => { router.push('/owner') }} style={{ padding: 16 }}>
|
||||||
<ReturnArrowSvg />
|
<ReturnArrowSvg />
|
||||||
</TouchableOpacity>
|
</TouchableOpacity>
|
||||||
<ThemedText style={styles.headerTitle}>
|
<ThemedText style={styles.headerTitle} >
|
||||||
Top Memory Makers
|
Top Memory Makers
|
||||||
</ThemedText>
|
</ThemedText>
|
||||||
<ThemedText className='opacity-0'>123</ThemedText>
|
<ThemedText className='opacity-0'>123</ThemedText>
|
||||||
|
|||||||
@ -95,6 +95,7 @@ const CascaderComponent: React.FC<CascaderProps> = ({
|
|||||||
textStyle,
|
textStyle,
|
||||||
isActive && [styles.activeText, activeTextStyle]
|
isActive && [styles.activeText, activeTextStyle]
|
||||||
]}
|
]}
|
||||||
|
type='sfPro'
|
||||||
>
|
>
|
||||||
{item.name}
|
{item.name}
|
||||||
</ThemedText>
|
</ThemedText>
|
||||||
|
|||||||
@ -4,6 +4,7 @@ import { useTranslation } from 'react-i18next';
|
|||||||
import { ScrollView, StyleSheet, Text, TouchableOpacity, View } from 'react-native';
|
import { ScrollView, StyleSheet, Text, TouchableOpacity, View } from 'react-native';
|
||||||
import Modal from 'react-native-modal';
|
import Modal from 'react-native-modal';
|
||||||
import Cascader, { CascaderItem } from '../cascader';
|
import Cascader, { CascaderItem } from '../cascader';
|
||||||
|
import { ThemedText } from '../ThemedText';
|
||||||
|
|
||||||
interface ClassifyModalProps {
|
interface ClassifyModalProps {
|
||||||
modalVisible: boolean;
|
modalVisible: boolean;
|
||||||
@ -39,9 +40,9 @@ const ClassifyModal = (props: ClassifyModalProps) => {
|
|||||||
<View style={styles.modalView}>
|
<View style={styles.modalView}>
|
||||||
<View style={styles.modalHeader}>
|
<View style={styles.modalHeader}>
|
||||||
<Text style={{ opacity: 0 }}>Settings</Text>
|
<Text style={{ opacity: 0 }}>Settings</Text>
|
||||||
<Text style={styles.modalTitle}>{t('generalSetting.classify', { ns: 'personal' })}</Text>
|
<ThemedText style={styles.modalTitle}>{t('generalSetting.classify', { ns: 'personal' })}</ThemedText>
|
||||||
<TouchableOpacity onPress={() => setModalVisible(false)}>
|
<TouchableOpacity onPress={() => setModalVisible(false)}>
|
||||||
<Text style={styles.closeButton}>×</Text>
|
<ThemedText style={styles.closeButton}>×</ThemedText>
|
||||||
</TouchableOpacity>
|
</TouchableOpacity>
|
||||||
</View>
|
</View>
|
||||||
<ScrollView style={styles.modalContent} showsVerticalScrollIndicator={false}>
|
<ScrollView style={styles.modalContent} showsVerticalScrollIndicator={false}>
|
||||||
|
|||||||
@ -20,12 +20,10 @@ const CreateCountComponent = React.memo((props: CreateCountProps) => {
|
|||||||
return (
|
return (
|
||||||
<View style={containerStyle}>
|
<View style={containerStyle}>
|
||||||
<View style={styles.header}>
|
<View style={styles.header}>
|
||||||
<View className="mt-1">
|
<ThemedText type="sfPro" weight="bold" color="textSecondary" size="xxs" style={{ lineHeight: 16 }}>{props.title}</ThemedText>
|
||||||
{props.icon}
|
{props.icon}
|
||||||
</View>
|
|
||||||
<ThemedText style={styles.title} className="!text-textSecondary">{props.title}</ThemedText>
|
|
||||||
</View>
|
</View>
|
||||||
<ThemedText style={styles.number} className="!text-textSecondary">{props.number}</ThemedText>
|
<ThemedText weight="bold" color="textSecondary" size="title" style={{ lineHeight: 36, textAlign: "right" }}>{props.number}</ThemedText>
|
||||||
</View>
|
</View>
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
@ -35,11 +33,12 @@ const styles = StyleSheet.create({
|
|||||||
flex: 1,
|
flex: 1,
|
||||||
display: "flex",
|
display: "flex",
|
||||||
flexDirection: "column",
|
flexDirection: "column",
|
||||||
alignItems: "center",
|
// alignItems: "center",
|
||||||
justifyContent: "center",
|
justifyContent: "center",
|
||||||
gap: 8,
|
gap: 8,
|
||||||
backgroundColor: "#FAF9F6",
|
backgroundColor: "#FAF9F6",
|
||||||
padding: 16,
|
paddingVertical: 16,
|
||||||
|
paddingRight: 16,
|
||||||
borderRadius: 12,
|
borderRadius: 12,
|
||||||
shadowColor: "#000",
|
shadowColor: "#000",
|
||||||
shadowOffset: {
|
shadowOffset: {
|
||||||
@ -51,13 +50,12 @@ const styles = StyleSheet.create({
|
|||||||
// elevation: 1,
|
// elevation: 1,
|
||||||
},
|
},
|
||||||
header: {
|
header: {
|
||||||
width: "100%",
|
width: "90%",
|
||||||
display: "flex",
|
display: "flex",
|
||||||
flexDirection: "row",
|
flexDirection: "row",
|
||||||
alignItems: "center",
|
|
||||||
paddingHorizontal: 16,
|
paddingHorizontal: 16,
|
||||||
justifyContent: "center",
|
alignItems: "flex-start",
|
||||||
gap: 8,
|
gap: 4,
|
||||||
},
|
},
|
||||||
title: {
|
title: {
|
||||||
fontSize: 20,
|
fontSize: 20,
|
||||||
|
|||||||
@ -36,6 +36,7 @@ const PodiumComponent = ({ data }: IPodium) => {
|
|||||||
numberOfLines={1}
|
numberOfLines={1}
|
||||||
ellipsizeMode="tail"
|
ellipsizeMode="tail"
|
||||||
style={styles.title}
|
style={styles.title}
|
||||||
|
type="inter"
|
||||||
>
|
>
|
||||||
{data[1]?.user_nick_name}
|
{data[1]?.user_nick_name}
|
||||||
</ThemedText>
|
</ThemedText>
|
||||||
@ -65,6 +66,7 @@ const PodiumComponent = ({ data }: IPodium) => {
|
|||||||
numberOfLines={2}
|
numberOfLines={2}
|
||||||
ellipsizeMode="tail"
|
ellipsizeMode="tail"
|
||||||
style={styles.title}
|
style={styles.title}
|
||||||
|
type="inter"
|
||||||
>
|
>
|
||||||
{data[0]?.user_nick_name}
|
{data[0]?.user_nick_name}
|
||||||
</ThemedText>
|
</ThemedText>
|
||||||
@ -94,6 +96,7 @@ const PodiumComponent = ({ data }: IPodium) => {
|
|||||||
numberOfLines={1}
|
numberOfLines={1}
|
||||||
ellipsizeMode="tail"
|
ellipsizeMode="tail"
|
||||||
style={styles.title}
|
style={styles.title}
|
||||||
|
type="inter"
|
||||||
>
|
>
|
||||||
{data[2]?.user_nick_name}
|
{data[2]?.user_nick_name}
|
||||||
</ThemedText>
|
</ThemedText>
|
||||||
|
|||||||
@ -15,9 +15,9 @@ const RankList = (props: IRankList) => {
|
|||||||
contentContainerStyle={{ flexGrow: 1, paddingHorizontal: 16, marginTop: 16 }}
|
contentContainerStyle={{ flexGrow: 1, paddingHorizontal: 16, marginTop: 16 }}
|
||||||
>
|
>
|
||||||
<View style={styles.item}>
|
<View style={styles.item}>
|
||||||
<ThemedText style={styles.headerText}>Rank</ThemedText>
|
<ThemedText style={styles.headerText} type="sfPro">Rank</ThemedText>
|
||||||
<ThemedText style={styles.headerText}>Username</ThemedText>
|
<ThemedText style={styles.headerText} type="sfPro">Username</ThemedText>
|
||||||
<ThemedText style={styles.headerText}>Profile</ThemedText>
|
<ThemedText style={styles.headerText} type="sfPro">Profile</ThemedText>
|
||||||
</View>
|
</View>
|
||||||
{props.data?.filter((item, index) => index > 2).map((item, index) => (
|
{props.data?.filter((item, index) => index > 2).map((item, index) => (
|
||||||
<View
|
<View
|
||||||
@ -35,8 +35,8 @@ const RankList = (props: IRankList) => {
|
|||||||
<OwnerSvg width="100%" height="100%" />
|
<OwnerSvg width="100%" height="100%" />
|
||||||
</View>
|
</View>
|
||||||
)}
|
)}
|
||||||
<ThemedText style={styles.itemRank}>{index + 1}</ThemedText>
|
<ThemedText style={styles.itemRank} type="sfPro">{index + 1}</ThemedText>
|
||||||
<ThemedText style={styles.itemName}>{item.user_nick_name}</ThemedText>
|
<ThemedText style={styles.itemName} type="inter">{item.user_nick_name}</ThemedText>
|
||||||
<View style={{ opacity: index == 1 ? 0 : 1 }}>
|
<View style={{ opacity: index == 1 ? 0 : 1 }}>
|
||||||
{(() => {
|
{(() => {
|
||||||
const [imageError, setImageError] = useState(false);
|
const [imageError, setImageError] = useState(false);
|
||||||
@ -66,9 +66,9 @@ const styles = StyleSheet.create({
|
|||||||
backgroundColor: 'white',
|
backgroundColor: 'white',
|
||||||
},
|
},
|
||||||
headerText: {
|
headerText: {
|
||||||
fontSize: 14,
|
fontSize: 12,
|
||||||
color: "#4C320C",
|
color: "#4C320C",
|
||||||
fontWeight: "600"
|
fontWeight: "500"
|
||||||
},
|
},
|
||||||
item: {
|
item: {
|
||||||
flexDirection: 'row',
|
flexDirection: 'row',
|
||||||
@ -85,7 +85,7 @@ const styles = StyleSheet.create({
|
|||||||
fontWeight: "700"
|
fontWeight: "700"
|
||||||
},
|
},
|
||||||
itemName: {
|
itemName: {
|
||||||
fontSize: 14,
|
fontSize: 12,
|
||||||
color: "#AC7E35",
|
color: "#AC7E35",
|
||||||
},
|
},
|
||||||
self: {
|
self: {
|
||||||
|
|||||||
@ -79,11 +79,11 @@ const UserInfo = (props: UserInfoProps) => {
|
|||||||
return (
|
return (
|
||||||
<View style={styles.container}>
|
<View style={styles.container}>
|
||||||
<View style={styles.info}>
|
<View style={styles.info}>
|
||||||
<ThemedText style={styles.nickname}>{userInfo?.nickname}</ThemedText>
|
<ThemedText style={styles.nickname} type="sfPro">{userInfo?.nickname}</ThemedText>
|
||||||
<ThemedText style={styles.userId}>{t('generalSetting.userId', { ns: 'personal' })}{userInfo?.user_id}</ThemedText>
|
<ThemedText style={styles.userId} type="inter">{t('generalSetting.userId', { ns: 'personal' })}{userInfo?.user_id}</ThemedText>
|
||||||
<View style={styles.location}>
|
<View style={styles.location}>
|
||||||
<LocationSvg />
|
<LocationSvg />
|
||||||
<ThemedText style={styles.userId}>
|
<ThemedText style={styles.userId} type="inter">
|
||||||
{currentLocation?.country}-{currentLocation?.city}-{currentLocation?.district}
|
{currentLocation?.country}-{currentLocation?.city}-{currentLocation?.district}
|
||||||
</ThemedText>
|
</ThemedText>
|
||||||
<TouchableOpacity
|
<TouchableOpacity
|
||||||
|
|||||||
@ -35,9 +35,13 @@ export default function UserInfo({ userInfo }: { userInfo: UserInfoDetails }) {
|
|||||||
<View className='flex flex-row items-center gap-2 w-full justify-between'>
|
<View className='flex flex-row items-center gap-2 w-full justify-between'>
|
||||||
<View style={{ width: "100%", flexDirection: "row", alignItems: "center", gap: 2 }}>
|
<View style={{ width: "100%", flexDirection: "row", alignItems: "center", gap: 2 }}>
|
||||||
<ThemedText
|
<ThemedText
|
||||||
style={{ maxWidth: "90%", color: '#4C320C', fontSize: 32, lineHeight: 36, fontWeight: '700' }}
|
style={{ maxWidth: "90%", lineHeight: 30 }}
|
||||||
|
weight='bold'
|
||||||
|
color='textSecondary'
|
||||||
|
size='3xl'
|
||||||
numberOfLines={1}
|
numberOfLines={1}
|
||||||
ellipsizeMode="tail"
|
ellipsizeMode="tail"
|
||||||
|
|
||||||
>
|
>
|
||||||
{userInfo?.user_info?.nickname}
|
{userInfo?.user_info?.nickname}
|
||||||
</ThemedText>
|
</ThemedText>
|
||||||
@ -62,6 +66,7 @@ export default function UserInfo({ userInfo }: { userInfo: UserInfoDetails }) {
|
|||||||
flexShrink: 1,
|
flexShrink: 1,
|
||||||
flexGrow: 0,
|
flexGrow: 0,
|
||||||
}}
|
}}
|
||||||
|
type="inter"
|
||||||
numberOfLines={1}
|
numberOfLines={1}
|
||||||
ellipsizeMode="tail"
|
ellipsizeMode="tail"
|
||||||
>
|
>
|
||||||
@ -91,6 +96,7 @@ export default function UserInfo({ userInfo }: { userInfo: UserInfoDetails }) {
|
|||||||
maxWidth: 40,
|
maxWidth: 40,
|
||||||
lineHeight: 20
|
lineHeight: 20
|
||||||
}}
|
}}
|
||||||
|
type="inter"
|
||||||
numberOfLines={1}
|
numberOfLines={1}
|
||||||
ellipsizeMode="tail"
|
ellipsizeMode="tail"
|
||||||
>
|
>
|
||||||
|
|||||||
@ -38,6 +38,6 @@ export const Fonts = {
|
|||||||
} as const;
|
} as const;
|
||||||
|
|
||||||
export type FontWeight = keyof Omit<typeof Fonts, 'quicksand' | 'sfPro' | 'inter' | 'xs' | 'sm' | 'base' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl'>;
|
export type FontWeight = keyof Omit<typeof Fonts, 'quicksand' | 'sfPro' | 'inter' | 'xs' | 'sm' | 'base' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl'>;
|
||||||
export type FontSize = 'xs' | 'sm' | 'base' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | 'title';
|
export type FontSize = "xxs" | "xs" | "sm" | "base" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "title";
|
||||||
export type FontColor = 'bgPrimary' | 'bgSecondary' | 'textPrimary' | 'textSecondary' | 'textThird' | 'textWhite';
|
export type FontColor = 'bgPrimary' | 'bgSecondary' | 'textPrimary' | 'textSecondary' | 'textThird' | 'textWhite';
|
||||||
|
|
||||||
|
|||||||
@ -74,7 +74,7 @@
|
|||||||
"confirm": "Confirm",
|
"confirm": "Confirm",
|
||||||
"location": "Location",
|
"location": "Location",
|
||||||
"rank": "Top Memory Makers",
|
"rank": "Top Memory Makers",
|
||||||
"userId": "User ID",
|
"userId": "User ID : ",
|
||||||
"usedStorage": "Storage Used",
|
"usedStorage": "Storage Used",
|
||||||
"remainingPoints": "Points Remaining",
|
"remainingPoints": "Points Remaining",
|
||||||
"totalVideo": "Total Videos",
|
"totalVideo": "Total Videos",
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user