Reza_ashrafi
/
RnDanovinExpo
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

reza added something

Browse Source
master
Reza_ashrafi 3 years ago
parent 6e70211a72
commit e492530a05
5 changed files with 88 additions and 41 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 54
      src/components/Drawer.js
  2. 32
      src/screens/Contact/Box.js
  3. 9
      src/screens/Contact/index.js
  4. 32
      src/screens/Faq/components/Instance.js
  5. 2
      src/screens/Faq/index.js

54
src/components/Drawer.js
Unescape View File

@ -21,9 +21,6 @@ import tw from "tailwind-rn";
import fontSize from "../constants/fontSize"; import fontSize from "../constants/fontSize";
import Colors from "../constants/Colors"; import Colors from "../constants/Colors";
const width = Dimensions.get("window").width;
const height = Dimensions.get("window").height;
if ( if (
Platform.OS === "android" && Platform.OS === "android" &&
UIManager.setLayoutAnimationEnabledExperimental UIManager.setLayoutAnimationEnabledExperimental
@ -31,7 +28,10 @@ if (
UIManager.setLayoutAnimationEnabledExperimental(true); UIManager.setLayoutAnimationEnabledExperimental(true);
} }
const Drawer = ({ position, setBoxPosition, user = JSON.parse(user) }) => { const Drawer = ({ position, setBoxPosition, user, mobile }) => {
const [height, setHeight] = useState(Dimensions.get("window").height);
const [width, setWidth] = useState(Dimensions.get("window").width);
const colorScheme = Appearance.getColorScheme(); const colorScheme = Appearance.getColorScheme();
const [routes, setRoutes] = useState([ const [routes, setRoutes] = useState([
{ {
@ -83,7 +83,11 @@ const Drawer = ({ position, setBoxPosition, user = JSON.parse(user) }) => {
return ( return (
<TouchableOpacity <TouchableOpacity
style={[ style={[
tw("w-full flex flex-row-reverse justify-start items-end mt-6"), tw(
`w-full flex flex-row-reverse justify-start items-end ${
mobile ? "mt-6" : "mt-10"
}`
),
{}, {},
]} ]}
onPress={() => navigation.navigate(route.route)} onPress={() => navigation.navigate(route.route)}
@ -92,7 +96,10 @@ const Drawer = ({ position, setBoxPosition, user = JSON.parse(user) }) => {
<Text <Text
style={[ style={[
tw("mr-2"), tw("mr-2"),
{ fontFamily: "regular", fontSize: fontSize.base }, {
fontFamily: "regular",
fontSize: mobile ? fontSize.base : fontSize.lg,
},
]} ]}
> >
{route.name} {route.name}
@ -101,6 +108,11 @@ const Drawer = ({ position, setBoxPosition, user = JSON.parse(user) }) => {
); );
}; };
const onLayout = () => {
setHeight(Dimensions.get("window").height);
setWidth(Dimensions.get("window").width);
};
return ( return (
<View <View
style={[ style={[
@ -112,6 +124,7 @@ const Drawer = ({ position, setBoxPosition, user = JSON.parse(user) }) => {
zIndex: 10000, zIndex: 10000,
}, },
]} ]}
onLayout={() => onLayout()}
> >
<Pressable <Pressable
onPress={() => setBoxPosition()} onPress={() => setBoxPosition()}
@ -124,43 +137,51 @@ const Drawer = ({ position, setBoxPosition, user = JSON.parse(user) }) => {
<View style={[tw("w-4/5 bg-white h-full flex flex-col")]}> <View style={[tw("w-4/5 bg-white h-full flex flex-col")]}>
<View <View
style={[ style={[
tw("flex flex-col items-end pt-3 pb-1 px-4"), tw("flex flex-col items-end pt-12 pb-1 px-4"),
{ backgroundColor: Colors.theme1[colorScheme].greenCF }, { backgroundColor: Colors.theme1[colorScheme].greenCF },
]} ]}
> >
{user?.picFileId ? ( {user?.picFileIds ? (
<Image <Image
source={{ uri: "https://dnvn.ir/api/v1/" + user.picFileId }} source={{ uri: "https://dnvn.ir/api/v1/" + user.picFileIds }}
style={[tw("rounded-full"), { width: 60, height: 60 }]} style={[
tw("rounded-full"),
{ width: mobile ? 60 : 100, height: mobile ? 60 : 100 },
]}
/> />
) : ( ) : (
<View <View
style={[ style={[
tw("rounded-full bg-gray-200"), tw("rounded-full bg-gray-200"),
{ minWidth: 60, minHeight: 60, zIndex : 1 }, {
width: mobile ? 60 : 100,
height: mobile ? 60 : 100,
zIndex: 1,
},
]} ]}
></View> ></View>
)} )}
<View <View
style={tw( style={tw(
"flex flex-row-reverse w-full justify-between px-2 pb-3 mt-1" "flex flex-row-reverse w-full justify-between px-2 pb-3 mt-2"
)} )}
> >
<View style={tw("flex flex-col")}> <View style={tw("flex flex-col")}>
<Text <Text
style={{ style={{
fontSize: fontSize.lg, fontSize: mobile ? fontSize.lg : fontSize.xl,
color: "white", color: "white",
fontFamily: "bold", fontFamily: "demi",
}} }}
> >
{user?.firstName + " " + user?.lastName} {user?.firstName + " " + user?.lastName}
</Text> </Text>
<Text <Text
style={{ style={{
fontSize: fontSize.tiny, fontSize: mobile ? fontSize.tiny : fontSize.lg,
color: "white", color: "white",
fontFamily: "bold", fontFamily: "bold",
marginTop: 5,
}} }}
> >
{user?.cellphone} {user?.cellphone}
@ -197,6 +218,7 @@ const Drawer = ({ position, setBoxPosition, user = JSON.parse(user) }) => {
const mapStateToProps = (state) => ({ const mapStateToProps = (state) => ({
user: state.user.status, user: state.user.status,
mobile: state.publicApi.mobile,
}); });
const mapDispatchToProps = { const mapDispatchToProps = {

32
src/screens/Contact/Box.js
Unescape View File

@ -1,15 +1,22 @@
import { View, Text, Image, TouchableOpacity, Platform } from "react-native"; import { View, Text, Image, TouchableOpacity, Platform } from "react-native";
import React from "react"; import React from "react";
import { connect } from "react-redux";
//style
import tw from "tailwind-rn"; import tw from "tailwind-rn";
import fontSize from "../../constants/fontSize"; import fontSize from "../../constants/fontSize";
const ios = Platform.OS === "ios"; const ios = Platform.OS === "ios";
const Box = ({ info }) => { const Box = ({ info, mobile }) => {
return ( return (
<TouchableOpacity <TouchableOpacity
style={[ style={[
tw("flex flex-row-reverse py-4 px-3 rounded-md mt-4"), tw(
`flex flex-row-reverse rounded-md mt-4 ${
mobile ? "py-4 px-3" : "py-5 px-5"
}`
),
{ {
backgroundColor: info.bg, backgroundColor: info.bg,
borderColor: info.borderColor, borderColor: info.borderColor,
@ -17,14 +24,17 @@ const Box = ({ info }) => {
}, },
]} ]}
> >
<Image source={info.icon} style={{ width: 40, height: 40 }} /> <Image
source={info.icon}
style={{ width: mobile ? 40 : 55, height: mobile ? 40 : 55 }}
/>
<View style={tw("flex flex-col flex-1 mr-3")}> <View style={tw("flex flex-col flex-1 mr-3")}>
<Text <Text
style={{ style={{
fontFamily: "bold", fontFamily: "bold",
fontSize: fontSize.lg, fontSize: mobile ? fontSize.lg : fontSize.xl3,
color: info.title.color, color: info.title.color,
textAlign : ios ? "right" : "auto", textAlign: ios ? "right" : "auto",
}} }}
> >
{info.title.text} {info.title.text}
@ -34,9 +44,9 @@ const Box = ({ info }) => {
tw("mt-1"), tw("mt-1"),
{ {
fontFamily: "light", fontFamily: "light",
fontSize: fontSize.sm, fontSize: mobile ? fontSize.sm : fontSize.lg,
color: info.description.color, color: info.description.color,
textAlign : ios ? "right" : "auto", textAlign: ios ? "right" : "auto",
}, },
]} ]}
> >
@ -47,7 +57,7 @@ const Box = ({ info }) => {
tw("self-start mt-2.5"), tw("self-start mt-2.5"),
{ {
fontFamily: "demi", fontFamily: "demi",
fontSize: fontSize.sm, fontSize: mobile ? fontSize.sm : fontSize.lg,
color: info?.link?.color, color: info?.link?.color,
}, },
]} ]}
@ -59,4 +69,8 @@ const Box = ({ info }) => {
); );
}; };
export default Box; const mapStateToProps = (state) => ({
mobile: state.publicApi.mobile,
});
export default connect(mapStateToProps)(Box);

9
src/screens/Contact/index.js
Unescape View File

@ -13,7 +13,7 @@ import tw from "tailwind-rn";
import Header from "../../components/Header"; import Header from "../../components/Header";
import Navbar from "../../components/Navbar"; import Navbar from "../../components/Navbar";
import Box from './Box'; import Box from "./Box";
//assets //assets
import onlineSupportIcon from "./assets/online-support.png"; import onlineSupportIcon from "./assets/online-support.png";
@ -49,12 +49,7 @@ function Contact({ info }) {
title={"ارتباط با ما"} title={"ارتباط با ما"}
description={"تیم پشتیبانی ما اینجاست تا شما رو کمک کنه"} description={"تیم پشتیبانی ما اینجاست تا شما رو کمک کنه"}
/> />
<ScrollView <ScrollView style={[tw("bg-white flex flex-col pb-20 px-4 mb-4")]}>
style={[
tw("bg-white flex flex-col pb-20 px-4 mb-4"),
{ width: width, height: height - height / 4.5 },
]}
>
{Object.keys(info).map((item, index) => ( {Object.keys(info).map((item, index) => (
<Box info={info[item]} key={index} /> <Box info={info[item]} key={index} />
))} ))}

32
src/screens/Faq/components/Instance.js
Unescape View File

@ -6,7 +6,7 @@ import {
Appearance, Appearance,
} from "react-native"; } from "react-native";
import { Entypo } from "@expo/vector-icons"; import { Entypo } from "@expo/vector-icons";
import { connect } from "react-redux";
//style //style
import tw from "tailwind-rn"; import tw from "tailwind-rn";
import fontSize from "../../../constants/fontSize"; import fontSize from "../../../constants/fontSize";
@ -14,13 +14,17 @@ import Colors from "../../../constants/Colors";
const { width } = Dimensions.get("window"); const { width } = Dimensions.get("window");
function Instance({ question, selectFaq }) { function Instance({ question, selectFaq, mobile }) {
const colorScheme = Appearance.getColorScheme(); const colorScheme = Appearance.getColorScheme();
return ( return (
<TouchableOpacity <TouchableOpacity
onPress={() => selectFaq(question.id)} onPress={() => selectFaq(question.id)}
style={[ style={[
tw("w-full flex flex-col my-1.5 rounded-md px-4 py-2"), tw(
`w-full flex flex-col my-1.5 rounded-md px-4 ${
mobile ? "py-2" : "py-3"
}`
),
{ {
backgroundColor: !question.active backgroundColor: !question.active
? "#F9F9F9" ? "#F9F9F9"
@ -39,7 +43,7 @@ function Instance({ question, selectFaq }) {
width: "90%", width: "90%",
textAlign: "right", textAlign: "right",
color: Colors.theme1[colorScheme].green79, color: Colors.theme1[colorScheme].green79,
fontSize: fontSize.tiny, fontSize: mobile ? fontSize.tiny : fontSize.lg,
fontFamily: "bold", fontFamily: "bold",
}, },
]} ]}
@ -47,9 +51,17 @@ function Instance({ question, selectFaq }) {
{question.title} {question.title}
</Text> </Text>
{question.active ? ( {question.active ? (
<Entypo name="minus" size={18} color={Colors.theme1[colorScheme].green79} /> <Entypo
name="minus"
size={18}
color={Colors.theme1[colorScheme].green79}
/>
) : ( ) : (
<Entypo name="plus" size={18} color={Colors.theme1[colorScheme].green79} /> <Entypo
name="plus"
size={18}
color={Colors.theme1[colorScheme].green79}
/>
)} )}
</View> </View>
{question.active && ( {question.active && (
@ -58,7 +70,7 @@ function Instance({ question, selectFaq }) {
style={[ style={[
{ {
color: Colors.theme1[colorScheme].green79, color: Colors.theme1[colorScheme].green79,
fontSize: fontSize.tiny, fontSize: mobile ? fontSize.tiny : fontSize.lg,
fontFamily: "light", fontFamily: "light",
}, },
tw("text-right flex-1"), tw("text-right flex-1"),
@ -72,4 +84,8 @@ function Instance({ question, selectFaq }) {
); );
} }
export default Instance; const mapStateToProps = (state) => ({
mobile: state.publicApi.mobile,
});
export default connect(mapStateToProps)(Instance);

2
src/screens/Faq/index.js
Unescape View File

@ -61,7 +61,7 @@ function Faq({ list, getFaq, searchResult, search, selectFaq, searchFaq }) {
/> />
</View> </View>
<ScrollView <ScrollView
style={[tw("bg-white flex flex-col pb-20 px-4 mb-4"), { width: width }]} style={[tw("bg-white flex flex-col pb-20 px-4 mb-4")]}
> >
{!search {!search
? list.length > 0 && ? list.length > 0 &&

Write Preview
Loading…
Cancel
Save