Commit c7f8bac2 authored by Lionel's avatar Lionel
Browse files

Mise en page

parent 6625a2bb
......@@ -68,7 +68,12 @@ html {
color: #ff6384;
}
footer .crater-container-width h2 {
.crater-footer-width {
max-width: 950px;
}
footer h2 {
margin-top: 0em;
font-family: AvenirNext;
font-size: 26px;
......@@ -225,10 +230,10 @@ footer a {
#crater-synthese-tableau-territoire .crater-separateur {
border-top: none !important;
border-bottom: none !important;
border-right: 2px solid #f0f0f8 !important;
border-left: 2px solid #f0f0f8 !important;
border-right: 2px solid darkgrey !important;
border-left: 2px solid darkgray !important;
min-height: 130px;
background-color: #efefef;
background-color: #ececec;
}
#crater-synthese-tableau-territoire h1 {
......@@ -241,6 +246,16 @@ footer a {
margin: 20px 0 10px 0;
}
#crater-synthese-tableau-territoire .crater-separateur h1 {
font-family: AvenirNext;
font-size: 18px;
font-weight: bold;
color: #545569;
text-align: center;
text-transform: uppercase;
margin: 20px 0 10px 0;
}
#crater-synthese-tableau-territoire h2 {
font-family: AvenirNext;
font-size: 28px;
......@@ -320,17 +335,20 @@ footer a {
summary {
margin-top: 0.5em;
margin-top: 0em;
font-family: AvenirNext;
font-size: 18 px;
/*font-weight: bold;*/
font-size: 18px;
font-weight: 500;
text-decoration: underline;
color: #545569;
}
.crater-levier {
margin-top: 1em;
font-family: AvenirNext;
font-size: 20px;
font-size: 22px;
font-weight: bold;
text-decoration: none;
color: #ff6384;
}
......@@ -365,6 +383,8 @@ summary {
}
#sectionArtificialisation .crater-indicateur-artificialisation h2 {
margin-top: 0;
margin-bottom: 0.5em;
font-family: AvenirNext;
font-size: 18px;
font-weight: bold;
......@@ -377,6 +397,13 @@ summary {
text-align: center;
}
.crater-border-left-right {
border-right: 2px solid darkgrey;
border-left: 2px solid darkgrey;
}
/*}*/
......
......@@ -226,12 +226,12 @@
class="nomDepartement"></span></a>
</li>
</ul>
<div class="crater-indicateur-artificialisation row align-items-center justify-content-center">
<div class="crater-indicateur-artificialisation row align-items-center justify-content-center my-2">
<div class="col">
<h1><span id="indicateurArtificialisationHa"></span> ha</h1>
<h2>artificialisés pour le l'habitat</h2>
</div>
<div class="col">
<div class="col crater-border-left-right">
<h1><span id="indicateurArtificialisationMenages"></span></h1>
<h2>ménages sur le territoire</h2>
</div>
......@@ -243,7 +243,7 @@
</div>
<details>
<summary>Comment lire ce tableau ?</summary>
<summary>Comment lire ce tableau...</summary>
<p>Ce tableau présente l’évolution de trois paramètres sur la décennie 2007-2017 :
<ul>
<li>la surface artificialisée pour construire des logements ;</li>
......@@ -255,11 +255,11 @@
tout de même construits : cette dynamique est souvent symptomatique d’un abandon du centre-ville au profit
de banlieues pavillonnaires.
</p>
<p>Plus de détails sur les sources de données et les règles de calcul dans <a href="sources.html" target="_blank">cette page</a>.</p>
</details>
<h2>Objectif : "zéro artificialisation nette"</h2>
<p><b>Pour préserver ces terres agricoles fertiles, les collectivités doivent se fixer un objectif de « zéro
artificialisation nette ».</b></p>
......@@ -385,7 +385,7 @@
</li>
</ul>
<div class="crater-chart-container mx-auto">
<canvas id="chart-besoins" width="600" height="600"></canvas>
<canvas id="chart-besoins" width="600" height="400"></canvas>
</div>
</div>
<details>
......@@ -394,6 +394,7 @@
pourraient théoriquement être couverts par la production agricole locale. Une meilleure adéquation
entre besoins et production est associée à une meilleure autonomie alimentaire, à une plus grande
diversité de cultures, et donc à une meilleure résilience de la production alimentaire.</p>
<p>Plus de détails sur les sources de données et les règles de calcul dans <a href="sources.html" target="_blank">cette page</a>.</p>
</details>
<h2>Objectif : redévelopper une agriculture nourricière</h2>
......@@ -479,7 +480,7 @@
</li>
</ul>
<div class="crater-chart-container-small mx-auto">
<canvas id="chart-hvn" width="600" height="600"></canvas>
<canvas id="chart-hvn" width="600" height="500"></canvas>
</div>
</div>
......@@ -496,6 +497,7 @@
permanentes.
</li>
</ul>
<p>Plus de détails sur les sources de données et les règles de calcul dans <a href="sources.html" target="_blank">cette page</a>.</p>
</p>
</details>
......@@ -564,7 +566,7 @@
</li>
</ul>
<div class="crater-chart-container-small mx-auto">
<canvas id="chart-sau" width="600" height="600"></canvas>
<canvas id="chart-sau" width="400px" height="300px"></canvas>
</div>
</div>
<details>
......@@ -573,6 +575,7 @@
collectivités. A titre comparatif, l’agriculture biologique représente en moyenne 7,5 % des sols
agricoles à l’échelle nationale. Un objectif de 15 % est fixé par le gouvernement à horizon
2022.</p>
<p>Plus de détails sur les sources de données et les règles de calcul dans <a href="sources.html" target="_blank">cette page</a>.</p>
</details>
<h2>Objectifs : Développer l’agriculture biologique</h2>
<p>Il est en fondamental de diminuer notre dépendance aux intrants :
......@@ -615,9 +618,9 @@
</main>
<footer class="mt-4 p-3 bg-bleu-clair">
<div class="crater-container-width mx-auto">
<h2>Aller plus loin avec notre guide :</h2>
<p><a href="http://resiliencealimentaire.org">VERS LA RÉSILIENCE ALIMENTAIRE,<br>Faire face aux menaces globales à l'échelle des territoires</a></p>
<div class="mx-auto crater-footer-width">
<h2>Aller plus loin en téléchargeant notre guide :</h2>
<p><a href="http://resiliencealimentaire.org">VERS LA RÉSILIENCE ALIMENTAIRE,Faire face aux menaces globales à l'échelle des territoires</a></p>
<p>Ce guide expose les vulnérabilités du système alimentaire contemporain face à différentes crises systémiques : changement climatique, épuisement des ressources, effondrement de la biodiversité…</p>
<p>LES GRENIERS D’ABONDANCE, Association loi 1901. Mentions Légales</p>
</div>
......
......@@ -203,15 +203,18 @@ function chargerDonneesArtificialisation(codeInseeTerritoire, artificialisation,
function majChartArtificialisation(artificialisation) {
$("#indicateurArtificialisationHa").html(artificialisation.artificialisationVersHabitatHa.toFixed(0))
if (artificialisation.variationNbMenages < 0) {
$("#indicateurArtificialisationMenages").html(artificialisation.variationNbMenages.toFixed(0))
} else {
$("#indicateurArtificialisationMenages").html("+ " + artificialisation.variationNbMenages.toFixed(0))
}
if (artificialisation.variationNbMenages < 0 && artificialisation.artificialisationVersHabitatHa > 0) {
$("#indicateurArtificialisationBilan").html("<h1 class='crater-indicateur-artificialisation-warning'>L'artificialisation croît alors que la population baisse !</h1>")
$("#indicateurArtificialisationMenages").html(artificialisation.variationNbMenages.toFixed(0))
} else if (artificialisation.variationNbMenages >= 0 && artificialisation.artificialisationVersHabitatHa > 0) {
$("#indicateurArtificialisationMenages").html("+ " + artificialisation.variationNbMenages.toFixed(0))
surfaceParMenage = 10000 * artificialisation.artificialisationVersHabitatHa / artificialisation.variationNbMenages;
$("#indicateurArtificialisationBilan").html("<h1>" + surfaceParMenage.toFixed(0) + " m2</h1><h2>artificialisé par ménage</h2>")
} else {
$("#indicateurArtificialisationBilan").html("<h1>Artificialisation en baisse, bravo !</h1>")
$("#indicateurArtificialisationBilan").html("<h1 class='crater-indicateur-artificialisation-warning'>Artificialisation en baisse, bravo !</h1>")
}
}
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment