oliverdavies.uk/source/_includes/testimonials.html.twig

{% set limit = limit ?? 10 %}
{% set offset = offset ?? 0 %}

{% set testimonials = site.testimonials %}

{% if tag is not null %}
  {% set testimonials = testimonials|filter(testimonial => tag in testimonial.tags) %}
{% endif %}

{% if limit > 0 %}
  {% set testimonials = testimonials|slice(offset, limit) %}
{% endif %}

<section>
  <h2 class="text-xl font-bold">{{ title|default('Testimonials') }}</h2>

  <div class="mt-4 space-y-12">
    {% for testimonial in testimonials %}
      <div>
        <div class="italic prose prose-p:text-black prose-a:font-light prose-a:text-blue-primary prose-p:text-lg prose-blockquote:border-blue-primary dark:marker:text-white prose-li:my-1 prose-li:text-lg prose-figcaption:text-white prose-li:text-black marker:text-black dark:prose-p:text-white dark:prose-invert dark:prose-a:text-blue-400 dark:prose-blockquote:border-blue-400 dark:prose-li:text-white hover:prose-a:no-underline prose-h2:text-xl prose-code:font-normal prose-h2:mb-4 prose-ul:my-3 dark:prose-hr:border-grey-400 prose-code:before:content-[''] prose-code:after:content-['']">
        <blockquote>
            {{ testimonial.text|markdown }}
          </blockquote>

          <div class="not-prose">
            <footer class="mt-8 flex items-center space-x-4 space-x-reverse">
              <span class="text-base">
                {% if testimonial.url %}
                  <a href="{{ testimonial.url }}">
                    {{ testimonial.name }}
                    {% if testimonial.title %}
                      - {{ testimonial.title }}
                    {% endif %}
                  </a>
                {% else %}
                  {{ testimonial.name }}
                  {% if testimonial.title %}
                    - {{ testimonial.title }}
                  {% endif %}
                {% endif %}
              </span>

              {% if testimonial.image %}
                <span class="order-first flex-shrink-0">
                  <img class="size-16 rounded-full ring-2 ring-grey-500 dark:ring-white" alt="Photo of {{ testimonial.name }}" src="{{ testimonial.image.url }}" />
                </span>
              {% endif %}
            </footer>
          </div>
        </div>
      </div>
    {% endfor %}
  </div>
</section>