{{ $ctx := .ctx }}
{{ $NoViewTransition := (or .NoViewTransition false) }}
<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" src="{{ $ctx.Params.cover }}!small" />
    {{ if eq $ctx.Params.rating 1 }}
    <div class="absolute z-1 top-[25%] left-[25%] h-[50%] w-[50%]"
        style="background-image: url('https://image.guhub.cn/uPic/2025/05/thumbs-down.png');
        background-size: 100%;
        background-position: center;
        background-repeat: no-repeat;"></div>
    {{ end }}
  </a>
</div>