59 lines
2.0 KiB
Go Template
59 lines
2.0 KiB
Go Template
{{define "components/PokemonCard.gohtml"}}
|
|
<div class="col-xl-3 col-lg-4 col-md-6 col-sm-12 col-xs-12"
|
|
align="center"
|
|
id="{{.Name}}">
|
|
<div class="card m-1 text-bg-secondary"
|
|
style="width: 18rem;"
|
|
onMouseOver="this.style.transform = ('scale(1.05)');this.style.transition='0.3s';"
|
|
onMouseOut="this.style.transform = ('scale(1)');this.style.transition='0.3s';"
|
|
align="start">
|
|
|
|
{{if ne .Image ""}}
|
|
<img src="{{.Image}}"
|
|
class="card-img-top"
|
|
alt="{{.Name}}">
|
|
{{else}}
|
|
<picture>
|
|
<!-- <source
|
|
srcset="https://res.cloudinary.com/dadobos/image/upload/v1669533239/web/qhvaith9pdepdylkekzl.webp"
|
|
type="image/webp"/> -->
|
|
<img src="https://res.cloudinary.com/dadobos/image/upload/v1669533239/web/qhvaith9pdepdylkekzl.png"
|
|
class="card-img-top"
|
|
alt="{{.Name}}"
|
|
loading="lazy">
|
|
</picture>
|
|
{{end}}
|
|
<div class="card-body">
|
|
<h5 class="card-title">
|
|
<span>Name: </span>
|
|
<span class="text-capitalize">{{.Name}}</span>
|
|
</h5>
|
|
<p class="card-text">
|
|
<div class="row">
|
|
<div class="col-6">
|
|
<strong>Weight: </strong>
|
|
<span>{{.Weight}}</span>
|
|
</div>
|
|
<div class="col-6">
|
|
<strong>Height:</strong>
|
|
<span>{{.Height}}</span>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col">
|
|
<strong>Types: </strong>
|
|
<span>{{.Types}}</span>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col">
|
|
<strong>Moves: </strong>
|
|
<p>{{.Moves}}</p>
|
|
</div>
|
|
</div>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{{end}} |