ethiele/linkvault
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add a collapsible Markdown cheat sheet to the prompt input

Browse Source 
A short, native <details>/<summary> reference (no JS) next to the
hint text, listing the basic syntax the new markdown rendering
supports: headings, bold/italic, lists, quotes, inline code, code
blocks, links.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
Erik Thiele
2026-07-30 14:55:59 +02:00
parent 78c95b522d
commit 11eb770c8b
2 changed files with 31 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
app/templates/base.html
View File

@@ -195,6 +195,22 @@
.field label { display: block; font-size: .85rem; color: var(--muted); margin-bottom: 5px; } .field label { display: block; font-size: .85rem; color: var(--muted); margin-bottom: 5px; }
.error { background: #7f1d1d; color: #fecaca; padding: 10px 12px; border-radius: 8px; margin-bottom: 14px; font-size: .9rem; } .error { background: #7f1d1d; color: #fecaca; padding: 10px 12px; border-radius: 8px; margin-bottom: 14px; font-size: .9rem; }
.muted { color: var(--muted); } .muted { color: var(--muted); }
.md-help { margin-top: 6px; }
.md-help summary {
cursor: pointer; display: inline-flex; align-items: center; gap: 5px;
color: var(--accent-hover); font-size: .8rem; user-select: none;
}
.md-help summary::-webkit-details-marker { display: none; }
.md-help table {
margin-top: 8px; border-collapse: collapse; font-size: .8rem;
}
.md-help td {
padding: 3px 12px 3px 0; vertical-align: top; color: var(--muted);
}
.md-help td:first-child { white-space: nowrap; }
.md-help code {
background: var(--panel2); padding: 1px 5px; border-radius: 4px; color: var(--text);
}
.htmx-indicator { opacity: 0; transition: opacity .2s; } .htmx-indicator { opacity: 0; transition: opacity .2s; }
.htmx-request .htmx-indicator { opacity: 1; } .htmx-request .htmx-indicator { opacity: 1; }
.htmx-request.htmx-indicator { opacity: 1; } .htmx-request.htmx-indicator { opacity: 1; }

15
app/templates/prompts.html
View File

@@ -40,6 +40,21 @@
</div> </div>
<div class="muted" style="font-size:.8rem; margin-top:6px;"> <div class="muted" style="font-size:.8rem; margin-top:6px;">
Der Prompt wird automatisch kategorisiert und mit Tags versehen. Der Prompt wird automatisch kategorisiert und mit Tags versehen.
Der Text unterstützt Markdown.
<details class="md-help">
<summary>{{ icons.sparkles(size=12) }} Markdown-Hilfe</summary>
<table>
<tr><td><code># Text</code></td><td>Überschrift</td></tr>
<tr><td><code>**Text**</code></td><td><strong>fett</strong></td></tr>
<tr><td><code>*Text*</code></td><td><em>kursiv</em></td></tr>
<tr><td><code>- Text</code></td><td>Aufzählung</td></tr>
<tr><td><code>1. Text</code></td><td>nummerierte Liste</td></tr>
<tr><td><code>&gt; Text</code></td><td>Zitat</td></tr>
<tr><td><code>`Text`</code></td><td><code>Inline-Code</code></td></tr>
<tr><td><code>```</code></td><td>Codeblock (davor &amp; danach)</td></tr>
<tr><td><code>[Text](url)</code></td><td>Link</td></tr>
</table>
</details>
</div> </div>
</form> </form>
</div> </div>