mention-asynchronous.html 841 B

1234567891011121314151617181920212223242526272829303132
  1. <head>
  2. <meta http-equiv="Content-Security-Policy" content="default-src 'none'; connect-src 'self' http://localhost:3000 https://cksource.com http://*.cke-cs.com; script-src 'self' https://cksource.com; img-src * data:; style-src 'self' 'unsafe-inline'; frame-src *" />
  3. </head>
  4. <div id="editor">
  5. <p>Hello <span class="mention" data-mention="@Ted">@Ted</span>.</p>
  6. <p>Hello <span class="mention" data-mention="@Ted">@Ted</span><span class="mention" data-mention="@Ted">@Ted</span>.</p>
  7. <figure class="image">
  8. <img src="sample.jpg" />
  9. <figcaption>CKEditor logo - caption</figcaption>
  10. </figure>
  11. </div>
  12. <style>
  13. .custom-item {
  14. display: block;
  15. padding: 1em;
  16. }
  17. .custom-item.ck-on {
  18. color: white;
  19. }
  20. .custom-item .custom-item-username {
  21. color: #666;
  22. }
  23. .custom-item.ck-on .custom-item-username{
  24. color: #ddd;
  25. }
  26. </style>