simple-todos.html 707 B

123456789101112131415161718192021222324252627282930313233
  1. <!-- Predefined "head" template -->
  2. <head>
  3. <title>Todo List</title>
  4. </head>
  5. <!-- Predefined "body" template -->
  6. <body>
  7. <div class="container">
  8. <header>
  9. <h1>Todo List</h1>
  10. <!-- add a form below the h1 -->
  11. <form class="new-task">
  12. <input type="text" name="text" placeholder="Type to add new tasks" />
  13. </form>
  14. </header>
  15. <ul>
  16. {{#each tasks}}
  17. {{> task}}
  18. {{/each}}
  19. </ul>
  20. </div>
  21. </body>
  22. <!-- Custom "task" template -->
  23. <template name="task">
  24. <li class="{{#if checked}}checked{{/if}}">
  25. <button class="delete">&times;</button>
  26. <input type="checkbox" checked="{{checked}}" class="toggle-checked" />
  27. <span class="text">{{text}}</span>
  28. </li>
  29. </template>