ODS 7 – Enerxía alcanzable e non contaminante
Metas
Meta 7.1
7.1 De aquí a 2030, garantir o acceso universal a servizos enerxéticos alcanzables, fiables e modernos.
Meta 7.2
7.2 De aquí a 2030, aumentar considerablemente a proporción de enerxía renovable no conxunto de fontes enerxéticas.
Meta 7.3
7.3 De aquí a 2030, duplicar a taxa mundial de mellora da eficiencia enerxética.
Meta 7.a
7.a De aquí a 2030, aumentar a cooperación internacional para facilitar o acceso á investigación e a tecnoloxía relativas á enerxía limpa, incluídas as fontes renovables, a eficiencia enerxética e as tecnoloxías avanzadas e menos contaminantes de combustibles fósiles, e promover o investimento en infraestrutura enerxética e tecnoloxías limpas.
Meta 7.b
7.b De aquí a 2030, ampliar a infraestrutura e mellorar a tecnoloxía para prestar servizos enerxéticos modernos e sostibles para todos nos países en desenvolvemento, en particular os países menos adiantados, os pequenos Estados insulares en desenvolvemento e os países en desenvolvemento sen litoral, en consonancia cos seus respectivos programas de apoio.
.horizontal-slider {
display: flex;
overflow-x: auto;
scroll-snap-type: x mandatory;
gap: 5px;
padding: 20px;
}
.slide {
flex: 0 0 auto;
width: 70px;
height: 70px;
scroll-snap-align: start;
transition: transform 0.3s ease;
}
.slide img {
width: 100%;
height: 100%;
object-fit: cover;
}
/* Zoom en móvil */
@media (max-width: 768px) {
.slide {
width: 30vw; /* Más compacto que 80vw */
height: auto;
aspect-ratio: 1 / 1;
scroll-snap-align: center;
transition: transform 0.3s ease;
}
.slide img {
width: 100%;
height: 100%;
object-fit: contain;
border-radius: 0; /* Elimina redondeo si no se desea */
}
.zoomed {
transform: scale(1.1);
z-index: 2;
}
}
const container = document.querySelector('.horizontal-slider');
const slides = document.querySelectorAll('.slide');
function updateZoomedSlide() {
let center = container.scrollLeft + container.offsetWidth / 2;
slides.forEach(slide => {
const rect = slide.getBoundingClientRect();
const slideCenter = rect.left + rect.width / 2;
if (Math.abs(slideCenter - window.innerWidth / 2) {
if (window.innerWidth <= 768) { updateZoomedSlide(); } }); window.addEventListener('resize', updateZoomedSlide); window.addEventListener('load', updateZoomedSlide);
@media (max-width: 768px) {
.dos-columnas {
display: flex;
flex-direction: row !important; /* Fuerza horizontal */
flex-wrap: nowrap;
gap: 12px; /* Ajusta según separación deseada */
}
.dos-columnas > div {
flex: 1 1 50%; /* Cada columna ocupa la mitad */
min-width: 0; /* Evita desbordamiento */
}
}




































