Yu-Gi-Oh! Deck Building and Card Inventory Management web interface written in Common Lisp, utilizing HTMX.
Du kannst nicht mehr als 25 Themen auswählen Themen müssen entweder mit einem Buchstaben oder einer Ziffer beginnen. Sie können Bindestriche („-“) enthalten und bis zu 35 Zeichen lang sein.

70 Zeilen
2.9KB

  1. {% extends "layouts/default.html" %}
  2. {% block title %}TinyMCE{% endblock %}
  3. {% block content %}
  4. <div class="container">
  5. <form id="tinymce-form" name="tinymce-form" method="post" action="/tinymce">
  6. <input type="hidden" name="mode" value="create">
  7. {{ token | safe }}
  8. <div class="columns">
  9. <div class="column is-half">
  10. <h1 class="title">TinyMCE</h1>
  11. </div>
  12. <div class="column is-half">
  13. <div class="field is-horizontal">
  14. <div class="field-label">
  15. <label for="filename" class="label">File Name</label>
  16. </div>
  17. <div class="field-body">
  18. <div class="field is-grouped">
  19. <div class="control is-expanded">
  20. <input class="input" id="filename" name="filename" type="text" value="{% if file.name %}{{ file.name }}{% endif %}" required>
  21. </div>
  22. <div class="control">
  23. <button class="button is-primary" type="submit">Process</button>
  24. </div>
  25. </div>
  26. </div>
  27. </div>
  28. </div>
  29. </div>
  30. <div class="field">
  31. <div class="field">
  32. <div class="control">
  33. <textarea class="textarea" id="default" name="default">{{ file.body | default:"Next, use our Get Started docs to setup Tiny!" }}</textarea>
  34. </div>
  35. </div>
  36. </div>
  37. </form>
  38. </div>
  39. <script id="script" src="/js/tinymce/tinymce.min.js" referrerpolicy="origin"></script>
  40. <script>
  41. var tinymce_init = (() => {
  42. var only_once = false;
  43. return function () {
  44. if (!only_once) {
  45. only_once = true;
  46. setTimeout(tinymce.init({
  47. selector: 'textarea#default',
  48. auto_focus: 'default',
  49. highlight_on_focus: true,
  50. skin: 'oxide-dark',
  51. content_css: 'dark',
  52. min_height: 500,
  53. plugins: 'accordion lists advlist anchor autolink autoresize autosave charmap code codesample directionality emoticons fullscreen help image insertdatetime link media nonbreaking pagebreak preview quickbars save searchreplace table template visualblocks visualchars wordcount',
  54. toolbar1: 'bold italic underline strikethrough | alignleft aligncenter alignright alignjustify alignnone | styles | emoticons',
  55. toolbar2: 'cut copy paste pastetext | bullist numlist | outdent indent | redo undo blockquote | link unlink openlink anchor image',
  56. toolbar3: 'table | hr removeformat visualblocks | subscript superscript | charmap media insertdatetime | visualchars nonbreaking pagebreak fullscreen | searchreplace | help code',
  57. promotion: false,
  58. }), 1000);
  59. }
  60. }
  61. })();
  62. ['DOMContentLoaded', 'htmx:afterRequest'].forEach(function(_) {
  63. tinymce_init();
  64. });
  65. htmx.onLoad(function (_) {
  66. tinymce_init();
  67. });
  68. </script>
  69. {% endblock %}