Add card to template

This commit is contained in:
2024-03-14 00:26:35 +01:00
parent ad1dfbd566
commit 8c6aa70401
+36 -16
View File
@@ -27,23 +27,43 @@
</div>
</section>
<hr>
<div id="template" hx-boost hx-ext="client-side-templates">
<div
hx-get="http://localhost:1337/api/articles?populate=couverture"
hx-trigger="load"
mustache-template="articles"
>
<p>Chargement...</p>
<section>
<div class="container is-max-widescreen" id="template" hx-boost hx-ext="client-side-templates">
<div
hx-get="http://localhost:1337/api/articles?populate=couverture"
hx-trigger="load"
mustache-template="articles"
>
<p>Chargement...</p>
</div>
<script id="articles" type="x-tmpl-mustache">
<div class="columns is-multiline p-3">
{{#data}}
<div class="column is-one-third">
<div class="card">
<div class="card-image">
<figure class="image is-square">
<img src="http://localhost:1337{{attributes.couverture.data.attributes.url}}" alt="{{attributes.couverture.data.attributes.alternativeText}}">
</figure>
</div>
<div class="card-content">
<div class="content">
<h2 class="title">{{attributes.titre}}</h2>
{{{attributes.chapeau}}}
</div>
</div>
<footer class="card-footer">
<div class="has-text-centered" style="width: 100%">
<p class="my-3"><small><i>Date de publication : {{attributes.date}}</i></small></p>
</div>
</footer>
</div>
</div>
{{/data}}
</div>
</script>
</div>
<script id="articles" type="x-tmpl-mustache">
{{#data}}
<h2 class="title">{{attributes.titre}}</h2>
{{{attributes.contenu}}}
<small>Date de publication : {{attributes.date}}</small></pre>
<hr/>
{{/data}}
</script>
</div>
</section>
<div id="modal-charte" class="modal">
<div class="modal-background"></div>
<div class="modal-card">