Add shortcode for displaying typewriter specifications with responsive styling

This commit is contained in:
gribse 2025-04-18 12:24:33 +02:00
parent 421c7653f0
commit b3a415954a

View file

@ -0,0 +1,89 @@
<!-- For displaying typewriter specifications from the current page -->
<style>
.typewriter-specs {
width: 300px;
margin: 20px 0;
padding: 10px;
border: 1px solid #ccc;
}
</style>
{{ $specs := .Page.Params.typewriterSpecs }}
{{ if $specs }}
<div class="typewriter-specs">
<h3>Fiche technique</h3>
{{ with $specs.image }}
<figure>
<img src="{{ . }}" alt="Image of {{ $specs.manufacturer }} {{ $specs.type }}">
</figure>
{{ end }}
<table>
<tbody>
{{ with $specs.logo }}
<figure class="logo">
<img src="{{ . }}" alt="Logo of {{ $specs.manufacturer }}">
</figure>
{{ end }}
{{ with $specs.manufacturer }}
<tr>
<th>Fabricant</th>
<td>{{ . }}</td>
</tr>
{{ end }}
{{ with $specs.type }}
<tr>
<th>Type</th>
<td>{{ . }}</td>
</tr>
{{ end }}
{{ with $specs.dateLaunched }}
<tr>
<th>Date de lancement</th>
<td>{{ . }}</td>
</tr>
{{ end }}
{{ with $specs.massKg }}
<tr>
<th>Masse</th>
<td>{{ . }} kg</td>
</tr>
{{ end }}
{{ with $specs.widthCm }}
<tr>
<th>Largeur</th>
<td>{{ . }} cm</td>
</tr>
{{ end }}
{{ with $specs.linkWiki }}
<tr>
<th>Lien Wikipedia</th>
<td><a href="{{ . }}" target="_blank">Link</a></td>
</tr>
{{ end }}
{{ with $specs.linkTpdb }}
<tr>
<th>Lien Typewriter Database</th>
<td><a href="{{ . }}" target="_blank">Link</a></td>
</tr>
{{ end }}
</tbody>
</table>
</div>
{{ else }}
<div class="notice warning">
<p>Pas de spécifications trouvées :(</p>
</div>
{{ end }}