Skip to content
Open
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
19 changes: 10 additions & 9 deletions wiki/templates/wiki/includes/feedback_widget.html
Original file line number Diff line number Diff line change
Expand Up @@ -5,11 +5,10 @@

<!-- Reaction Buttons (pill-shaped toggle group) -->
{% set reactions = [
{"type": "Good", "mouth": '<path d="M8 14s1.5 2 4 2 4-2 4-2"/>'},
{"type": "Ok", "mouth": '<line x1="8" y1="15" x2="16" y2="15"/>'},
{"type": "Bad", "mouth": '<path d="M16 16s-1.5-2-4-2-4 2-4 2"/>'}
{"type": "Bad", "icon": '<path d="M9 18.12 10 14H4.17a2 2 0 0 1-1.92-2.56l2.33-8A2 2 0 0 1 6.5 2H20a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2h-2.76a2 2 0 0 0-1.79 1.11L12 22h0a3.13 3.13 0 0 1-3-3.88Z"/>', "transform": "translate(0, 2)", "viewBox": "0 1 24 24"},
{"type": "Good", "icon": '<path d="M15 5.88 14 10h5.83a2 2 0 0 1 1.92 2.56l-2.33 8A2 2 0 0 1 17.5 22H4a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2h2.76a2 2 0 0 0 1.79-1.11L12 2h0a3.13 3.13 0 0 1 3 3.88Z"/>', "transform": "translate(0, -2)", "viewBox": "0 -1 24 24"}
] %}
<fieldset class="inline-flex rounded-full bg-[var(--surface-gray-2)] p-0.5" role="radiogroup" aria-label="Feedback rating">
<fieldset class="inline-flex items-center rounded-full bg-[var(--surface-gray-2)] p-0.5 gap-0.5" role="radiogroup" aria-label="Feedback rating">
{% for reaction in reactions %}
<button type="button"
@click="selectFeedback('{{ reaction.type }}')"
Expand All @@ -19,13 +18,15 @@
role="radio"
:aria-checked="feedbackType === '{{ reaction.type }}'"
aria-label="{{ reaction.type }}">
<svg class="w-4 h-4" :class="feedbackType === '{{ reaction.type }}' ? 'text-[var(--ink-gray-9)]' : 'text-[var(--ink-gray-5)]'" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<circle cx="12" cy="12" r="10"/>
{{ reaction.mouth | safe }}
<line x1="9" y1="9" x2="9.01" y2="9"/>
<line x1="15" y1="9" x2="15.01" y2="9"/>
<svg class="w-4 h-4" :class="feedbackType === '{{ reaction.type }}' ? 'text-[var(--ink-gray-9)]' : 'text-[var(--ink-gray-5)]'" viewBox="{{ reaction.viewBox }}" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<g transform="{{ reaction.transform }}">
{{ reaction.icon | safe }}
</g>
</svg>
</button>
{% if not loop.last %}
<div class="h-5 w-px bg-[var(--outline-gray-2)]"></div>
{% endif %}
{% endfor %}
</fieldset>
</div>
Expand Down
Loading