{{ $ctx := .ctx }}
{{ $NoViewTransition := (or .NoViewTransition false) }}
{{ $cover := printf "%s?width=300" $ctx.Params.cover }}

<div{{ if eq .Params.rating 1 }} class="opacity-50 z-0"{{ end }}
  {{ if not $NoViewTransition }}style="view-transition-name: book-{{ $ctx.File.UniqueID }}"{{ end }}>
  <a href="{{ $ctx.Permalink }}"
      {{ if not $NoViewTransition }}style="view-transition-name: book-{{ $ctx.Title }}"{{ end }}
      class="border-3 border-solid rotate-3 shadow-md block
      hover:rotate-0 hover:-translate-y-2 hover:scale-110 transition

      {{ if eq $ctx.Params.rating 1 }} relative
      {{ else if eq $ctx.Params.rating 5 }} border-amber-300 shadow-amber-200 shadow-xl
      {{ else }} border-white{{ end }}">
    <img class="lazy w-full block md:min-h-[120px] bg-neutral-500" src="{{ $cover }}" />
    {{ if eq $ctx.Params.rating 1 }}
    <div class="absolute z-1 top-[25%] left-[25%] h-[50%] w-[50%]"
        style="background-image: url('https://img.eltr.ac/uPic/2025/05/thumbs-down.png');
        background-size: 100%;
        background-position: center;
        background-repeat: no-repeat;"></div>
    {{ end }}
  </a>
</div>