dca6033c40
Emoji (📚 🔖 🏷️ ✎ ✕ 🕓 ⏳ 🤖 ⚠️ 🔍) rendered in each platform's own colorful style and looked inconsistent. Add app/templates/_icons.html with small inline SVG macros (Lucide-style, MIT-licensed path data, stroke=currentColor) and use them throughout instead, so icons pick up the muted/accent text colors like the rest of the UI. The needs-review bookmark toggle now uses an outline vs. filled icon for its two states instead of swapping emoji. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
52 lines
2.3 KiB
HTML
52 lines
2.3 KiB
HTML
{#
|
||
Gemeinsame Icons (angelehnt an Lucide, MIT-lizenziert), inline als SVG.
|
||
Monochrom über currentColor – Farbe wird vom umgebenden Element gesetzt.
|
||
Verwendung: {% import "_icons.html" as icons %} ... {{ icons.edit() }}
|
||
#}
|
||
|
||
{% macro base(path, size=16) -%}
|
||
<svg xmlns="http://www.w3.org/2000/svg" width="{{ size }}" height="{{ size }}" viewBox="0 0 24 24"
|
||
fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
|
||
class="icon" aria-hidden="true">{{ path | safe }}</svg>
|
||
{%- endmacro %}
|
||
|
||
{% macro grid(size=16) -%}
|
||
{{ base('<rect width="7" height="7" x="3" y="3" rx="1"/><rect width="7" height="7" x="14" y="3" rx="1"/><rect width="7" height="7" x="14" y="14" rx="1"/><rect width="7" height="7" x="3" y="14" rx="1"/>', size) }}
|
||
{%- endmacro %}
|
||
|
||
{% macro bookmark(filled=False, size=16) -%}
|
||
{{ base('<path d="m19 21-7-4-7 4V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z"' + (' fill="currentColor"' if filled else '') + '/>', size) }}
|
||
{%- endmacro %}
|
||
|
||
{% macro edit(size=16) -%}
|
||
{{ base('<path d="M17 3a2.85 2.83 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5Z"/><path d="m15 5 4 4"/>', size) }}
|
||
{%- endmacro %}
|
||
|
||
{% macro trash(size=16) -%}
|
||
{{ base('<path d="M3 6h18"/><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"/><path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/><line x1="10" x2="10" y1="11" y2="17"/><line x1="14" x2="14" y1="11" y2="17"/>', size) }}
|
||
{%- endmacro %}
|
||
|
||
{% macro search(size=16) -%}
|
||
{{ base('<circle cx="11" cy="11" r="8"/><path d="m21 21-4.3-4.3"/>', size) }}
|
||
{%- endmacro %}
|
||
|
||
{% macro plus(size=16) -%}
|
||
{{ base('<path d="M5 12h14"/><path d="M12 5v14"/>', size) }}
|
||
{%- endmacro %}
|
||
|
||
{% macro alert(size=16) -%}
|
||
{{ base('<path d="m21.73 18-8-14a2 2 0 0 0-3.46 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3Z"/><path d="M12 9v4"/><path d="M12 17h.01"/>', size) }}
|
||
{%- endmacro %}
|
||
|
||
{% macro sparkles(size=16) -%}
|
||
{{ base('<path d="M9.937 15.5A2 2 0 0 0 8.5 14.063l-6.135-1.582a.5.5 0 0 1 0-.962L8.5 9.936A2 2 0 0 0 9.937 8.5l1.582-6.135a.5.5 0 0 1 .963 0L14.063 8.5A2 2 0 0 0 15.5 9.937l6.135 1.581a.5.5 0 0 1 0 .964L15.5 14.063a2 2 0 0 0-1.437 1.437l-1.582 6.135a.5.5 0 0 1-.963 0z"/>', size) }}
|
||
{%- endmacro %}
|
||
|
||
{% macro clock(size=16) -%}
|
||
{{ base('<circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/>', size) }}
|
||
{%- endmacro %}
|
||
|
||
{% macro spinner(size=16) -%}
|
||
{{ base('<path d="M21 12a9 9 0 1 1-6.219-8.56"/>', size) }}
|
||
{%- endmacro %}
|