Responsive Todo app using react

Hello!

Here are some tips: Add invisible label for first (create todo) input. This is needed because not all screen readers can read placeholder text. Make this input field wider (fill space until add button). Buttons should always have type attribute to avoid unexpected behavior.

Clicking on to-do text should toggle done status. You can archive this by linking label & checkbox (either wrap input with label or use label with for value same as id in input (should be unique for each item). Fix layout shift caused by appearing x on hover.

If you'd like to implement DnD check out dnd kit

You may try to use some CSS framework, as you used naming like utility classes, you may like TailwindCSS.