reorganisation style
This commit is contained in:
Julie Blanc
parent
e390d8cd5b
commit
718ca47696
20 changed files with 1187 additions and 821 deletions
217
a-propos.html
Normal file
217
a-propos.html
Normal file
|
|
@ -0,0 +1,217 @@
|
|||
<!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 class="has-toc">
|
||||
|
||||
<header class="page-header">
|
||||
|
||||
<h2 class="page-title">Le projet botascopia</h2>
|
||||
|
||||
</header>
|
||||
|
||||
|
||||
<nav class="page-toc">
|
||||
<ul>
|
||||
<li><a href="#demarche-botascopia">La démarche</a></li>
|
||||
<li><a href="#equipe">L’équipe</a></li>
|
||||
<li><a href="#soutien-financier"> Soutien Financier</a></li>
|
||||
|
||||
|
||||
</ul>
|
||||
|
||||
</nav>
|
||||
|
||||
<section class="page-content">
|
||||
|
||||
|
||||
<h3 id="demarche-botascopia">La démarche botascopia</h3>
|
||||
|
||||
<p>Botascopia est un projet inter- et transdisciplinaire de recherche-action mêlant botanique, informatique et sciences sociales. Le développement de nos outils se fait en lien avec les communautés concernées. Nous cherchons également à évaluer leur appropriation et leurs impacts sur ces communautés. Le projet interroge le rôle des outils de reconnaissance de plantes dans le partage des connaissances botaniques et la perception du vivant. </p>
|
||||
|
||||
|
||||
<p>Le projet de recherche Botascopia s’adresse à toutes celles et ceux qui souhaitent
|
||||
<strong>identifier, connaître ou faire connaître les plantes autour d’eux</strong>. Il s’adresse
|
||||
aussi aux botanistes chevronnés à la recherche d’informations fiables et détaillées sur les espèces
|
||||
de plantes à fleurs. Il poursuit quatre objectifs :</p>
|
||||
<ol>
|
||||
<li><strong>Constituer une base de connaissances sur les plantes à fleurs</strong> permettant de
|
||||
décrire finement leur morphologie ainsi que d’autres caractéristiques (écologie, distribution,
|
||||
propriétés)</li>
|
||||
<li><strong>Développer des outils informatiques</strong> permettant de produire automatiquement des
|
||||
clés de détermination et des fiches descriptives à partir d’une collection d’espèces</li>
|
||||
<li>Mettre à disposition l’ensemble (base de connaissances, clés, fiches) <strong>pour un public le
|
||||
plus large possible</strong> : amateurs, professionnels, académiques</li>
|
||||
<li>Interroger le rôle des outils de reconnaissance de plantes dans le <strong>partage des
|
||||
connaissances botaniques et la perception du vivant</strong> </li>
|
||||
|
||||
</ol>
|
||||
|
||||
|
||||
<h3 id="equipe">L’équipe</h3>
|
||||
|
||||
<h4>Membres du projet</h4>
|
||||
|
||||
<div class="team">
|
||||
<div class="member">
|
||||
<img src="/images/simon.jpg">
|
||||
<div class="name">Simon Castellan</div>
|
||||
<div class="details">(Inria Rennes)</div>
|
||||
</div>
|
||||
<div class="member">
|
||||
<img src="/images/sophie.jpg">
|
||||
<div class="name">Sophie Nadot</div>
|
||||
<div class="details">(Univ. Paris-Saclay)</div>
|
||||
</div>
|
||||
<div class="member">
|
||||
<img src="/images/xavier.jpg">
|
||||
<div class="name">Xavier Aubriot</div>
|
||||
<div class="details">(Univ. Paris-Saclay)</div>
|
||||
</div>
|
||||
<div class="member">
|
||||
<img src="/images/eric.jpg">
|
||||
<div class="name">Eric Tannier</div>
|
||||
<div class="details">(Inria Lyon)</div>
|
||||
</div>
|
||||
<div class="member">
|
||||
<img src="/images/agnes.jpg">
|
||||
<div class="name">Agnès Schermann</div>
|
||||
<div class="details">(Univ. Rennes)</div>
|
||||
</div>
|
||||
<div class="member">
|
||||
<img src="/images/jos.jpg">
|
||||
<div class="name">Jos Käfer</div>
|
||||
<div class="details">(CNRS)</div>
|
||||
</div>
|
||||
<div class="member">
|
||||
<img src="/images/aurore.jpg">
|
||||
<div class="name">Aurore Alcolei</div>
|
||||
<div class="details">(UPEC)</div>
|
||||
</div>
|
||||
<div class="member">
|
||||
<img src="/images/laetitia.jpg">
|
||||
<div class="name">Laetitia Carrive</div>
|
||||
<div class="details">(Univ. Rennes)</div>
|
||||
</div>
|
||||
<div class="member">
|
||||
<img src="/images/gurvan.jpg">
|
||||
<div class="name">Gurvan Cabon</div>
|
||||
<div class="details">(Inria)</div>
|
||||
</div>
|
||||
<div class="member">
|
||||
<img src="/images/mathurin.jpg">
|
||||
<div class="name">Mathurin Bellot</div>
|
||||
<div class="details">(Tela-Botanica)</div>
|
||||
</div>
|
||||
<div class="member">
|
||||
<img src="/images/marie-charlotte.jpg">
|
||||
<div class="name">Marie-Charlotte Allam</div>
|
||||
<div class="details">(Univ. Rennes)</div>
|
||||
</div>
|
||||
<div class="member">
|
||||
<img src="/images/jeremy.jpg">
|
||||
<div class="name">Jérémy Omer</div>
|
||||
<div class="details">(INSA Rennes)</div>
|
||||
</div>
|
||||
<div class="member">
|
||||
<img src="/images/marine.jpg">
|
||||
<div class="name">Marine Fauché</div>
|
||||
<div class="details">(Univ. Paris-Saclay)</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h4>Alumni</h4>
|
||||
|
||||
<ul>
|
||||
<li>Lysa Dahmani</li>
|
||||
<li>Virgil Marionneau</li>
|
||||
<li>Charlotte Thomas</li>
|
||||
<li>Louise Cranidge</li>
|
||||
<li>Fanny Folta-Gerij</li>
|
||||
<li>Constance Monnier</li>
|
||||
<li>Zélie Rodrigues</li>
|
||||
<li>Mattéo Prieur</li>
|
||||
<li>Clément Maouche</li>
|
||||
<li>Joris Hélie</li>
|
||||
<li>Eugénie Mousseux-Caillon</li>
|
||||
<li>Isabella Gargiulo Gutierrez</li>
|
||||
<li>Nolwenn Emonet</li>
|
||||
<li>Baptiste Izquierdo Rey</li>
|
||||
<li>Amélie Sagliet</li><li>
|
||||
</li><li>Capucine Tesson</li><li>
|
||||
</li></ul>
|
||||
|
||||
<h3 id="soutien-financer">Soutien Financier</h3>
|
||||
|
||||
<ul>
|
||||
<li>Action exploratoire Inria <i>Back to the trees</i> (2023-2025)
|
||||
</li>
|
||||
<li>Innovation pédagogique OSER et Graduate School Biosphera - Université Paris-Saclay</li>
|
||||
<li>ANR Sciences avec et pour la société <i>Flores</i> (2024-2025)</li>
|
||||
<li>Ville de Paris</li>
|
||||
<li>Pl@ntAgroEco</li>
|
||||
</ul>
|
||||
|
||||
|
||||
</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>
|
||||
|
|
@ -32,3 +32,16 @@ button{
|
|||
background: none;
|
||||
border: none;
|
||||
}
|
||||
figure, picture, img{
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.link-block{
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
|
@ -1,74 +0,0 @@
|
|||
|
||||
.highlight-block{
|
||||
|
||||
|
||||
background-color: var(--color);
|
||||
border: 1px solid var(--color-txt-light);
|
||||
border-radius: var(--radius-small);
|
||||
padding: calc(var(--padding-inner)*1.5) var(--padding-inner);
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
gap: var(--unit);
|
||||
|
||||
figure{
|
||||
width: 100%;
|
||||
max-width: 160px;
|
||||
aspect-ratio: 4/5;
|
||||
border: 1px solid var(--color-medium);
|
||||
border-radius: var(--radius-small);
|
||||
overflow: hidden;
|
||||
|
||||
img{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
}
|
||||
|
||||
.label{
|
||||
font-weight: 600;
|
||||
margin-bottom: calc(var(--unit)*0.5);
|
||||
/* text-decoration: 1px underline;
|
||||
text-underline-offset: 3px; */
|
||||
color: var(--color);
|
||||
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
background-color: var(--color-light);
|
||||
height: var(--unit);
|
||||
padding: 0px 1ch;
|
||||
border-radius: var(--radius-btn);
|
||||
}
|
||||
|
||||
.title{
|
||||
font-family: var(--font-title);
|
||||
font-size: 1.4rem;
|
||||
font-weight: normal;
|
||||
margin-top: 0.5em;
|
||||
margin-bottom: 0.25em;
|
||||
color: var(--color-light);
|
||||
|
||||
}
|
||||
.details{
|
||||
margin-bottom: calc(var(--unit)*0.75);
|
||||
// font-size: 0.8rem;
|
||||
color: var(--color-light);
|
||||
font-weight: 500;
|
||||
|
||||
}
|
||||
|
||||
.content{
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.see-more{
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
font-size: var(--fs-small);
|
||||
--hover-bg: var(--color);
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
|
@ -1,30 +1,17 @@
|
|||
@use "abstracts/mixins.scss" as *;
|
||||
|
||||
#home__livrets {
|
||||
--color: var(--color-violet);
|
||||
--color-medium: var(--color-violet-medium);
|
||||
--color-light: var(--color-violet-light);
|
||||
|
||||
.home--section-tool{
|
||||
background-color: var(--color);
|
||||
color: var(--white);
|
||||
&[data-type="base-connaissance"],
|
||||
&[data-type="livrets"]{
|
||||
color: var(--white);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
#home__animations {
|
||||
--color: var(--color-yellow);
|
||||
--color-medium: var(--color-yellow-medium);
|
||||
--color-light: var(--color-yellow-light);
|
||||
background-color: var(--color);
|
||||
|
||||
|
||||
color: var(--color-txt);
|
||||
}
|
||||
#home__base-connaissance {
|
||||
--color: var(--color-orange);
|
||||
--color-medium: var(--color-orange-medium);
|
||||
--color-light: var(--color-orange-light);
|
||||
background-color: var(--color);
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
3
assets/css/_page-content.scss
Normal file
3
assets/css/_page-content.scss
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
.page-content{
|
||||
font-size: var(--fs-medium);
|
||||
}
|
||||
|
|
@ -62,14 +62,14 @@
|
|||
--color: var(--color-green);
|
||||
--color-medium: var(--color-green-medium);
|
||||
--color-light: var(--color-green-light);
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
[data-type="livret"]{
|
||||
|
||||
|
||||
|
||||
|
||||
[data-type="livrets"]{
|
||||
--color: var(--color-violet);
|
||||
--color-medium: var(--color-violet-medium);
|
||||
--color-light: var(--color-violet-light);
|
||||
|
|
@ -77,13 +77,21 @@
|
|||
|
||||
|
||||
[data-type="base-connaissance"]{
|
||||
--color: var(--color-green);
|
||||
--color-medium: var(--color-green-medium);
|
||||
--color-light: var(--color-green-light);
|
||||
|
||||
}
|
||||
|
||||
[data-type="animations"]{
|
||||
--color: var(--color-orange);
|
||||
--color-medium: var(--color-orange-medium);
|
||||
--color-light: var(--color-orange-light);
|
||||
}
|
||||
|
||||
[data-type="methodologie"]{
|
||||
|
||||
--color: var(--color-yellow);
|
||||
--color-medium: var(--color-yellow-medium);
|
||||
--color-light: var(--color-yellow-light);
|
||||
}
|
||||
|
||||
[data-type="atelier"]{
|
||||
--color: var(--color-orange);
|
||||
--color-medium: var(--color-orange-medium);
|
||||
--color-light: var(--color-orange-light);
|
||||
}
|
||||
|
|
@ -14,7 +14,6 @@
|
|||
|
||||
|
||||
.taxon{
|
||||
// width: calc(100%/3 - var(--spacing)*4/3);
|
||||
width: calc(100%/3 - var(--spacing)*3/3);
|
||||
}
|
||||
|
||||
|
|
@ -1,4 +1,4 @@
|
|||
@use "abstracts/mixins.scss" as *;
|
||||
@use "../abstracts/mixins.scss" as *;
|
||||
|
||||
.species-list .taxon{
|
||||
|
||||
|
|
@ -18,7 +18,7 @@
|
|||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
// margin-bottom: calc(var(--spacing)*2);
|
||||
position: relative;
|
||||
|
||||
background-color: var(--color-green-light);
|
||||
padding: 20px;
|
||||
|
|
@ -36,26 +36,35 @@
|
|||
}
|
||||
|
||||
.vernacular{
|
||||
// font-size: var(--fs-medium);
|
||||
// color: var(--color-green);
|
||||
background-color: var(--color-green);
|
||||
color: white;
|
||||
border-radius: var(--radius-small);
|
||||
padding: 4px 1ch;
|
||||
margin-bottom: calc(var(--spacing)*0.25);
|
||||
a{
|
||||
color: white;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
.latin{
|
||||
font-weight: normal;
|
||||
font-weight: 500;
|
||||
font-style: italic;
|
||||
margin-bottom: calc(var(--spacing)*0.75);
|
||||
margin-bottom: calc(var(--spacing)*0.75);
|
||||
color: var(--color-txt);
|
||||
}
|
||||
|
||||
.vernacular, .latin{
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
&:hover{
|
||||
outline: 2px solid var(--color-green);
|
||||
background-color: var(--color-green-medium);
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
10
assets/css/components/_team.scss
Normal file
10
assets/css/components/_team.scss
Normal file
|
|
@ -0,0 +1,10 @@
|
|||
.team{
|
||||
.member{
|
||||
img{
|
||||
width: 60px;
|
||||
aspect-ratio: 1/1;
|
||||
background-color: #cfcfcf;
|
||||
border-radius: var(--radius-img);
|
||||
}
|
||||
}
|
||||
}
|
||||
168
assets/style.css
168
assets/style.css
|
|
@ -1,7 +1,7 @@
|
|||
@charset "UTF-8";
|
||||
:root {
|
||||
--font-title: "Borna", Arial, sans-serif;
|
||||
--font: "Nunito", Arial, sans-serif;
|
||||
--font-title: 'Borna', Arial, sans-serif;
|
||||
--font: 'Nunito', Arial, sans-serif;
|
||||
--fs-small: 14px;
|
||||
--fs-normal: 16px;
|
||||
--fs-medium: 22px;
|
||||
|
|
@ -45,24 +45,30 @@
|
|||
--color-light: var(--color-green-light);
|
||||
}
|
||||
|
||||
[data-type=livret] {
|
||||
[data-type=livrets] {
|
||||
--color: var(--color-violet);
|
||||
--color-medium: var(--color-violet-medium);
|
||||
--color-light: var(--color-violet-light);
|
||||
}
|
||||
|
||||
[data-type=base-connaissance] {
|
||||
--color: var(--color-yellow);
|
||||
--color-medium: var(--color-yellow-medium);
|
||||
--color-light: var(--color-yellow-light);
|
||||
--color: var(--color-green);
|
||||
--color-medium: var(--color-green-medium);
|
||||
--color-light: var(--color-green-light);
|
||||
}
|
||||
|
||||
[data-type=atelier] {
|
||||
[data-type=animations] {
|
||||
--color: var(--color-orange);
|
||||
--color-medium: var(--color-orange-medium);
|
||||
--color-light: var(--color-orange-light);
|
||||
}
|
||||
|
||||
[data-type=methodologie] {
|
||||
--color: var(--color-yellow);
|
||||
--color-medium: var(--color-yellow-medium);
|
||||
--color-light: var(--color-yellow-light);
|
||||
}
|
||||
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
|
@ -94,6 +100,20 @@ button {
|
|||
border: none;
|
||||
}
|
||||
|
||||
figure, picture, img {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.link-block {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#site-header {
|
||||
height: var(--header-h);
|
||||
width: 100vw;
|
||||
|
|
@ -564,6 +584,13 @@ span.controls::after {
|
|||
height: 70px;
|
||||
}
|
||||
|
||||
.team .member img {
|
||||
width: 60px;
|
||||
aspect-ratio: 1/1;
|
||||
background-color: #cfcfcf;
|
||||
border-radius: var(--radius-img);
|
||||
}
|
||||
|
||||
.page-header {
|
||||
margin-top: calc(var(--spacing) * 3);
|
||||
margin-bottom: calc(var(--spacing) * 2);
|
||||
|
|
@ -573,6 +600,10 @@ span.controls::after {
|
|||
font-family: var(--font-title);
|
||||
}
|
||||
|
||||
.page-content {
|
||||
font-size: var(--fs-medium);
|
||||
}
|
||||
|
||||
.item-nav {
|
||||
border: 1.5px solid var(--color-txt);
|
||||
border-radius: var(--radius-btn);
|
||||
|
|
@ -583,11 +614,13 @@ span.controls::after {
|
|||
min-height: calc(var(--unit) * 5);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
cursor: pointer;
|
||||
}
|
||||
.item-nav:hover {
|
||||
background-color: var(--color-light);
|
||||
}
|
||||
.item-nav {
|
||||
cursor: pointer;
|
||||
}
|
||||
.item-nav .title {
|
||||
font-family: var(--font-title);
|
||||
font-size: 1.4rem;
|
||||
|
|
@ -617,90 +650,13 @@ span.controls::after {
|
|||
left: calc(var(--unit) * 0.25);
|
||||
}
|
||||
|
||||
.highlight-block {
|
||||
.home--section-tool {
|
||||
background-color: var(--color);
|
||||
border: 1px solid var(--color-txt-light);
|
||||
border-radius: var(--radius-small);
|
||||
padding: calc(var(--padding-inner) * 1.5) var(--padding-inner);
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
gap: var(--unit);
|
||||
}
|
||||
.highlight-block figure {
|
||||
width: 100%;
|
||||
max-width: 160px;
|
||||
aspect-ratio: 4/5;
|
||||
border: 1px solid var(--color-medium);
|
||||
border-radius: var(--radius-small);
|
||||
overflow: hidden;
|
||||
}
|
||||
.highlight-block figure img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
-o-object-fit: cover;
|
||||
object-fit: cover;
|
||||
}
|
||||
.highlight-block .label {
|
||||
font-weight: 600;
|
||||
margin-bottom: calc(var(--unit) * 0.5);
|
||||
/* text-decoration: 1px underline;
|
||||
text-underline-offset: 3px; */
|
||||
color: var(--color);
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
background-color: var(--color-light);
|
||||
height: var(--unit);
|
||||
padding: 0px 1ch;
|
||||
border-radius: var(--radius-btn);
|
||||
}
|
||||
.highlight-block .title {
|
||||
font-family: var(--font-title);
|
||||
font-size: 1.4rem;
|
||||
font-weight: normal;
|
||||
margin-top: 0.5em;
|
||||
margin-bottom: 0.25em;
|
||||
color: var(--color-light);
|
||||
}
|
||||
.highlight-block .details {
|
||||
margin-bottom: calc(var(--unit) * 0.75);
|
||||
color: var(--color-light);
|
||||
font-weight: 500;
|
||||
}
|
||||
.highlight-block .content {
|
||||
position: relative;
|
||||
}
|
||||
.highlight-block .see-more {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
font-size: var(--fs-small);
|
||||
--hover-bg: var(--color);
|
||||
}
|
||||
|
||||
#home__livrets {
|
||||
--color: var(--color-violet);
|
||||
--color-medium: var(--color-violet-medium);
|
||||
--color-light: var(--color-violet-light);
|
||||
background-color: var(--color);
|
||||
.home--section-tool[data-type=base-connaissance], .home--section-tool[data-type=livrets] {
|
||||
color: var(--white);
|
||||
}
|
||||
|
||||
#home__animations {
|
||||
--color: var(--color-yellow);
|
||||
--color-medium: var(--color-yellow-medium);
|
||||
--color-light: var(--color-yellow-light);
|
||||
background-color: var(--color);
|
||||
color: var(--color-txt);
|
||||
}
|
||||
|
||||
#home__base-connaissance {
|
||||
--color: var(--color-orange);
|
||||
--color-medium: var(--color-orange-medium);
|
||||
--color-light: var(--color-orange-light);
|
||||
background-color: var(--color);
|
||||
}
|
||||
|
||||
#main_home {
|
||||
--max-w-home: 1100px;
|
||||
}
|
||||
|
|
@ -745,7 +701,6 @@ span.controls::after {
|
|||
#home__hero {
|
||||
margin-bottom: 0;
|
||||
padding-bottom: calc(var(--unit) * 1.5) !important;
|
||||
/* button{ display: none;} */
|
||||
}
|
||||
#home__hero .section--inner {
|
||||
display: block;
|
||||
|
|
@ -758,6 +713,9 @@ span.controls::after {
|
|||
margin-bottom: calc(var(--unit) * 1.5);
|
||||
color: var(--color);
|
||||
}
|
||||
#home__hero {
|
||||
/* button{ display: none;} */
|
||||
}
|
||||
#home__hero .description {
|
||||
font-size: var(--fs-medium);
|
||||
max-width: 48ch;
|
||||
|
|
@ -857,12 +815,14 @@ span.controls::after {
|
|||
overflow-y: scroll;
|
||||
scrollbar-width: none;
|
||||
-ms-overflow-style: none;
|
||||
margin-top: calc(var(--spacing) * 4);
|
||||
margin-bottom: calc(var(--spacing) * 4);
|
||||
}
|
||||
.slideshow-scroll::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
.slideshow-scroll {
|
||||
margin-top: calc(var(--spacing) * 4);
|
||||
margin-bottom: calc(var(--spacing) * 4);
|
||||
}
|
||||
.slideshow-scroll .slideshow-scroll__warpper {
|
||||
padding-left: var(--padding-body);
|
||||
display: flex;
|
||||
|
|
@ -941,12 +901,6 @@ span.controls::after {
|
|||
font-weight: 500;
|
||||
}
|
||||
|
||||
.species-list .taxon {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background-color: var(--color-green-light);
|
||||
padding: 20px;
|
||||
}
|
||||
.species-list .taxon .btn-edit {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
|
|
@ -975,6 +929,13 @@ span.controls::after {
|
|||
.species-list .taxon .chart-edit, .species-list .taxon .btn-edit {
|
||||
display: none;
|
||||
}
|
||||
.species-list .taxon {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
background-color: var(--color-green-light);
|
||||
padding: 20px;
|
||||
}
|
||||
.species-list .taxon .vernacular {
|
||||
order: 1;
|
||||
}
|
||||
|
|
@ -989,8 +950,6 @@ span.controls::after {
|
|||
aspect-ratio: 1;
|
||||
overflow: hidden;
|
||||
flex-shrink: 0;
|
||||
border-radius: var(--radius-img);
|
||||
overflow: hidden;
|
||||
}
|
||||
.species-list .taxon figure img {
|
||||
width: 100%;
|
||||
|
|
@ -998,6 +957,10 @@ span.controls::after {
|
|||
-o-object-fit: cover;
|
||||
object-fit: cover;
|
||||
}
|
||||
.species-list .taxon figure {
|
||||
border-radius: var(--radius-img);
|
||||
overflow: hidden;
|
||||
}
|
||||
.species-list .taxon .vernacular {
|
||||
background-color: var(--color-green);
|
||||
color: white;
|
||||
|
|
@ -1005,12 +968,21 @@ span.controls::after {
|
|||
padding: 4px 1ch;
|
||||
margin-bottom: calc(var(--spacing) * 0.25);
|
||||
}
|
||||
.species-list .taxon .vernacular a {
|
||||
color: white;
|
||||
text-decoration: none;
|
||||
}
|
||||
.species-list .taxon .latin {
|
||||
font-weight: normal;
|
||||
font-weight: 500;
|
||||
font-style: italic;
|
||||
margin-bottom: calc(var(--spacing) * 0.75);
|
||||
color: var(--color-txt);
|
||||
}
|
||||
.species-list .taxon .vernacular, .species-list .taxon .latin {
|
||||
text-align: center;
|
||||
}
|
||||
.species-list .taxon:hover {
|
||||
outline: 2px solid var(--color-green);
|
||||
background-color: var(--color-green-medium);
|
||||
}/*# sourceMappingURL=style.css.map */
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -6,17 +6,19 @@
|
|||
@use "css/site-header";
|
||||
@use "css/site-nav";
|
||||
@use "css/site-footer";
|
||||
@use "css/buttons";
|
||||
@use "css/see-more";
|
||||
@use "css/slideshow";
|
||||
@use "css/logos-container";
|
||||
@use "css/components/buttons";
|
||||
@use "css/components/see-more";
|
||||
@use "css/components/slideshow";
|
||||
@use "css/components/logos-container";
|
||||
@use "css/components/team";
|
||||
|
||||
|
||||
@use "css/page-header";
|
||||
@use "css/page-content";
|
||||
|
||||
@use "css/home-item-nav";
|
||||
@use "css/home-highlight";
|
||||
@use "css/home";
|
||||
|
||||
@use "css/species-list";
|
||||
@use "css/taxon-card";
|
||||
@use "css/components/species-list";
|
||||
@use "css/components/taxon-card";
|
||||
|
||||
|
|
|
|||
|
|
@ -4,8 +4,8 @@
|
|||
|
||||
<a class="nav-level-1_link" href="#">Le projet <span class="arrow"><include src="/components/icons/arrow-dropdown.svg"></include></span></a>
|
||||
<ul class="nav-level-2_ul">
|
||||
<li class="nav-level-2_li"><a class="nav-level-2_link" href="#">À propos</a></li>
|
||||
<li class="nav-level-2_li"><a class="nav-level-2_link" href="#">Équipe</a></li>
|
||||
<li class="nav-level-2_li"><a class="nav-level-2_link" href="/a-propos.html">À propos</a></li>
|
||||
<li class="nav-level-2_li"><a class="nav-level-2_link" href="/a-propos.html#equipe">Équipe</a></li>
|
||||
<li class="nav-level-2_li"><a class="nav-level-2_link" href="#">Communauté</a></li>
|
||||
<li class="nav-level-2_li"><a class="nav-level-2_link" href="#">Publications</a></li>
|
||||
<li class="nav-level-2_li"><a class="nav-level-2_link" href="#">Crédits et partenaires</a></li>
|
||||
|
|
|
|||
BIN
images/methodologie-shema.webp
Normal file
BIN
images/methodologie-shema.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 194 KiB |
1349
index.html
1349
index.html
File diff suppressed because it is too large
Load diff
|
|
@ -46,14 +46,15 @@
|
|||
<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>
|
||||
<h3 class="vernacular"><a href="#" target="_blank">Acore odorant</a></h3>
|
||||
<p class="latin">Acorus calamus L.</p>
|
||||
|
||||
<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>
|
||||
<a class="link-block" href="#" target="_blank"></a>
|
||||
</article>
|
||||
|
||||
</div>
|
||||
|
|
@ -77,22 +78,23 @@
|
|||
<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>
|
||||
<h3 class="vernacular"><a href="#" target="_blank">Acore odorant</a></h3>
|
||||
<p class="latin">Acorus calamus L.</p>
|
||||
|
||||
<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>
|
||||
<a class="link-block" href="#" target="_blank"></a>
|
||||
</article>
|
||||
|
||||
<article class="taxon">
|
||||
<figure>
|
||||
<img src="/images/Alnus_glutinosa_morphology_outlook_illustration_photo.jpeg">
|
||||
</figure>
|
||||
<h3 class="vernacular">Aulne glutineux</h3>
|
||||
<h4 class="latin">Alnus glutinosa</h4>
|
||||
<h3 class="vernacular"><a href="#" target="_blank">Aulne glutineux</a></h3>
|
||||
<p class="latin">Alnus glutinosa</p>
|
||||
|
||||
<div class="chart-edit">
|
||||
<abbr title="Rempli à 100 % (21 / 21) et vérifié à 90 % (19 / 21)"><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 0 0 50 100 A 50 50 0 0 0 50 0"></path><path xmlns="http://www.w3.org/2000/svg" class="verified" d="M 50 0 A 50 50 0 1 1 21.834 8.68806 L 50 50 Z"></path></svg></abbr>
|
||||
|
|
@ -101,14 +103,15 @@
|
|||
<button class="btn-edit">
|
||||
<include src="/components/icons/edit.svg"></include>
|
||||
</button>
|
||||
<a class="link-block" href="#" target="_blank"></a>
|
||||
</article>
|
||||
|
||||
<article class="taxon">
|
||||
<figure>
|
||||
<img src="/images/Arum_italicum_morphology_outlook_illustration_photo.png">
|
||||
</figure>
|
||||
<h3 class="vernacular">Gouet d’Italie</h3>
|
||||
<h4 class="latin">Arum Italicum Mill.</h4>
|
||||
<h3 class="vernacular"><a href="#" target="_blank">Gouet d'Italie</a></h3>
|
||||
<p class="latin">Arum Italicum Mill.</p>
|
||||
|
||||
<div class="chart-edit">
|
||||
<abbr title="Rempli à 95 % (22 / 23) et vérifié à 82 % (19 / 23)"><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 36.5102 1.85414 L 50 50 Z"></path><path xmlns="http://www.w3.org/2000/svg" class="verified" d="M 50 0 A 50 50 0 1 1 5.60574 26.9967 L 50 50 Z"></path></svg></abbr>
|
||||
|
|
@ -117,6 +120,7 @@
|
|||
<button class="btn-edit">
|
||||
<include src="/components/icons/edit.svg"></include>
|
||||
</button>
|
||||
<a class="link-block" href="#" target="_blank"></a>
|
||||
</article>
|
||||
|
||||
<article class="taxon">
|
||||
|
|
@ -124,7 +128,7 @@
|
|||
<img src="/images/Ballota_nigra_morphology_outlook_illustration_photo.jpeg">
|
||||
</figure>
|
||||
<h3 class="vernacular">Charme commun</h3>
|
||||
<h4 class="latin">Carpinus betulus L.</h4>
|
||||
<p class="latin">Carpinus betulus L.</p>
|
||||
|
||||
<div class="chart-edit">
|
||||
<abbr title="Rempli à 0 % (0 / 5) et vérifié à 0 % (0 / 5)"><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 0 1 50 0 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>
|
||||
|
|
@ -133,28 +137,30 @@
|
|||
<button class="btn-edit">
|
||||
<include src="/components/icons/edit.svg"></include>
|
||||
</button>
|
||||
<a class="link-block" href="#" target="_blank"></a>
|
||||
</article>
|
||||
|
||||
<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>
|
||||
<h3 class="vernacular"><a href="#" target="_blank">Acore odorant</a></h3>
|
||||
<p class="latin">Acorus calamus L.</p>
|
||||
|
||||
<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>
|
||||
<a class="link-block" href="#" target="_blank"></a>
|
||||
</article>
|
||||
|
||||
<article class="taxon">
|
||||
<figure>
|
||||
<img src="/images/Alnus_glutinosa_morphology_outlook_illustration_photo.jpeg">
|
||||
</figure>
|
||||
<h3 class="vernacular">Aulne glutineux</h3>
|
||||
<h4 class="latin">Alnus glutinosa</h4>
|
||||
<h3 class="vernacular"><a href="#" target="_blank">Aulne glutineux</a></h3>
|
||||
<p class="latin">Alnus glutinosa</p>
|
||||
|
||||
<div class="chart-edit">
|
||||
<abbr title="Rempli à 100 % (21 / 21) et vérifié à 90 % (19 / 21)"><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 0 0 50 100 A 50 50 0 0 0 50 0"></path><path xmlns="http://www.w3.org/2000/svg" class="verified" d="M 50 0 A 50 50 0 1 1 21.834 8.68806 L 50 50 Z"></path></svg></abbr>
|
||||
|
|
@ -163,14 +169,15 @@
|
|||
<button class="btn-edit">
|
||||
<include src="/components/icons/edit.svg"></include>
|
||||
</button>
|
||||
<a class="link-block" href="#" target="_blank"></a>
|
||||
</article>
|
||||
|
||||
<article class="taxon">
|
||||
<figure>
|
||||
<img src="/images/Arum_italicum_morphology_outlook_illustration_photo.png">
|
||||
</figure>
|
||||
<h3 class="vernacular">Gouet d’Italie</h3>
|
||||
<h4 class="latin">Arum Italicum Mill.</h4>
|
||||
<h3 class="vernacular"><a href="#" target="_blank">Gouet d'Italie</a></h3>
|
||||
<p class="latin">Arum Italicum Mill.</p>
|
||||
|
||||
<div class="chart-edit">
|
||||
<abbr title="Rempli à 95 % (22 / 23) et vérifié à 82 % (19 / 23)"><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 36.5102 1.85414 L 50 50 Z"></path><path xmlns="http://www.w3.org/2000/svg" class="verified" d="M 50 0 A 50 50 0 1 1 5.60574 26.9967 L 50 50 Z"></path></svg></abbr>
|
||||
|
|
@ -179,6 +186,7 @@
|
|||
<button class="btn-edit">
|
||||
<include src="/components/icons/edit.svg"></include>
|
||||
</button>
|
||||
<a class="link-block" href="#" target="_blank"></a>
|
||||
</article>
|
||||
|
||||
<article class="taxon">
|
||||
|
|
@ -186,7 +194,7 @@
|
|||
<img src="/images/Ballota_nigra_morphology_outlook_illustration_photo.jpeg">
|
||||
</figure>
|
||||
<h3 class="vernacular">Charme commun</h3>
|
||||
<h4 class="latin">Carpinus betulus L.</h4>
|
||||
<p class="latin">Carpinus betulus L.</p>
|
||||
|
||||
<div class="chart-edit">
|
||||
<abbr title="Rempli à 0 % (0 / 5) et vérifié à 0 % (0 / 5)"><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 0 1 50 0 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>
|
||||
|
|
@ -195,6 +203,7 @@
|
|||
<button class="btn-edit">
|
||||
<include src="/components/icons/edit.svg"></include>
|
||||
</button>
|
||||
<a class="link-block" href="#" target="_blank"></a>
|
||||
</article>
|
||||
|
||||
|
||||
|
|
@ -217,22 +226,23 @@
|
|||
<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>
|
||||
<h3 class="vernacular"><a href="#" target="_blank">Acore odorant</a></h3>
|
||||
<p class="latin">Acorus calamus L.</p>
|
||||
|
||||
<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>
|
||||
<a class="link-block" href="#" target="_blank"></a>
|
||||
</article>
|
||||
|
||||
<article class="taxon">
|
||||
<figure>
|
||||
<img src="/images/Alnus_glutinosa_morphology_outlook_illustration_photo.jpeg">
|
||||
</figure>
|
||||
<h3 class="vernacular">Aulne glutineux</h3>
|
||||
<h4 class="latin">Alnus glutinosa</h4>
|
||||
<h3 class="vernacular"><a href="#" target="_blank">Aulne glutineux</a></h3>
|
||||
<p class="latin">Alnus glutinosa</p>
|
||||
|
||||
<div class="chart-edit">
|
||||
<abbr title="Rempli à 100 % (21 / 21) et vérifié à 90 % (19 / 21)"><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 0 0 50 100 A 50 50 0 0 0 50 0"></path><path xmlns="http://www.w3.org/2000/svg" class="verified" d="M 50 0 A 50 50 0 1 1 21.834 8.68806 L 50 50 Z"></path></svg></abbr>
|
||||
|
|
@ -241,14 +251,15 @@
|
|||
<button class="btn-edit">
|
||||
<include src="/components/icons/edit.svg"></include>
|
||||
</button>
|
||||
<a class="link-block" href="#" target="_blank"></a>
|
||||
</article>
|
||||
|
||||
<article class="taxon">
|
||||
<figure>
|
||||
<img src="/images/Arum_italicum_morphology_outlook_illustration_photo.png">
|
||||
</figure>
|
||||
<h3 class="vernacular">Gouet d’Italie</h3>
|
||||
<h4 class="latin">Arum Italicum Mill.</h4>
|
||||
<h3 class="vernacular"><a href="#" target="_blank">Gouet d'Italie</a></h3>
|
||||
<p class="latin">Arum Italicum Mill.</p>
|
||||
|
||||
<div class="chart-edit">
|
||||
<abbr title="Rempli à 95 % (22 / 23) et vérifié à 82 % (19 / 23)"><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 36.5102 1.85414 L 50 50 Z"></path><path xmlns="http://www.w3.org/2000/svg" class="verified" d="M 50 0 A 50 50 0 1 1 5.60574 26.9967 L 50 50 Z"></path></svg></abbr>
|
||||
|
|
@ -257,6 +268,7 @@
|
|||
<button class="btn-edit">
|
||||
<include src="/components/icons/edit.svg"></include>
|
||||
</button>
|
||||
<a class="link-block" href="#" target="_blank"></a>
|
||||
</article>
|
||||
|
||||
<article class="taxon">
|
||||
|
|
@ -264,7 +276,7 @@
|
|||
<img src="/images/Ballota_nigra_morphology_outlook_illustration_photo.jpeg">
|
||||
</figure>
|
||||
<h3 class="vernacular">Charme commun</h3>
|
||||
<h4 class="latin">Carpinus betulus L.</h4>
|
||||
<p class="latin">Carpinus betulus L.</p>
|
||||
|
||||
<div class="chart-edit">
|
||||
<abbr title="Rempli à 0 % (0 / 5) et vérifié à 0 % (0 / 5)"><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 0 1 50 0 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>
|
||||
|
|
@ -273,28 +285,30 @@
|
|||
<button class="btn-edit">
|
||||
<include src="/components/icons/edit.svg"></include>
|
||||
</button>
|
||||
<a class="link-block" href="#" target="_blank"></a>
|
||||
</article>
|
||||
|
||||
<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>
|
||||
<h3 class="vernacular"><a href="#" target="_blank">Acore odorant</a></h3>
|
||||
<p class="latin">Acorus calamus L.</p>
|
||||
|
||||
<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>
|
||||
<a class="link-block" href="#" target="_blank"></a>
|
||||
</article>
|
||||
|
||||
<article class="taxon">
|
||||
<figure>
|
||||
<img src="/images/Alnus_glutinosa_morphology_outlook_illustration_photo.jpeg">
|
||||
</figure>
|
||||
<h3 class="vernacular">Aulne glutineux</h3>
|
||||
<h4 class="latin">Alnus glutinosa</h4>
|
||||
<h3 class="vernacular"><a href="#" target="_blank">Aulne glutineux</a></h3>
|
||||
<p class="latin">Alnus glutinosa</p>
|
||||
|
||||
<div class="chart-edit">
|
||||
<abbr title="Rempli à 100 % (21 / 21) et vérifié à 90 % (19 / 21)"><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 0 0 50 100 A 50 50 0 0 0 50 0"></path><path xmlns="http://www.w3.org/2000/svg" class="verified" d="M 50 0 A 50 50 0 1 1 21.834 8.68806 L 50 50 Z"></path></svg></abbr>
|
||||
|
|
@ -303,14 +317,15 @@
|
|||
<button class="btn-edit">
|
||||
<include src="/components/icons/edit.svg"></include>
|
||||
</button>
|
||||
<a class="link-block" href="#" target="_blank"></a>
|
||||
</article>
|
||||
|
||||
<article class="taxon">
|
||||
<figure>
|
||||
<img src="/images/Arum_italicum_morphology_outlook_illustration_photo.png">
|
||||
</figure>
|
||||
<h3 class="vernacular">Gouet d’Italie</h3>
|
||||
<h4 class="latin">Arum Italicum Mill.</h4>
|
||||
<h3 class="vernacular"><a href="#" target="_blank">Gouet d'Italie</a></h3>
|
||||
<p class="latin">Arum Italicum Mill.</p>
|
||||
|
||||
<div class="chart-edit">
|
||||
<abbr title="Rempli à 95 % (22 / 23) et vérifié à 82 % (19 / 23)"><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 36.5102 1.85414 L 50 50 Z"></path><path xmlns="http://www.w3.org/2000/svg" class="verified" d="M 50 0 A 50 50 0 1 1 5.60574 26.9967 L 50 50 Z"></path></svg></abbr>
|
||||
|
|
@ -319,6 +334,7 @@
|
|||
<button class="btn-edit">
|
||||
<include src="/components/icons/edit.svg"></include>
|
||||
</button>
|
||||
<a class="link-block" href="#" target="_blank"></a>
|
||||
</article>
|
||||
|
||||
<article class="taxon">
|
||||
|
|
@ -326,7 +342,7 @@
|
|||
<img src="/images/Ballota_nigra_morphology_outlook_illustration_photo.jpeg">
|
||||
</figure>
|
||||
<h3 class="vernacular">Charme commun</h3>
|
||||
<h4 class="latin">Carpinus betulus L.</h4>
|
||||
<p class="latin">Carpinus betulus L.</p>
|
||||
|
||||
<div class="chart-edit">
|
||||
<abbr title="Rempli à 0 % (0 / 5) et vérifié à 0 % (0 / 5)"><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 0 1 50 0 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>
|
||||
|
|
@ -335,6 +351,7 @@
|
|||
<button class="btn-edit">
|
||||
<include src="/components/icons/edit.svg"></include>
|
||||
</button>
|
||||
<a class="link-block" href="#" target="_blank"></a>
|
||||
</article>
|
||||
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue