<todo-list>
	<article>
		<div each={ todo in props.todos } key={todo.id}>
			<p class="todo">
				<label class={ todo.done ? 'completed' : null }>
				<input
		 type="checkbox"
   checked={ todo.done }
   onclick={ () => props.toggle(todo) } />
   <span class = {todo.done ? 'done':''}>	{ todo.title } </span>
				</label>
				<a href="#" onclick={(e)=>props.remove(e,todo)}><i class="fa-solid fa-trash"></i></a>
			</p>
			<hr>
		</div>
	</article>
</todo-list>
