From 877c392fe574de44749e2f62b2675332703b455e Mon Sep 17 00:00:00 2001
From: isaacwsolomon <isaacwsolomon@gmail.com>
Date: Mon, 12 May 2025 15:17:54 +0200
Subject: [PATCH] Added icons and some styling
---
app/screens/list.tsx | 26 ++++++++++++++++++++++----
1 file changed, 22 insertions(+), 4 deletions(-)
diff --git a/app/screens/list.tsx b/app/screens/list.tsx
index ec59006..528de8c 100644
--- a/app/screens/list.tsx
+++ b/app/screens/list.tsx
@@ -4,7 +4,7 @@ import React, { useEffect, useState } from 'react';
import { View, Text, Button, TextInput, StyleSheet, FlatList, TouchableOpacity } from 'react-native';
import { FIRESTORE_DB } from '../../firebaseConfig';
import Ionicons from '@expo/vector-icons/Ionicons';
-
+import {Entypo} from '@expo/vector-icons'
export interface Todo {
title: string;
done: boolean;
@@ -52,10 +52,12 @@ const renderTodo = ({item} : any) => {
}
return(
<View>
- <TouchableOpacity onPress={toggleDone}>
- {!item.done && <Ionicons name="checkmark-circle" />}
- <Text> {item.title}</Text>
+ <TouchableOpacity onPress={toggleDone} style={styles.todo}>
+ {item.done && <Ionicons name="checkmark-circle" />}
+ {!item.done && <Entypo name="circle" size={24} color="black"/>}
+ <Text style={styles.todoText}> {item.title}</Text>
</TouchableOpacity>
+ <Ionicons name="trash-bin-outline" size={24} color="red" onPress={deleteItem}/>
</View>
);
};
@@ -102,5 +104,21 @@ const styles = StyleSheet.create ({
borderRadius: 4,
padding: 10,
backgroundColor: '#fff',
+ },
+
+ todoContainer: {
+ flexDirection: 'row',
+ alignItems: 'center',
+ backgroundColor: '#fff',
+ padding: 10,
+ marginVertical: 4,
+ },
+ todoText: {
+ flex: 1,
+
+ },
+ todo: {
+ flexDirection: 'row',
+ alignItems: 'center',
}
});
\ No newline at end of file
--
GitLab