shylie/serra
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Lazy load images

Browse Source
This commit is contained in:
Florian Baumann 2023-02-27 15:20:39 +01:00
parent 48086358d2
commit 04d5f20b46
1 changed files with 29 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

55
templates/index.tmpl
View File

@ -8,27 +8,29 @@
<!-- <link rel="stylesheet" href="https://unpkg.com/bulma-dracula"> --> <!-- <link rel="stylesheet" href="https://unpkg.com/bulma-dracula"> -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.4/css/bulma.min.css"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.4/css/bulma.min.css">
<style> <style>
.cardpreview { .cardpreview {
position: relative; position: relative;
display: inline-block; display: inline-block;
border-bottom: 1px dotted black; border-bottom: 1px dotted black;
} }
.cardpreview .cardpreviewtext { .cardpreview .cardpreviewtext {
visibility: hidden; visibility: hidden;
width: 300px; display: none;
color: #fff; width: 300px;
color: #fff;
/* Position the cardpreview */ /* Position the cardpreview */
position: absolute; position: absolute;
z-index: 1; z-index: 1;
} }
.cardpreview:hover .cardpreviewtext { .cardpreview:hover .cardpreviewtext {
visibility: visible; visibility: visible;
} display: inline-block;
</style> }
</style>
</head> </head>
@ -64,7 +66,8 @@
<select name="set" id="set" form="searchform"> <select name="set" id="set" form="searchform">
<option value="">-</option> <option value="">-</option>
{{range .sets}} {{range .sets}}
<option value="{{ index . "code" }}">{{ printf "%.25s" (index . "_id") }} ({{ index . "count" }})</option> <option value="{{ index . "code" }}">{{ printf "%.25s" (index . "_id") }} ({{ index . "count" }})
</option>
{{end}} {{end}}
</select> </select>
</div> </div>
@ -141,12 +144,12 @@
<tr> <tr>
<td>{{.SerraCount}}</td> <td>{{.SerraCount}}</td>
<td> <td>
<div class="cardpreview"><strong>{{.Name }}</strong> <div class="cardpreview"><strong>{{.Name }}</strong>
<span class="cardpreviewtext"> <span class="cardpreviewtext">
<img src="{{ .ImageUris.Normal }}" alt="" /> <img loading="lazy" src="{{ .ImageUris.Normal }}" alt="" />
</span> </span>
</div> </div>
</td> </td>
<td>{{.TypeLine}}</td> <td>{{.TypeLine}}</td>
<td>{{.Set}}</td> <td>{{.Set}}</td>
<td>{{.CollectorNumber}}</td> <td>{{.CollectorNumber}}</td>
@ -160,7 +163,7 @@
</tbody> </tbody>
</table> </table>
</div> </div>
</section> </section>
</body> </body>