Feature: added page count for artwork preview

This commit is contained in:
VnPower 2023-05-19 12:43:33 +07:00
parent c516d7c7be
commit 6f782d83a3
Signed by: vnpower
GPG key ID: 881DE3DEB966106C
4 changed files with 50 additions and 0 deletions

View file

@ -32,6 +32,9 @@
<div class="thumbnail-container">
{{ range $parent.Recent }}
<div class="artwork-thumbnail-small artwork-thumbnail">
{{ if gt .Pages 1 }}
<div class="artwork-page-count"><span>&boxbox; {{ .Pages }}</span></div>
{{ end }}
<a href="/artworks/{{ .ID }}">
<img src="{{ .Thumbnail }}" alt="{{ .Thumbnail }}" class="artwork-master-image" />
</a>

View file

@ -52,6 +52,27 @@ body {
padding: 1rem;
background-color: #262a2b;
}
.artwork-thumbnail .artwork-page-count {
display: flex;
align-items: center;
justify-content: center;
position: absolute;
top: 0.6rem;
right: 0.6rem;
border-radius: 20px;
padding: 0.3rem;
background-color: #262a2b;
opacity: 60%;
}
.artwork-thumbnail .artwork-page-count span {
display: flex;
font-size: 0.7rem;
font-weight: bold;
align-items: center;
justify-content: center;
width: max-content;
height: 0.5rem;
}
.artwork-thumbnail .artwork-thumbnail-title {
margin: 0.4rem;
max-width: 100%;

View file

@ -63,6 +63,29 @@ body {
background-color: $bg-alt;
}
.artwork-page-count {
display: flex;
align-items: center;
justify-content: center;
position: absolute;
top: 0.6rem;
right: 0.6rem;
border-radius: 20px;
padding: 0.3rem;
background-color: $bg-alt;
opacity: 60%;
span {
display: flex;
font-size: 0.7rem;
font-weight: bold;
align-items: center;
justify-content: center;
width: max-content;
height: 0.5rem;
}
}
.artwork-thumbnail-title {
margin: 0.4rem;
max-width: 100%;

View file

@ -1,5 +1,8 @@
{{ range . }}
<div class="artwork-thumbnail-small artwork-thumbnail">
{{ if gt .Pages 1 }}
<div class="artwork-page-count"><span>&boxbox; {{ .Pages }}</span></div>
{{ end }}
<a href="/artworks/{{ .ID }}">
<img
data-src="{{ .Thumbnail }}"