style

src/components/nftGroupCard.tsx

@@ -45,8 +45,8 @@ const styles = StyleSheet.create({
 		borderRadius: 10,
 	},
 	groupItem: {
-		paddingTop: 17,
-		paddingBottom: 17,
+		paddingTop: 12,
+		paddingBottom: 12,
 		paddingLeft: 20,
 		paddingRight: 20,
 		flexDirection: 'row',
@@ -56,12 +56,14 @@ const styles = StyleSheet.create({
 		marginBottom: 8,
 	},
 	groupIcon: {
-		width: 30,
-		height: 30,
+		width: 40,
+		height: 40,
+		borderRadius: 4,
 		marginRight: 20,
 	},
 	groupName: {
 		height: 30,
 		lineHeight: 30,
+		fontSize: 16,
 	},
 });

src/pages/navigations/home.tsx

@@ -1,9 +1,8 @@
-import React, { useEffect, useState } from 'react';
-import { Alert, Button, StyleSheet, View } from 'react-native';
+import React, { useEffect, useState, useRef } from 'react';
+import { Text, StyleSheet, Image, View, ImageBackground, Pressable, Animated } from 'react-native';
 import { SafeAreaView } from 'react-native-safe-area-context';
 import LinearGradient from 'react-native-linear-gradient';
 import { postRequest } from '@/netWork/';
-import { getStorageData, setStorageData } from '@/storage/';
 import { useLoginCom } from '@/components/useLogin';
 import { NftGroupCard } from '@/components/nftGroupCard';
 
@@ -12,10 +11,9 @@ interface Props {
 }
 
 const Home = (props: Props) => {
-	const { isLogin, loading, userInfo, goTwitterAuthorize } =
-		useLoginCom(props);
+	const fadeAnim = useRef(new Animated.Value(0)).current;
+	const { isLogin, goTwitterAuthorize } = useLoginCom(props);
 	const [nftData, setNftData] = useState([]);
-
 	const goTwitter = () => {
 		if (isLogin) {
 			props.navigation.navigate('Twitter');
@@ -41,14 +39,25 @@ const Home = (props: Props) => {
 			colors={['#91CAFF', '#ECF6FF', '#FFFFFF']}
 			style={{ flex: 1 }}>
 			<SafeAreaView style={styles.container}>
-				<View style={styles.TwitterBtnWrap}>
-					<Button
-						onPress={goTwitter}
-						title="Web3 Twitter"
-						color="#841584"
-						accessibilityLabel="go Web3 Twitter"
+				<View style={styles.denetWrap}>
+					<Image
+						style={styles.denet}
+						source={ require('../../static/img/home/welcome.png') }
 					/>
+					<ImageBackground
+						style={styles.goods}
+						source={ require('../../static/img/home/goods.png') }>
+					</ImageBackground>
 				</View>
+				<Pressable style={styles.TwitterBtnWrap} onPress={goTwitter}>
+					<View style={styles.TwitterLayer}>
+						<Image
+							style={styles.twitterIcon}
+							source={ require('../../static/img/home/twritter.png') }
+						/>
+						<Text style={styles.twitterFont}>Web3 Twitter</Text>
+					</View>
+				</Pressable>
 				<View style={{ flexDirection: 'row' }}>
 					<NftGroupCard nftData={nftData} />
 				</View>
@@ -60,13 +69,48 @@ const Home = (props: Props) => {
 const styles = StyleSheet.create({
 	container: {
 		flex: 1,
+	},
+	denetWrap: {
+		flexDirection: 'row',
 		alignItems: 'center',
-		paddingTop: 180,
+		height: 280,
+		paddingLeft: 16,
+		paddingRight: 16,
+	},
+	denet: {
+		width: 178,
+		height: 120,
+	},
+	goods: {
+		width: 180,
+		height: 280,
 	},
 	TwitterBtnWrap: {
-		width: 343,
+		paddingLeft: 16,
+		paddingRight: 16,
+		textAlign: 'left',
+	},
+	TwitterLayer: {
+		display: 'flex',
+		alignItems: 'center',
+		justifyContent: 'center',
+		flexDirection: 'row',
+		height: 64,
+		paddingLeft: 20,
+		paddingRight: 20,
+		borderRadius: 10,
 		backgroundColor: '#fff',
 	},
+	twitterIcon: {
+		width: 40,
+		height: 40,
+		borderRadius: 4,
+		marginRight: 20,
+	},
+	twitterFont: {
+		flex: 1,
+		fontSize: 16,
+	},
 });
 
 export default Home;

src/pages/navigations/me.tsx

@@ -64,17 +64,18 @@ const Me = (props: any) => {
 						footer={
 							<ModalFooter>
 								<ModalButton
-									textStyle={{ color: '#000' }}
-									text="Cancel"
+									textStyle={{ color: '#ff0000' }}
+									text="Log out"
 									onPress={() => {
+										logOut();
 										setShowDialog(false);
 									}}
 								/>
 								<ModalButton
-									textStyle={{ color: '#ff0000' }}
-									text="Log out"
+									textStyle={{ color: '#000' }}
+									text="Cancel"
 									onPress={() => {
-										logOut();
+										setShowDialog(false);
 									}}
 								/>
 							</ModalFooter>
@@ -132,7 +133,7 @@ const styles = StyleSheet.create({
 		justifyContent: 'center',
 	},
 	tipsText: {
-		color: '#B8B',
+		color: '#B8B8B8',
 		fontSize: 12,
 	},
 	modalContain: {