simple-todos.html 889 B

12345678910111213141516171819202122232425262728293031323334353637383940
  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 ({{incompleteCount}})</h1>
  10. <label class="hide-completed">
  11. <input type="checkbox" checked="{{hideCompleted}}" />
  12. Hide completed tasks
  13. </label>
  14. {{> loginButtons}}
  15. <!-- add a form below the h1 -->
  16. <form class="new-task">
  17. <input type="text" name="text" placeholder="Type to add new tasks" />
  18. </form>
  19. </header>
  20. <ul>
  21. {{#each tasks}}
  22. {{> task}}
  23. {{/each}}
  24. </ul>
  25. </div>
  26. </body>
  27. <!-- Custom "task" template -->
  28. <template name="task">
  29. <li class="{{#if checked}}checked{{/if}}">
  30. <button class="delete">&times;</button>
  31. <input type="checkbox" checked="{{checked}}" class="toggle-checked" />
  32. <span class="text">{{text}}</span>
  33. </li>
  34. </template>