codyops/apex
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

#5 - Mejorar eficiencia de imagenes

Browse Source
This commit is contained in:
Luciano Giacchetta 2025-06-16 18:42:30 -03:00
parent 78831988d3
commit d2dea79976
2 changed files with 33 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
src/components/Footer.astro
View File

@ -1,5 +1,11 @@
---
const date = new Date();
import { Image } from 'astro:assets';
import linkedIn from 'bootstrap-icons/icons/linkedin.svg'
import facebook from 'bootstrap-icons/icons/facebook.svg'
import instagram from 'bootstrap-icons/icons/instagram.svg'
import youtube from 'bootstrap-icons/icons/youtube.svg'
import github from 'bootstrap-icons/icons/github.svg'
---
<footer>
<div class="container pb-5">
@ -11,27 +17,27 @@ const date = new Date();
<ul class="list-inline mb-0">
<li class="list-inline-item">
<a href="https://www.linkedin.com/company/codyopslatam">
<i class="bi-linkedin text-white"></i>
<Image class="img-bg-w" src={linkedIn} width={25} alt={'linkedIn Logo'}></Image>
</a>
</li>
<li class="list-inline-item">
<a href="https://www.facebook.com/codyopslatam">
<i class="bi-facebook text-white"></i>
<Image class="img-bg-w" src={facebook} width={25} alt={'facebook Logo'}></Image>
</a>
</li>
<li class="list-inline-item">
<a href="https://www.instagram.com/codyopslatam">
<i class="bi-instagram text-white"></i>
<Image class="img-bg-w" src={instagram} width={25} alt={'instagram Logo'}></Image>
</a>
</li>
<li class="list-inline-item">
<a href="https://www.youtube.com/@codyopslabs">
<i class="bi-youtube text-white"></i>
<Image class="img-bg-w" src={youtube} width={25} alt={'youtube Logo'}></Image>
</a>
</li>
<li class="list-inline-item">
<a href="https://github.com/codyopslabs">
<i class="bi-github text-white"></i>
<Image class="img-bg-w" src={github} width={25} alt={'github Logo'}></Image>
</a>
</li>
</ul>
@ -39,3 +45,9 @@ const date = new Date();
</div>
</div>
</footer>
<style>
.img-bg-w {
filter: invert(100%) brightness(100%);
}
</style>

30
src/pages/index.astro
View File

