Todos are really checklists that allow you to show tasks that have been completed.

Example

• [x] Make breakfast

• [x] Eat breakfast

• [ ] Get dressed

• [ ] Leave the house

  Additional paragraph.

Styling

A todo is wrapped in a div with a class of todo. Inside there is an input[type=checkbox] which will have its checked value set if the item is checked. The checkboxes will be marked with the readonly attribute.

The text of the todo is in a p element. If there is additional content, it will be following the p element.