yagich/porom
Archived
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add previews to babycode editor component

Browse Source
This commit is contained in:
Lera Elvoé
2025-06-01 02:35:55 +03:00
parent 8a00500387
commit 615cd36eab
6 changed files with 177 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
views/base.etlua
View File

@ -18,5 +18,6 @@
</footer>
<script src="/static/js/copy-code.js"></script>
<script src="/static/js/date-fmt.js"></script>
<script src="/static/js/tabs.js"></script>
</body>
</html>

28
views/common/babycode-editor-component.etlua
View File

@ -1,8 +1,20 @@
<span>
<button type=button id="post-editor-bold" title="Insert Bold">B</button>
<button type=button id="post-editor-italics" title="Insert Italics">I</button>
<button type=button id="post-editor-strike" title="Insert Strikethrough">S</button>
<button type=button id="post-editor-code" title="Insert Code block">Code</button>
</span>
<textarea class="babycode-editor" name="<%= ta_name %>" id="babycode-content" placeholder="<%= ta_placeholder or "Post body"%>" <%= not optional and "required" or "" %>><%- prefill or "" %></textarea>
<script src="/static/js/babycode-editor.js"></script>
<div class="babycode-editor-container">
<div class="tab-buttons">
<button type=button class="tab-button active" data-target-id="tab-edit">Write</button>
<button type=button class="tab-button" data-target-id="tab-preview">Preview</button>
</div>
<div class="tab-content active" id="tab-edit">
<span>
<button type=button id="post-editor-bold" title="Insert Bold">B</button>
<button type=button id="post-editor-italics" title="Insert Italics">I</button>
<button type=button id="post-editor-strike" title="Insert Strikethrough">S</button>
<button type=button id="post-editor-code" title="Insert Code block">Code</button>
</span>
<textarea class="babycode-editor" name="<%= ta_name %>" id="babycode-content" placeholder="<%= ta_placeholder or "Post body"%>" <%= not optional and "required" or "" %>><%- prefill or "" %></textarea>
</div>
<div class="tab-content" id="tab-preview">
<div id="babycode-preview-errors-container">Type something!</div>
<div id="babycode-preview-container"></div>
</div>
</div>
<script src="/static/js/babycode-editor.js?v=1"></script>