|
|
import React from "react"; |
|
|
import { |
|
|
Pressable, |
|
|
View, |
|
|
Text, |
|
|
Dimensions, |
|
|
Image, |
|
|
Appearance, |
|
|
Platform, |
|
|
} from "react-native"; |
|
|
import { connect } from "react-redux"; |
|
|
import { LinearGradient } from "expo-linear-gradient"; |
|
|
import { useNavigation } from "@react-navigation/native"; |
|
|
|
|
|
//style |
|
|
import tw from "tailwind-rn"; |
|
|
import fontSize from "../../../constants/fontSize"; |
|
|
import Colors from "../../../constants/Colors"; |
|
|
|
|
|
const { height, width } = Dimensions.get("window"); |
|
|
const ios = Platform.OS === "ios"; |
|
|
|
|
|
export const Single = ({ blog }) => { |
|
|
const navigation = useNavigation(); |
|
|
const colorScheme = Appearance.getColorScheme(); |
|
|
return ( |
|
|
<Pressable |
|
|
style={tw("flex ")} |
|
|
onPress={() => navigation.push("Blog", { id: blog?.id })} |
|
|
> |
|
|
<View |
|
|
style={[ |
|
|
tw("w-full rounded-sm overflow-hidden relative"), |
|
|
{ |
|
|
height: ((width - 32) * 3) / 4.5, |
|
|
}, |
|
|
]} |
|
|
> |
|
|
<Image |
|
|
resizeMode="contain" |
|
|
source={{ uri: `https://dnvn.ir/api/v1/file/${blog?.fileIds}` }} |
|
|
style={[tw("absolute left-0 top-0 w-full h-full ml-2")]} |
|
|
/> |
|
|
<LinearGradient |
|
|
colors={["transparent", "rgba(0,0,0,0.8)"]} |
|
|
start={{ x: 0.0, y: 0.0 }} |
|
|
end={{ x: 0.0, y: 1.1 }} |
|
|
style={tw( |
|
|
"flex justify-end absolute top-0 left-0 z-10 w-full h-full pb-2 px-2" |
|
|
)} |
|
|
> |
|
|
<View style={tw("w-full flex flex-row-reverse justify-between")}> |
|
|
<View style={tw("flex flex-row-reverse")}> |
|
|
<View |
|
|
style={[ |
|
|
{ width: 50, height: 50, backgroundColor: "#aaa" }, |
|
|
tw("rounded-full ml-1"), |
|
|
]} |
|
|
></View> |
|
|
<View style="flex py-2 justify-center"> |
|
|
<Text |
|
|
style={[ |
|
|
tw("text-gray-100"), |
|
|
{ |
|
|
fontFamily: "bold", |
|
|
fontSize: fontSize.tiny, |
|
|
textAlign: ios ? "right" : "auto", |
|
|
}, |
|
|
]} |
|
|
> |
|
|
{"نوشته از:" + " " + "کامران ایزدی"} |
|
|
</Text> |
|
|
<Text |
|
|
style={[ |
|
|
tw("text-gray-100 mt-2"), |
|
|
{ |
|
|
fontFamily: "bold", |
|
|
fontSize: fontSize.sm, |
|
|
textAlign: ios ? "right" : "auto", |
|
|
}, |
|
|
]} |
|
|
> |
|
|
{"سردبیر بخش وبلاگ دانوین"} |
|
|
</Text> |
|
|
</View> |
|
|
</View> |
|
|
<View style={tw("flex justify-center items-start")}> |
|
|
<Text |
|
|
style={[ |
|
|
tw("text-gray-100"), |
|
|
{ fontFamily: "bold", fontSize: fontSize.sm }, |
|
|
]} |
|
|
> |
|
|
{"زمان مطالعه" + " " + "۳۰ دقیقه"} |
|
|
</Text> |
|
|
<Text |
|
|
style={[ |
|
|
tw("mt-2 text-gray-100"), |
|
|
{ fontFamily: "bold", fontSize: fontSize.sm }, |
|
|
]} |
|
|
> |
|
|
{"1400/11/24"} |
|
|
</Text> |
|
|
</View> |
|
|
</View> |
|
|
</LinearGradient> |
|
|
</View> |
|
|
<View style={tw("flex justify-between")}> |
|
|
<View style={tw("flex mt-3")}> |
|
|
<Text |
|
|
style={{ |
|
|
fontFamily: "bold", |
|
|
fontSize: fontSize.lg, |
|
|
color: Colors.theme1[colorScheme].gray20, |
|
|
textAlign: ios ? "right" : "auto", |
|
|
}} |
|
|
> |
|
|
{blog?.title} |
|
|
</Text> |
|
|
<Text |
|
|
style={{ |
|
|
fontFamily: "regular", |
|
|
fontSize: fontSize.sm, |
|
|
color: Colors.theme1[colorScheme].gray2077, |
|
|
lineHeight: 25, |
|
|
marginTop: 10, |
|
|
textAlign: ios ? "right" : "auto", |
|
|
}} |
|
|
> |
|
|
هر نفسی که فرو می بریم، مرگی را که مدام به ما دست اندازی میکند پس |
|
|
میزند... در نهایت این مرگ است که باید پیروز شود، زیرا از هنگام تولد |
|
|
بخشی از سرنوشت ما شده و فقط مدت کوتاهی پیش از بلعیدن طعمه اش، با آن |
|
|
بازی می کند. با این همه، ما تا آنجا که ممکن است، با علاقه فراوان{" "} |
|
|
</Text> |
|
|
</View> |
|
|
</View> |
|
|
</Pressable> |
|
|
); |
|
|
}; |
|
|
|
|
|
const mapStateToProps = (state) => ({ |
|
|
blog: state.blog.list[0], |
|
|
}); |
|
|
|
|
|
const mapDispatchToProps = {}; |
|
|
|
|
|
export default connect(mapStateToProps, mapDispatchToProps)(Single);
|
|
|
|