thumbnail on hover

This commit is contained in:
Flummi 2021-05-16 15:40:57 +02:00
parent 04d4787232
commit c416a6bca5
2 changed files with 13 additions and 2 deletions

View File

@ -1013,3 +1013,14 @@ div.about > div p {
font-size: 7pt; font-size: 7pt;
margin-top: 0; margin-top: 0;
} }
a.id-link:hover:after {
content: "";
background-image: var(--hover-image);
border: 1px solid var(--accent);
height: 128px;
width: 128px;
display: inline-block;
position: absolute;
margin-left: 5px;
}

View File

@ -46,7 +46,7 @@
</div> </div>
</div> </div>
<div class="metadata"> <div class="metadata">
<span class="badge badge-dark"><a href="/{{=item.id}}" class="id-link">{{=item.id}}</a></span> <span class="badge badge-dark"><a href="/{{=item.id}}" style="--hover-image: url('/t/{{=item.id}}.png');" class="id-link">{{=item.id}}</a></span>
<span class="badge badge-dark">{{=user.network}} / {{=user.channel}}</span> <span class="badge badge-dark">{{=user.network}} / {{=user.channel}}</span>
<span class="badge badge-dark image-source"><a class="post_source" title="{{=item.src.long}}" href="{{=item.src.long}}" target="_blank">{{=item.src.short}}</a></span> <span class="badge badge-dark image-source"><a class="post_source" title="{{=item.src.long}}" href="{{=item.src.long}}" target="_blank">{{=item.src.short}}</a></span>
<span class="badge badge-dark"><a class="dest-link" href="{{=item.dest}}" target="_blank">{{=item.mime}}</a> / {{=item.size}}</span> <span class="badge badge-dark"><a class="dest-link" href="{{=item.dest}}" target="_blank">{{=item.mime}}</a> / {{=item.size}}</span>