Address findings from the templates code review: - Fix XSS in admin.html onclick handlers via data attributes - Fix XSS in 5 edit page signal initializations via JSON serialization - Fix register.html token exposure by moving to data attribute - Add entity_icon, quick_notes_toggles, add_form_submit macros - Replace hardcoded colors with design tokens (warning, error, success) - Add warning design tokens to CSS theme - Scope MutationObserver to main element - Add defer to webauthn.js script tags - Refactor login/register JS to arrow functions - Guard lightbox script behind image_url check - Fix else-if to elif in 5 templates
57 lines
2.3 KiB
HTML
57 lines
2.3 KiB
HTML
{# Quick note pill toggles with hidden form field.
|
|
Requires signals: _qn-good, _qn-too-fast, _qn-too-slow,
|
|
_qn-too-hot, _qn-under-extracted, _qn-over-extracted. #}
|
|
{% macro quick_notes_toggles() %}
|
|
<div>
|
|
<h4 class="text-sm font-semibold text-text mb-3">Quick Notes</h4>
|
|
<div class="flex flex-wrap gap-2">
|
|
<button
|
|
type="button"
|
|
data-on:click="$_qnGood = !$_qnGood"
|
|
data-attr:class="$_qnGood ? 'pill pill-success cursor-pointer select-none transition' : 'pill pill-muted cursor-pointer select-none transition'"
|
|
>
|
|
Good
|
|
</button>
|
|
<button
|
|
type="button"
|
|
data-on:click="$_qnTooFast = !$_qnTooFast"
|
|
data-attr:class="$_qnTooFast ? 'pill pill-warning cursor-pointer select-none transition' : 'pill pill-muted cursor-pointer select-none transition'"
|
|
>
|
|
Too Fast
|
|
</button>
|
|
<button
|
|
type="button"
|
|
data-on:click="$_qnTooSlow = !$_qnTooSlow"
|
|
data-attr:class="$_qnTooSlow ? 'pill pill-warning cursor-pointer select-none transition' : 'pill pill-muted cursor-pointer select-none transition'"
|
|
>
|
|
Too Slow
|
|
</button>
|
|
<button
|
|
type="button"
|
|
data-on:click="$_qnTooHot = !$_qnTooHot"
|
|
data-attr:class="$_qnTooHot ? 'pill pill-warning cursor-pointer select-none transition' : 'pill pill-muted cursor-pointer select-none transition'"
|
|
>
|
|
Too Hot
|
|
</button>
|
|
<button
|
|
type="button"
|
|
data-on:click="$_qnUnderExtracted = !$_qnUnderExtracted"
|
|
data-attr:class="$_qnUnderExtracted ? 'pill pill-warning cursor-pointer select-none transition' : 'pill pill-muted cursor-pointer select-none transition'"
|
|
>
|
|
Under Extracted
|
|
</button>
|
|
<button
|
|
type="button"
|
|
data-on:click="$_qnOverExtracted = !$_qnOverExtracted"
|
|
data-attr:class="$_qnOverExtracted ? 'pill pill-warning cursor-pointer select-none transition' : 'pill pill-muted cursor-pointer select-none transition'"
|
|
>
|
|
Over Extracted
|
|
</button>
|
|
</div>
|
|
<input
|
|
type="hidden"
|
|
name="quick_notes"
|
|
data-attr:value="[$_qnGood && 'good', $_qnTooFast && 'too-fast', $_qnTooSlow && 'too-slow', $_qnTooHot && 'too-hot', $_qnUnderExtracted && 'under-extracted', $_qnOverExtracted && 'over-extracted'].filter(Boolean).join(',')"
|
|
/>
|
|
</div>
|
|
{% endmacro %}
|