[fix] simple-theme templates: polish HTML <img> elements

- <img> [1] element does not have an end tag, no need for a leading `/>`
- add global attribute title[2] to result_templates/images.html (result-images-source)
- in jinja macro 'macro result_header' remove duplicate of class="image"
- in jinja macro 'macro result_header' remove alt attribute (fix [3])::

    alt="{{ result.title|striptags }}"

  the result.title is already shown in::

    <h3>{{ result_link(result.url, result.title|safe) }}</h3>

[1] https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img
[2] https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes#attr-title
[3] https://github.com/searxng/searxng/issues/523

Closes: https://github.com/searxng/searxng/issues/523
Signed-off-by: Markus Heiser <markus.heiser@darmarit.de>
This commit is contained in:
Markus Heiser 2021-11-25 12:04:39 +01:00
parent bd285de48a
commit 8fbffb1409
3 changed files with 10 additions and 10 deletions

View File

@ -1,6 +1,6 @@
<aside class="infobox"> <aside class="infobox">
<h2><bdi>{{ infobox.infobox }}</bdi></h2> <h2><bdi>{{ infobox.infobox }}</bdi></h2>
{% if infobox.img_src %}<img src="{{ image_proxify(infobox.img_src) }}" title="{{ infobox.infobox|striptags }}" alt="{{ infobox.infobox|striptags }}" />{% endif %} {% if infobox.img_src %}<img src="{{ image_proxify(infobox.img_src) }}" title="{{ infobox.infobox|striptags }}" alt="{{ infobox.infobox|striptags }}">{%- endif -%}
<p><bdi>{{ infobox.content | safe }}</bdi></p> <p><bdi>{{ infobox.content | safe }}</bdi></p>
{% if infobox.attributes %} {% if infobox.attributes %}
<div class="attributes"> <div class="attributes">
@ -8,7 +8,7 @@
<dl> <dl>
<dt><bdi>{{ attribute.label }} :</bdi></dt> <dt><bdi>{{ attribute.label }} :</bdi></dt>
{%- if attribute.image -%} {%- if attribute.image -%}
<dd><img src="{{ image_proxify(attribute.image.src) }}" alt="{{ attribute.image.alt }}" /></dd> <dd><img src="{{ image_proxify(attribute.image.src) }}" alt="{{ attribute.image.alt }}"></dd>
{%- else -%} {%- else -%}
<dd><bdi>{{ attribute.value }}</bdi></dd> <dd><bdi>{{ attribute.value }}</bdi></dd>
{%- endif -%} {%- endif -%}

View File

@ -1,6 +1,6 @@
<!-- Draw favicon --> <!-- Draw favicon -->
{% macro draw_favicon(favicon) -%} {% macro draw_favicon(favicon) -%}
<img width="14" height="14" class="favicon" src="{{ url_for('static', filename='themes/simple/img/icons/' + favicon + '.png') }}" alt="{{ favicon }}" /> <img width="14" height="14" class="favicon" src="{{ url_for('static', filename='themes/simple/img/icons/' + favicon + '.png') }}" alt="{{ favicon }}">
{%- endmacro %} {%- endmacro %}
{% macro result_open_link(url, classes='') -%} {% macro result_open_link(url, classes='') -%}
@ -23,8 +23,8 @@
<span class="url_o{{loop.index}}"><span class="url_i{{loop.index}}">{{- part -}}</span></span> <span class="url_o{{loop.index}}"><span class="url_i{{loop.index}}">{{- part -}}</span></span>
{%- endfor %} {%- endfor %}
{{- result_close_link() -}} {{- result_close_link() -}}
{%- if result.img_src %}{{ result_open_link(result.url) }}<img class="image" src="{{ image_proxify(result.img_src) }}" alt="{{ result.title|striptags }}" title="{{ result.title|striptags }}" class="image" />{{ result_close_link() }}{% endif -%} {%- if result.img_src %}{{ result_open_link(result.url) }}<img class="image" src="{{ image_proxify(result.img_src) }}" title="{{ result.title|striptags }}">{{ result_close_link() }}{% endif -%}
{%- if result.thumbnail %}{{ result_open_link(result.url) }}<img class="thumbnail" src="{{ image_proxify(result.thumbnail) }}" title="{{ result.title|striptags }}" alt="{{ result.title|striptags }}"/>{{ result_close_link() }}{% endif -%} {%- if result.thumbnail %}{{ result_open_link(result.url) }}<img class="thumbnail" src="{{ image_proxify(result.thumbnail) }}" title="{{ result.title|striptags }}">{{ result_close_link() }}{% endif -%}
<h3>{{ result_link(result.url, result.title|safe) }}</h3> <h3>{{ result_link(result.url, result.title|safe) }}</h3>
{%- endmacro -%} {%- endmacro -%}

