62 lines
3.6 KiB
HTML
62 lines
3.6 KiB
HTML
<!-- Gallery -->
|
|
<div class="card-columns" id="gallery" data-toggle="modal" data-target="#exampleModal">
|
|
{{ range $page_index, $page_val := .Pages.ByDate }}
|
|
<div class="card">
|
|
<picture>
|
|
<source type="image/webp" srcset="/images/mini/{{ .Params.img }}.webp">
|
|
<source type="image/jpeg" srcset="/images/mini/{{ .Params.img }}.jpg">
|
|
<img src="/images/mini/{{ .Params.img }}.jpg"
|
|
alt="Miniature pour {{ .Title }}"
|
|
class="card-img-top"
|
|
data-target="#carousel"
|
|
data-slide-to="{{ $page_index }}">
|
|
</picture>
|
|
</div>
|
|
{{ end }}
|
|
</div>
|
|
<!-- Modal -->
|
|
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-hidden="true">
|
|
<div class="modal-dialog modal-full modal-dialog-centered" role="document">
|
|
<div class="modal-content">
|
|
{{ range $page_index, $page_val := .Pages.ByDate }}
|
|
<div class="modal-header" id="modal-header-id-{{ .Params.img }}" {{ if (ne $page_index 0) }}style="display: none"{{ end }}>
|
|
<h5 class="modal-title">{{ if (.Params.title) }}{{ .Params.title }}{{ else }}<em>(Sans titre)</em>{{ end }}</h5>
|
|
<div class="btn-group" role="group" aria-label="Button group with nested dropdown">
|
|
<a class="btn btn-secondary" href="#carousel" role="button" data-slide="prev"><i class="fas fa-backward"></i></a>
|
|
<a role="button" class="btn btn-secondary" href="{{ .Page.Permalink }}"><i class="fas fa-info-circle"></i></a>
|
|
{{ partial "dldropdown.html" . }}
|
|
<button type="button" class="btn btn-primary" data-dismiss="modal"><i class="fas fa-times-circle"></i></button>
|
|
<a class="btn btn-secondary" href="#carousel" role="button" data-slide="next"><i class="fas fa-forward"></i></a>
|
|
</div>
|
|
|
|
</div>
|
|
{{ end }}
|
|
<div class="modal-body">
|
|
<div id="carousel" class="carousel slide carousel-fade lazy" data-ride="carousel" data-interval="false">
|
|
<div class="carousel-inner">
|
|
{{ range $page_index, $page_val := .Pages.ByDate }}
|
|
<div class="carousel-item {{ if (eq $page_index 0) }}active{{ end }}">
|
|
<picture>
|
|
<source type="image/webp" srcset="/images/2k/{{ .Params.img }}.webp">
|
|
<source type="image/jpeg" srcset="/images/2k/{{ .Params.img }}.jpg">
|
|
<img class="d-block"
|
|
data-index="{{ .Params.img }}"
|
|
{{ if (ne $page_index 0) }}data-{{ end }}src="/images/2k/{{ .Params.img }}.jpg"
|
|
alt="{{ .Title }}">
|
|
</picture>
|
|
</div>
|
|
{{ end }}
|
|
</div>
|
|
<a class="carousel-control-prev" href="#carousel" role="button" data-slide="prev">
|
|
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
|
|
<span class="sr-only">Précédent</span>
|
|
</a>
|
|
<a class="carousel-control-next" href="#carousel" role="button" data-slide="next">
|
|
<span class="carousel-control-next-icon" aria-hidden="true"></span>
|
|
<span class="sr-only">Suivant</span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|