@ -31,7 +31,7 @@ import spain from '../assets/img/spain-flag-square-medium.png';
<div class="col-md-6 col-lg-4 mb-4 mb-md-5 mb-lg-0">
<a class="text-center text-decoration-none border-0" href="https://ar.codyops.com/ ">
<div class="mb-3">
<Picture class="img-thumbnail" src={argentina} alt="Argentina Logo" />
<Picture class="img-thumbnail" width="300" height="300" loading="eager" src={argentina} alt="Argentina Logo" />
</div>
<h2 class="card-title text-white">Argentina</h2>
</a>
@ -39,7 +39,7 @@ import spain from '../assets/img/spain-flag-square-medium.png';
<div class="col-md-6 col-lg-4 mb-4 mb-md-5 mb-lg-0">
<a class="text-center text-decoration-none border-0" href="https://www.codyops.com.br">
<div class="mb-3">
<Picture class="img-thumbnail" src={brazil} alt="Brasil Logo" />
<Picture class="img-thumbnail" width="300" height="300" loading="eager" src={brazil} alt="Brasil Logo" />
</div>
<h2 class="card-title text-white">Brasil</h2>
</a>
@ -47,7 +47,7 @@ import spain from '../assets/img/spain-flag-square-medium.png';
<div class="col-md-6 col-lg-4 mb-4 mb-md-5 mb-lg-0">
<a class="text-center text-decoration-none border-0" href="https://cl.codyops.com">
<div class="mb-3">
<Picture class="img-thumbnail" src={chile} alt="Chile Logo" />
<Picture class="img-thumbnail" width="300" height="300" loading="eager" src={chile} alt="Chile Logo" />
</div>
<h2 class="card-title text-white">Chile</h2>
</a>
@ -57,7 +57,7 @@ import spain from '../assets/img/spain-flag-square-medium.png';
<div class="col-md-6 col-lg-4 mb-4 mb-md-5 mb-lg-0">
<a class="text-center text-decoration-none border-0" href="https://co.codyops.com">
<div class="mb-3">
<Picture class="img-thumbnail" src={colombia} alt="Colombia Logo" />
<Picture class="img-thumbnail" width="300" height="300" loading="eager" src={colombia} alt="Colombia Logo" />
</div>
<h2 class="card-title text-white">Colombia</h2>
</a>
@ -65,7 +65,7 @@ import spain from '../assets/img/spain-flag-square-medium.png';
<div class="col-md-6 col-lg-4 mb-4 mb-md-5 mb-lg-0">
<a class="text-center text-decoration-none border-0" href="https://cr.codyops.com/ ">
<div class="mb-3">
<Picture class="img-thumbnail" src={costarica} alt="Costa Rica Logo" />
<Picture class="img-thumbnail" width="300" height="300" loading="eager" src={costarica} alt="Costa Rica Logo" />
</div>
<h2 class="card-title text-white">Costa Rica</h2>
</a>
@ -73,7 +73,7 @@ import spain from '../assets/img/spain-flag-square-medium.png';
<div class="col-md-6 col-lg-4 mb-4 mb-md-5 mb-lg-0">
<a class="text-center text-decoration-none border-0" href="https://do.codyops.com">
<div class="mb-3">
<Picture class="img-thumbnail" src={dominicana} alt="Dominicana Logo" />
<Picture class="img-thumbnail" width="300" height="300" loading="eager" src={dominicana} alt="Dominicana Logo" />
</div>
<h2 class="card-title text-white">Dominicana</h2>
</a>
@ -83,7 +83,7 @@ import spain from '../assets/img/spain-flag-square-medium.png';
<div class="col-md-6 col-lg-4 mb-4 mb-md-5 mb-lg-0">
<a class="text-center text-decoration-none border-0" href="https://ec.codyops.com">
<div class="mb-3">
<Picture class="img-thumbnail" src={ecuador} alt="Ecuador Logo" />
<Picture class="img-thumbnail" width="300" height="300" loading="eager" src={ecuador} alt="Ecuador Logo" />
</div>
<h2 class="card-title text-white">Ecuador</h2>
</a>
@ -91,7 +91,7 @@ import spain from '../assets/img/spain-flag-square-medium.png';
<div class="col-md-6 col-lg-4 mb-4 mb-md-5 mb-lg-0">
<a class="text-center text-decoration-none border-0" href="https://www.codyops.com.es">
<div class="mb-3">
<Picture class="img-thumbnail" src={spain} alt="Spain Logo" />
<Picture class="img-thumbnail" width="300" height="300" loading="eager" src={spain} alt="Spain Logo" />
</div>
<h2 class="card-title text-white">España</h2>
</a>
@ -99,7 +99,7 @@ import spain from '../assets/img/spain-flag-square-medium.png';
<div class="col-md-6 col-lg-4 mb-4 mb-md-5 mb-lg-0">
<a class="text-center text-decoration-none border-0" href="https://www.codyops.com ">
<div class="mb-3">
<Picture class="img-thumbnail" src={usa} alt="USA Logo" />
<Picture class="img-thumbnail" width="300" height="300" loading="eager" src={usa} alt="USA Logo" />
</div>
<h2 class="card-title text-white">Estados Unidos</h2>
</a>
@ -109,7 +109,7 @@ import spain from '../assets/img/spain-flag-square-medium.png';
<div class="col-md-6 col-lg-4 mb-4 mb-md-5 mb-lg-0">
<a class="text-center text-decoration-none border-0" href="https://mx.codyops.com/ ">
<div class="mb-3">
<Picture class="img-thumbnail" src={mexico} alt="Mexico Logo" />
<Picture class="img-thumbnail" width="300" height="300" loading="eager" src={mexico} alt="Mexico Logo" />
</div>
<h2 class="card-title text-white">México</h2>
</a>
@ -117,7 +117,7 @@ import spain from '../assets/img/spain-flag-square-medium.png';
<div class="col-md-6 col-lg-4 mb-4 mb-md-5 mb-lg-0">
<a class="text-center text-decoration-none border-0" href="https://pa.codyops.com">
<div class="mb-3">
<Picture class="img-thumbnail" src={panama} alt="Panama Logo" />
<Picture class="img-thumbnail" width="300" height="300" loading="eager" src={panama} alt="Panama Logo" />
</div>
<h2 class="card-title text-white">Panamá</h2>
</a>
@ -125,7 +125,7 @@ import spain from '../assets/img/spain-flag-square-medium.png';
<div class="col-md-6 col-lg-4">
<a class="text-center text-decoration-none border-0" href="https://py.codyops.com">
<div class="mb-3">
<Picture class="img-thumbnail" src={paraguay} alt="Paraguay Logo" />
<Picture class="img-thumbnail" width="300" height="300" loading="eager" src={paraguay} alt="Paraguay Logo" />
</div>
<h2 class="card-title text-white">Paraguay</h2>
</a>
@ -135,7 +135,7 @@ import spain from '../assets/img/spain-flag-square-medium.png';
<div class="col-md-6 col-lg-4 mb-4 mb-md-5 mb-lg-0">
<a class="text-center text-decoration-none border-0" href="https://pe.codyops.com/ ">
<div class="mb-3">
<Picture class="img-thumbnail" src={peru} alt="Peru Logo" />
<Picture class="img-thumbnail" width="300" height="300" loading="eager" src={peru} alt="Peru Logo" />
</div>
<h2 class="card-title text-white">Perú</h2>
</a>
@ -143,7 +143,7 @@ import spain from '../assets/img/spain-flag-square-medium.png';
<div class="col-md-6 col-lg-4 mb-4 mb-md-5 mb-lg-0">
<a class="text-center text-decoration-none border-0" href="https://sv.codyops.com">
<div class="mb-3">
<Picture class="img-thumbnail" src={salvador} alt="Salvador Logo" />
<Picture class="img-thumbnail" width="300" height="300" loading="eager" src={salvador} alt="Salvador Logo" />
</div>
<h2 class="card-title text-white">El Salvador</h2>
</a>
@ -151,7 +151,7 @@ import spain from '../assets/img/spain-flag-square-medium.png';
<div class="col-md-6 col-lg-4">
<a class="text-center text-decoration-none border-0" href="https://uy.codyops.com">
<div class="mb-3">
<Picture class="img-thumbnail" src={uruguay} alt="Uruguay Logo" />
<Picture class="img-thumbnail" width="300" height="300" loading="eager" src={uruguay} alt="Uruguay Logo" />
</div>
<h2 class="card-title text-white">Uruguay</h2>
</a>