View File

@ -1,6 +1,6 @@
<article class="result result-images {% if result['category'] %}category-{{ result['category'] }}{% endif %}">{{- "" -}} <article class="result result-images {% if result['category'] %}category-{{ result['category'] }}{% endif %}">{{- "" -}}
<a {% if results_on_new_tab %}target="_blank" rel="noopener noreferrer"{% else %}rel="noreferrer"{% endif %} href="{{ result.img_src }}">{{- "" -}} <a {% if results_on_new_tab %}target="_blank" rel="noopener noreferrer"{% else %}rel="noreferrer"{% endif %} href="{{ result.img_src }}">{{- "" -}}
<img class="image_thumbnail" {% if results_on_new_tab %}target="_blank" rel="noopener noreferrer"{% else %}rel="noreferrer"{% endif %} src="{% if result.thumbnail_src %}{{ image_proxify(result.thumbnail_src) }}{% else %}{{ image_proxify(result.img_src) }}{% endif %}" loading="lazy" title="{{ result.title|striptags }}" alt="{{ result.title|striptags }}"/>{{- "" -}} <img class="image_thumbnail" {% if results_on_new_tab %}target="_blank" rel="noopener noreferrer"{% else %}rel="noreferrer"{% endif %} src="{% if result.thumbnail_src %}{{ image_proxify(result.thumbnail_src) }}{% else %}{{ image_proxify(result.img_src) }}{% endif %}" loading="lazy" title="{{ result.title|striptags }}" alt="{{ result.title|striptags }}">{{- "" -}}
<span class="title">{{ result.title|striptags }}</span>{{- "" -}} <span class="title">{{ result.title|striptags }}</span>{{- "" -}}
</a>{{- "" -}} </a>{{- "" -}}
<div class="detail">{{- "" -}} <div class="detail">{{- "" -}}
@ -9,9 +9,9 @@
<a class="result-detail-next" href="#">{{ icon('chevron-right') }}</a>{{- "" -}} <a class="result-detail-next" href="#">{{ icon('chevron-right') }}</a>{{- "" -}}
<a class="result-images-source" {% if results_on_new_tab %}target="_blank" rel="noopener noreferrer"{% else %}rel="noreferrer"{% endif %} href="{{ result.img_src }}"> <a class="result-images-source" {% if results_on_new_tab %}target="_blank" rel="noopener noreferrer"{% else %}rel="noreferrer"{% endif %} href="{{ result.img_src }}">
{%- if result.thumbnail_src -%} {%- if result.thumbnail_src -%}
<img src="" data-src="{{ image_proxify(result.img_src) }}" alt="{{ result.title|striptags }}"> <img src="" data-src="{{ image_proxify(result.img_src) }}" alt="{{ result.title|striptags }}" title="{{ result.title|striptags }}">
{%- else -%} {%- else -%}
<img src="{{ image_proxify(result.img_src) }}" alt="{{ result.title|striptags }}" loading="lazy"> <img src="{{ image_proxify(result.img_src) }}" alt="{{ result.title|striptags }}" loading="lazy" title="{{ result.title|striptags }}">
{%- endif -%} {%- endif -%}
</a>{{- "" -}} </a>{{- "" -}}
<div class="result-images-labels">{{- "" -}} <div class="result-images-labels">{{- "" -}}