{{ $t := debug.Timer "qr" }}
{{ $qr := partial "partials/_inline/qr" (dict
  "page" $
  "img_class" "w-10 bg-white view-transition-qr" )
}}
{{ $qrBig := partial "partials/_inline/qr" (dict "page" $ "img_class" "w-64 p-4") }}
{{ $t.Stop }}
<div
  class="hidden lg:block cursor-pointer outline-2 hover:outline-3 outline-blue-500 w-10 h-10">
  {{ partial "layouts/blocks/modal.html"  (dict "modal_button" $qr "modal_content" $qrBig "modal_title" (printf "QR code linking to %s" $.Permalink )) }}
</div>

{{ define "partials/_inline/qr" }}
  {{ $img_class := .img_class | default "w-10" }}
  {{ with images.QR $.page.Permalink (dict "targetDir" "images/qr") }}

    <img
      src="{{ .RelPermalink }}"
      width="{{ .Width }}"
      height="{{ .Height }}"
      @load="$event.target.classList.remove('_opacity-0')"
      alt="QR code linking to {{ $.page.Permalink }}"
      class="{{ $img_class }}" />
  {{ end }}
{{ end }}
