OwlBurst/Ponysearch
1
0
Fork 0
forked from Ponysearch/Ponysearch
Code Pull requests Activity

[feat] images: show resolution inside the image and fix image details overflow

Browse source 
Co-authored-by: Markus Heiser <markus.heiser@darmarit.de>
This commit is contained in:
Bnyro 2024-02-21 19:05:54 +01:00 committed by Markus Heiser
parent e76ab1a4b3
commit db1f9b31c9
3 changed files with 18 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
searx/static/themes/simple/src/less/detail.less
View file

@ -67,7 +67,10 @@ article.result-images .detail {
p { p {
color: var(--color-result-detail-label-font); color: var(--color-result-detail-label-font);
font-size: 0.9rem; font-size: 0.9rem;
line-height: 0.9rem; white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
margin: 0.8rem 0;
span { span {
display: inline-block; display: inline-block;

11
searx/static/themes/simple/src/less/style.less
View file

@ -464,6 +464,17 @@ article[data-vim-selected].category-social {
background: var(--color-result-image-background); background: var(--color-result-image-background);
} }
.image_resolution {
position: absolute;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 50%);
padding: 0.3rem 0.5rem;
font-size: 0.9rem;
color: #fff;
border-top-left-radius: 0.3rem;
}
span.title, span.title,
span.source { span.source {
display: block; display: block;

8
searx/templates/simple/result_templates/images.html
View file

@ -1,11 +1,9 @@
<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 %}" alt="{{ result.title|striptags }}" loading="lazy" width="200" height="200">{{- "" -}} <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 %}" alt="{{ result.title|striptags }}" loading="lazy" width="200" height="200">{{- "" -}}
<span class="title">{{ result.title|striptags }}</span>{{- "" -}} {%- if result.resolution %} <span class="image_resolution">{{ result.resolution }}</span> {%- endif -%}
<span class="source"> <span class="title">{{ result.title|striptags }}</span>{{- "" -}}
{{- result.parsed_url.netloc -}} <span class="source">{{- result.parsed_url.netloc -}}</span>{{- "" -}}
{%- if result.resolution %} - {{ result.resolution }}{%- endif -%}
</span>{{- "" -}}
</a>{{- "" -}} </a>{{- "" -}}
<div class="detail">{{- "" -}} <div class="detail">{{- "" -}}
<a class="result-detail-close" href="#">{{ icon('close') }}</a>{{- "" -}} <a class="result-detail-close" href="#">{{ icon('close') }}</a>{{- "" -}}