Handler function added to onclick event listener

Author: karmeensec

src/components/ToDo.tsx

@@ -13,7 +13,7 @@ const ToDo = ({ text, todos, setTodos, todo}: any) => {
   const ToDoCompleteHandler = function(): void {
 
     setTodos(todos.map((t: any) => {
-
+ 
       if (t.id === todo.id) {
 
         return {...t,  completed: !t.completed}
@@ -30,7 +30,7 @@ const ToDo = ({ text, todos, setTodos, todo}: any) => {
 
     <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', transition: '1s ease-in-out'  }} >
 
-        <li style={{ padding: '1rem' }}> {text} </li>
+        <li className={` todo-task ${!todo.completed ? 'completed' : ''} `}> {text} </li>
         <button type='submit' className='complete-button' onClick={ToDoCompleteHandler}> <VscCheck /> </button>
         <button type='submit' className='trash-button' onClick={ToDoDeleteHandler}> <VscTrash /> </button>