34 lines
No EOL
960 B
HTML
34 lines
No EOL
960 B
HTML
<style>
|
|
.buttons {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
justify-content: center;
|
|
max-width: 100vw; /* Make the container as wide as the viewport */
|
|
gap: 3px;
|
|
margin: 20px 0 0 0; /* Remove any default margin */
|
|
padding: 0; /* Remove any default padding */
|
|
}
|
|
.button {
|
|
display: inline-block;
|
|
border: none;
|
|
margin: 0;
|
|
padding: 0;
|
|
border-radius: 0;
|
|
background: none;
|
|
image-rendering: auto;
|
|
image-rendering: crisp-edges;
|
|
image-rendering: pixelated;
|
|
image-rendering: -webkit-optimize-contrast;
|
|
}
|
|
</style>
|
|
|
|
<div class="buttons">
|
|
{{ $buttons := resources.Match "buttons/*" }}
|
|
{{ if $buttons }}
|
|
{{ range $index, $button := $buttons }}
|
|
<img class="button" src="{{ $button.RelPermalink }}" alt="Button {{ $button.Name | path.Base }}" />
|
|
{{ end }}
|
|
{{ else }}
|
|
<p>No buttons available.</p>
|
|
{{ end }}
|
|
</div> |