{{ define "main" }}
    <article id="book-page">
        <div class="book-page-header">
            <div class="book-cover"
                style="view-transition-name: book-{{ .File.UniqueID }}">
                <img
                    class="lazy"
                    src="{{ .Params.cover }}!thumbnail"
                    data-src="{{ .Params.cover }}"
                />
            </div>
            <h1 class="book-title">{{ .Title }}</h1>
            {{- $rating := .Params.rating -}}
            {{- $fullStars := math.Floor $rating -}}
            <p class="book-author">
                {{ .Params.author }}
            </p>
            <p class="book-rating">
                {{- range seq $fullStars }}
                <span class="star">⭐</span>
                {{- end -}}
            </p>
            <!-- 导航作用的骷髅头图标 -->
            <div>
                <a href="{{ .Site.LanguagePrefix }}/library"
                    class="title-image-container">
                    <img src="/header.png" alt="Logo"
                        class="invert-if-dark title-image"
                        style="view-transition-name: title-image"
                    />
                </a>
            </div>
        </div>
        <div class="markdown-body book-body">
            <div class="book-content">
                {{ .Content }}
            </div>
            <div class="book-footer">
                <p>于 {{ .Date.Format "2006-01-02" }} 读完</p>
            </div>
        </div>
        {{ partial "components/comment.html" . }}
    </article>
{{ end }}