96 lines
2.9 KiB
HTML
96 lines
2.9 KiB
HTML
|
<!DOCTYPE html>
|
|||
|
|
<html lang="fr">
|
|||
|
|
|
|||
|
|
<head>
|
|||
|
|
<meta charset="UTF-8">
|
|||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|||
|
|
<title>Botascopia</title>
|
|||
|
|
|
|||
|
|
<link rel="stylesheet" type="text/css" href="/assets/style.css">
|
|||
|
|
<link rel="stylesheet" type="text/css" href="/assets/fonts/borna/stylesheet.css">
|
|||
|
|
<link rel="stylesheet" type="text/css" href="/assets/fonts/nunita/stylesheet.css">
|
|||
|
|
|
|||
|
|
</head>
|
|||
|
|
|
|||
|
|
<body>
|
|||
|
|
|
|||
|
|
<include src="/components/site-header.html"></include>
|
|||
|
|
|
|||
|
|
<main id="main_species-list">
|
|||
|
|
|
|||
|
|
<header class="page-header">
|
|||
|
|
<h2 class="page-title">Liste des espèces</h2>
|
|||
|
|
|
|||
|
|
</header>
|
|||
|
|
|
|||
|
|
<nav class="sort">
|
|||
|
|
<ul>
|
|||
|
|
<li>Trier par familles</li>
|
|||
|
|
<li>Trier par ordre alphabétique</li>
|
|||
|
|
</ul>
|
|||
|
|
<button>Vue édition</button>
|
|||
|
|
</nav>
|
|||
|
|
|
|||
|
|
<section class="species-list">
|
|||
|
|
|
|||
|
|
<article class="taxon">
|
|||
|
|
<figure>
|
|||
|
|
<img src="/images/Acorus_calamus_morphology_outlook_illustration_photo.png">
|
|||
|
|
</figure>
|
|||
|
|
<h3 class="vernacular">Acore odorant</h3>
|
|||
|
|
<h4 class="latin">Acorus calamus L.</h4>
|
|||
|
|
|
|||
|
|
<div class="chart-edit"><abbr title="Rempli à 81 % (18 / 22) et vérifié à 0 % (0 / 22)"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="completion" viewBox="-6 -6 110 110"><circle xmlns="http://www.w3.org/2000/svg" cx="50" cy="50" r="50"></circle><path xmlns="http://www.w3.org/2000/svg" class="filled" d="M 50 0 A 50 50 0 1 1 4.5184 29.2292 L 50 50 Z"></path><path xmlns="http://www.w3.org/2000/svg" class="verified" d="M 50 0 A 50 50 0 0 1 50 0 L 50 50 Z"></path></svg></abbr></div>
|
|||
|
|
|
|||
|
|
<button class="btn-edit">
|
|||
|
|
<include src="/components/icons/edit.svg"></include>
|
|||
|
|
</button>
|
|||
|
|
</article>
|
|||
|
|
|
|||
|
|
</section>
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
</main>
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
<include src="/components/site-footer.html"></include>
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
<!-- SCRIPT À SUPPRIMER UNE FOIS LE SITE INTEGRÉ (include des composants)-->
|
|||
|
|
<script>
|
|||
|
|
function processIncludes() {
|
|||
|
|
const includes = document.querySelectorAll('include[src]');
|
|||
|
|
|
|||
|
|
if (includes.length === 0) {
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const promises = Array.from(includes).map(el => {
|
|||
|
|
const src = el.getAttribute('src');
|
|||
|
|
return fetch(src)
|
|||
|
|
.then(r => {
|
|||
|
|
if (!r.ok) throw new Error(`Erreur ${r.status}: ${src}`);
|
|||
|
|
return r.text();
|
|||
|
|
})
|
|||
|
|
.then(html => {
|
|||
|
|
el.outerHTML = html;
|
|||
|
|
})
|
|||
|
|
.catch(err => {
|
|||
|
|
console.error('Erreur de chargement:', err);
|
|||
|
|
});
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
Promise.all(promises).then(() => {
|
|||
|
|
processIncludes();
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
document.addEventListener('DOMContentLoaded', processIncludes);
|
|||
|
|
</script>
|
|||
|
|
</body>
|
|||
|
|
|
|||
|
|
</html>
|