Brummel
181e9639ed
The image macro was resizing every call to its width arg, including upscaling 270x180 service thumbnails to 600x400 and rendering 400x400 doctor portraits at full size. Live serves service thumbs at native 270x180 (CSS-floated) and doctor portraits at 200x200. - image macro: width=0 (default) skips resize, emits raw <img> with no width/height — lets theme CSS do the sizing, matching live pattern - img shortcode: defaults width to 0 so callers can omit it - service grid (home + 7 service pages): drop width=600 - doctor portraits on /team: width=200 (matches live render)
33 lines
1.2 KiB
HTML
33 lines
1.2 KiB
HTML
{# Image-rendering macro, used both by templates (directly via import)
|
|
and indirectly by the `img` shortcode (which forwards to it).
|
|
|
|
With `width > 0`: resizes via Zola's image pipeline and emits explicit
|
|
width/height attributes (good for large hero/preview images).
|
|
|
|
With `width = 0` (default): emits a raw <img> served from /static/images/
|
|
with no width/height attributes — lets the theme CSS size the image, which
|
|
matches the live Grav site's pattern. Use this for content thumbnails that
|
|
the theme styles responsively. #}
|
|
|
|
{% macro render(src, width=0, alt="", class="") %}
|
|
{%- set width = width | int -%}
|
|
{%- if width > 0 -%}
|
|
{%- set resized = resize_image(path="static/images/" ~ src, width=width, op="fit_width", quality=85) -%}
|
|
<img
|
|
src="{{ resized.url | safe }}"
|
|
width="{{ resized.width }}"
|
|
height="{{ resized.height }}"
|
|
alt="{{ alt }}"
|
|
{%- if class %} class="{{ class }}"{% endif %}
|
|
loading="lazy"
|
|
>
|
|
{%- else -%}
|
|
<img
|
|
src="/images/{{ src | safe }}"
|
|
alt="{{ alt }}"
|
|
{%- if class %} class="{{ class }}"{% endif %}
|
|
loading="lazy"
|
|
>
|
|
{%- endif -%}
|
|
{% endmacro render %}
|