Skip to content
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
105 changes: 57 additions & 48 deletions components/cardInfo.tsx
Original file line number Diff line number Diff line change
@@ -1,70 +1,79 @@
import { View, Text, StyleSheet, TouchableOpacity } from "react-native";
import { Ionicons } from "@expo/vector-icons";
import { format } from "date-fns";
import { StyleSheet, Text, TouchableOpacity, View } from "react-native";

type Task = {
title: string;
desc: string;
mat: string;
prof: string;
date: Date;
title: string;
desc: string;
mat: string;
prof: string;
date: Date;
};

type Props={
data:Task;
closeView: ()=> void;
type Props = {
data: Task;
closeView: () => void;
}

export default function TaskInfo({data, closeView}:Props){
export default function TaskInfo({ data, closeView }: Props) {
const date = data.date;
const dateObj = new Date(date);
const formatedDate = format(dateObj, 'dd/MM/yyyy HH:mm')

return (
<View style={styles.container}>
<View style={styles.content}>

<View style={styles.header}>
<TouchableOpacity onPress={closeView}>
<Ionicons size={30} color={"purple"} name="arrow-back-outline" />
</TouchableOpacity>
<Text style={styles.headerTitle}>{data.title}</Text>
</View>

<Text style={styles.subtitle}>Descrição</Text>
<View style={styles.wrapperDesc}>
<Text>{data.desc}</Text>
</View>

<Text style={styles.subtitle}>Professor</Text>
<View style={styles.wrapper}>
<Text>{data.prof}</Text>
</View>

<Text style={styles.subtitle}>Matéria</Text>
<View style={styles.wrapper}>
<Text>{data.mat}</Text>
</View>

<Text style={styles.subtitle}>Data</Text>
<View style={styles.wrapper}>
<Text>{formatedDate}</Text>
</View>

return(
<View style={styles.container}>
<View style={styles.content}>

<View style={styles.header}>
<TouchableOpacity onPress={closeView}>
<Ionicons size={30} color={"purple"} name="arrow-back-outline" />
</TouchableOpacity>
<Text style={styles.headerTitle}>{data.title}</Text>
</View>

<Text style={styles.subtitle}>Descrição</Text>
<View style={styles.wrapperDesc}>
<Text>{data.desc}</Text>
</View>

<Text style={styles.subtitle}>Professor</Text>
<View style={styles.wrapper}>
<Text>{data.prof}</Text>
</View>

<Text style={styles.subtitle}>Matéria</Text>
<View style={styles.wrapper}>
<Text>{data.mat}</Text>
</View>

</View>
</View>
)
}

const styles = StyleSheet.create({
container: {
padding: "3%",
backgroundColor: "rgba(93, 93, 93, 0.5)",
flex:1,
justifyContent:"center"
flex: 1,
justifyContent: "center"
},

header:{
flexDirection:"row",
header: {
flexDirection: "row",
height: 40,
elevation: 10,
marginBottom: 20,
alignItems: "center",
gap: 10,
},

headerTitle:{
headerTitle: {
fontSize: 22
},

Expand All @@ -76,24 +85,24 @@ const styles = StyleSheet.create({
paddingBottom: 30
},

wrapper:{
wrapper: {
borderWidth: 1,
padding: 5,
borderRadius:4,
borderRadius: 4,
borderColor: "purple"
},

wrapperDesc:{
wrapperDesc: {
borderWidth: 1,
padding: 5,
borderRadius:4,
borderRadius: 4,
borderColor: "purple",
height:100
height: 100
},

subtitle:{
subtitle: {
fontSize: 17,
color:"purple",
color: "purple",
marginTop: 10,
}
})