todo-list.html 1.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546
  1. <h2>Editor</h2>
  2. <div id="editor">
  3. <p>This is a test for list feature.</p>
  4. <p>Some more text for testing.</p>
  5. <ul>
  6. <li><input type="checkbox">To-do list item 1</li>
  7. <li><input type="checkbox" checked="checked">To-do list item 2</li>
  8. <li><input type="checkbox">To-do list item 3</li>
  9. <li><input type="checkbox" checked="checked">To-do list item 4</li>
  10. <li><input type="checkbox">To-do list item 5</li>
  11. <li>
  12. <input type="checkbox">To-do list item 6
  13. <ul class="todo-list">
  14. <li>
  15. <label class="todo-list__label">
  16. <input type="checkbox" disabled="disabled" checked="checked">
  17. Nested item
  18. </label>
  19. </li>
  20. </ul>
  21. </li>
  22. <li><input type="checkbox" checked="checked">To-do list item 7</li>
  23. <li><input type="checkbox">To-do list item 8</li>
  24. </ul>
  25. <p>Paragraph.</p>
  26. <p>Another testing paragraph.</p>
  27. <ol>
  28. <li>Numbered list item</li>
  29. </ol>
  30. <ul>
  31. <li><input type="checkbox">To-do list item</li>
  32. </ul>
  33. <ul>
  34. <li>Bullet list</li>
  35. </ul>
  36. </div>
  37. <h2>Editor content preview</h2>
  38. <div id="preview" class="ck-content"></div>
  39. <style>
  40. #preview {
  41. outline: 1px solid red;
  42. padding: 10px;
  43. }
  44. </style>