Compare commits

..

53 Commits
v1.3 ... master

Author SHA1 Message Date
5e75c072c1 Correction des métadonnées 2024-12-04 10:01:31 +01:00
f0cc96684f Correction des métadonnées 2024-12-04 10:00:40 +01:00
c08146134c Correction email 2024-08-18 19:36:55 +02:00
8d9d8df85e Modifications + nouveau poste 2024-07-11 19:09:36 +02:00
37d4fe3f38 Mise à jour des actualités 2024-04-07 21:04:07 +02:00
715b1c2962 Correction de la couleur de TitleBar en mode mobile 2023-12-17 09:44:34 +01:00
38e4e4442e Mises à jour diverses 2023-12-01 17:35:13 +01:00
80e1d4cac2 Modification de l'adresse des statistiques 2023-11-20 21:44:40 +01:00
f06bf79045 Modification de l'adresse du dépôt git 2023-11-20 21:43:47 +01:00
ce44bcfc7b Suppression dossier 2023-11-20 21:42:23 +01:00
c288fd65c3 Mise à jour des actualités 2023-10-19 20:53:22 +02:00
c58bee231f Correction de l'indentation 2023-10-18 19:05:33 +02:00
17836fd225 Correction de l'indentation 2023-10-18 19:04:25 +02:00
714bd53440 Alias d'adresse email 2023-08-11 16:39:36 +02:00
edd6922edf Correction de l'année dans le copyright 2023-02-23 09:40:31 +01:00
d405699aef Mise à jour de la page Actualités 2022-12-02 15:08:33 +01:00
be58f7ee3c Ajout de mastodon + réorganisation des icônes 2022-11-02 21:07:35 +01:00
ba722498ef Ajout des textes alternatifs sur les images 2022-10-24 16:49:39 +02:00
857d14c063 Obscurcir l'adresse email 2022-10-24 16:34:50 +02:00
8be665bc03 Revert "Changement de source de tailwind"
This reverts commit 171b1fd7e2.
2022-10-22 19:22:07 +02:00
6b4b5a43fb Revert "Suppression de tailwind local"
This reverts commit 28374e7c64.
2022-10-22 19:20:45 +02:00
21696a6ee3 Ajout du loading=lazy 2022-10-22 12:00:59 +02:00
171b1fd7e2 Changement de source de tailwind 2022-10-22 11:46:28 +02:00
28374e7c64 Suppression de tailwind local 2022-10-21 22:09:28 +02:00
fa31548d1c Correction de l'OG image + légende 2022-10-08 13:19:03 +02:00
cd72b4eb75 Correction de l'âge 2022-07-12 12:18:54 +02:00
79c92e475b Correction de la version/année + ajout de twitter 2022-02-24 10:23:43 +01:00
bfd18e628a Mise à jour Matomo 2021-12-24 12:34:54 +01:00
07604b7423 Mise à jour de Matomo 2021-12-24 12:31:47 +01:00
0b56f89d5b Mise à jour Matomo 2021-12-24 12:26:13 +01:00
0e7fd8bc1c Mise à jour de l'analyseur 2021-12-19 22:50:57 +01:00
baa8ba4d0f Mise à jour de 'assets/css/tailwind.css' 2021-12-17 22:01:36 +01:00
0663f009fb Update tailwind.css 2021-12-17 09:13:24 +01:00
df864de28e Mise à jour des liens PHP 2021-12-14 16:12:08 +01:00
30fcf05297 Mise à jour d'ACTUALITÉ 2021-12-14 16:07:31 +01:00
117d025460 Mise à jour du lien vers ACTUALITÉ 2021-12-14 15:57:22 +01:00
b607185102 Mise à jour de 'ACTUALITE/index.php' 2021-12-14 15:55:49 +01:00
aef8c035b2 Version automatique 2021-12-14 15:52:18 +01:00
64a3c1ed3b Mise à jour de 'backup/ACTUALITE.html' 2021-12-14 15:46:57 +01:00
1d232e8676 Mise à jour de 'backup/index.html' 2021-12-14 15:46:36 +01:00
854210e2a9 Suppression librairie SASS 2021-12-14 15:43:20 +01:00
24204cdec0 Passage au PHP 2021-12-14 15:40:53 +01:00
4ad75f4fc6 Passage à PHP 2021-12-14 15:34:55 +01:00
8f08f87772 Mise à jour de 'bckp-index.html' 2021-12-14 15:07:17 +01:00
1c832f5409 Création des fichiers php 2021-12-14 15:06:21 +01:00
ae38f37390 Mise à jour de l'actualité 2021-12-14 14:18:25 +01:00
620183ff78 Update tailwind.css 2021-12-14 08:24:11 +01:00
4f75033344 Ajout d'icônes + quelques corrections 2021-12-12 17:11:16 +01:00
3f54c0585a Mise à jour de la page d'actualité
Changement de format + traduction grands titres commentaires html + ajout d'images + suppression des fichiers RStudio + mise à jour du README
2021-12-12 16:27:57 +01:00
0a13df2f63 Mise à jour de l'actualité 2021-12-07 17:28:16 +01:00
59be2c030f Adaptation du contenu
Correction diverses, amélioration des tailles d'éléments
2021-12-07 17:16:22 +01:00
65f001a5d7 Inversion liens de bas de page + version 2021-12-04 12:04:34 +01:00
5322a9ae29 Correction des liens de bas de page 2021-12-04 12:00:46 +01:00
23 changed files with 176125 additions and 3425 deletions

5
.gitignore vendored
View File

@ -1,4 +1 @@
.Rproj.user *.pptx
.Rhistory
.RData
.Ruserdata

View File

@ -1,130 +0,0 @@
<!DOCTYPE HTML>
<!-- Vous visitez mon code ? 😇 Vous pouvez le visualiser bien plus facilement directement ici : https://git.adriencharbonneau.fr/Adrien/Site-internet
Bonne lecture ! -->
<html>
<head>
</script>
<title>Adrien CHARBONNEAU Naturaliste écologue</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<meta name="description" content="Site de présentation d'Adrien CHARBONNEAU - Naturaliste écologue et ornithologue passionné.">
<meta name="author" content="Adrien CHARBONNEAU">
<meta property="og:title" content="Adrien CHARBONNEAU Naturaliste écologue" />
<meta property="og:image" content="https://adriencharbonneau.fr/images/avatar.jpg" />
<meta property="og:url" content="https://adriencharbonneau.fr" />
<meta property="og:description" content="Site de présentation d'Adrien CHARBONNEAU - Naturaliste écologue et ornithologue passionné." />
<meta property="og:nom_du_site" content="Adrien CHARBONNEAU Naturaliste écologue"/>
<link rel="stylesheet" href="assets/css/main.css" />
<link rel="icon" type="image/png" href="images/AC_favicon.png" />
<!-- Matomo -->
<script>
var _paq = window._paq = window._paq || [];
/* tracker methods like "setCustomDimension" should be called before "trackPageView" */
_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
(function() {
var u="//stat.adriencharbonneau.fr/";
_paq.push(['setTrackerUrl', u+'matomo.php']);
_paq.push(['setSiteId', '1']);
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
})();
</script>
<!-- End Matomo Code -->
</head>
<body class="is-preload">
<section>
<div class="container">
<header class="major">
<h2 id="logo">Actualité</h2>
<p>Mes projets, études, suivis ou intérêts du moment.</p>
</header>
</div>
</section>
<section>
<div class="container">
<sup>Date de mise à jour de la page : 31/08/2021</sup>
</div>
</section>
<section>
<div class="container">
<blockquote>Un peu plus de détails sur mes compétences : <a href="index.html" class="button small">- PRÉSENTATION -</a></blockquote>
</div>
</section>
<section>
<div class="container">
<div class="features">
<article>
<a class="image"><img src="images/SYNERGIS.jpg" alt="" /></a>
<div class="inner">
<h4>PROFESSIONNEL</h4>
<ul class="alt">
<li>Chargé d'études ornithologiques (et naturalistes en général) chez <a href="https://synergis-environnement.com/">Synergis Environnement</a>.</li>
</ul>
</div>
</article>
<article>
<a class="image"><img src="images/BAGUAGE.jpg" alt="" /></a>
<div class="inner">
<h4>NATURALISME</h4>
<ul class="alt">
<li>Identification des Cigales de France (<i>Cicadinae</i>, <i>Cicadettinae</i>, <i>Tibicininae</i>)</li>
<li>Suivi de la migration nocturne (dépôt d'un enregistreur / analyse)</li>
<li>Baguage ornithologique (en particulier programmes <a href="https://crbpo.mnhn.fr/IMG/pdf/protocole_pheno_v1_7.pdf">PHENO</a> et <a href="https://crbpo.mnhn.fr/IMG/pdf/protocole_sejour_v1_7.pdf">SEJOUR</a> du <a href="https://crbpo.mnhn.fr/">CRBPO</a>)</li>
<li><a href="https://www.vigienature.fr/fr/observatoires/suivi-temporel-oiseaux-communs-stoc/detail-protocole-3362">STOC EPS (printemps 2021)</a></li>
<li><a href="https://oiseauxdefrance.org/get-involved/epoc-odf">EPOC - ODF (printemps 2021)</a></li>
</ul>
</div>
</article>
<article>
<a class="image"><img src="images/NBM.jpg" alt="" /></a>
<div class="inner">
<h4>PROJETS</h4>
<ul class="alt">
<li>Construction d'un site web personnel et des services associés (serveur, applications web, etc...) - <a href="https://git.adriencharbonneau.fr/Adrien/Site-internet"><b>accès à l'évolution du projet</b></a></li>
<li><a href="https://gitlab.com/nbm.challenge/nbm-nocturnal-bird-migration">Nocturnal Bird Migration</a></li>
<li><a href="https://laboratoireparallele.com/2020/04/17/silent%c2%b7cities-paysages-sonores-dun-monde-confine/">Silent-Cities</a></li>
</ul>
</div>
</article>
</div>
</div>
</section>
<!-- Footer -->
<section id="footer">
<div class="container">
<ul class="copyright">
<li>&copy; Adrien CHARBONNEAU - 2021. Tous droits réservés.</li>
<li><a href="https://git.adriencharbonneau.fr/Adrien/Site-internet" class="a_git"><img style="margin-right: .5rem; vertical-align: middle;" src="images/GIT.svg" width="25px" height="25px"><b>Version : </b><span class="git git_color1 blanc"> v1.3 </span><b> Branch : </b><span class="git git_color1 blanc"> master </span></a></li>
<li><a href="index.html">Présentation</a></li>
<li><a href="ACTUALITE.html">Actualité</a></li>
</ul>
</div>
</section>
<!-- Scripts -->
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/jquery.scrollex.min.js"></script>
<script src="assets/js/jquery.scrolly.min.js"></script>
<script src="assets/js/browser.min.js"></script>
<script src="assets/js/breakpoints.min.js"></script>
<script src="assets/js/util.js"></script>
<script src="assets/js/main.js"></script>
</body>
</html>

168
ACTUALITE/index.php Normal file
View File

@ -0,0 +1,168 @@
<!DOCTYPE HTML>
<!-- Vous visitez mon code ? 😇 Vous pouvez le visualiser bien plus facilement directement ici : https://git.charbonneau.fr/Adrien/Site-internet
Bonne lecture ! -->
<html>
<head>
</script>
<title>Adrien CHARBONNEAU Naturaliste écologue</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<meta name="description" content="Site de présentation d'Adrien CHARBONNEAU - Naturaliste écologue et ornithologue passionné.">
<meta name="author" content="Adrien CHARBONNEAU">
<meta property="og:title" content="Adrien CHARBONNEAU Naturaliste écologue" />
<meta property="og:image" content="https://www.adriencharbonneau.fr/images/CORSICA.jpg" />
<meta property="og:url" content="https://www.adriencharbonneau.fr" />
<meta property="og:description" content="Site de présentation d'Adrien CHARBONNEAU - Naturaliste écologue et ornithologue passionné." />
<meta property="og:nom_du_site" content="Adrien CHARBONNEAU Naturaliste écologue"/>
<meta property="og:site_name" content="Adrien CHARBONNEAU Naturaliste écologue"/>
<link rel="stylesheet" href="../assets/css/tailwind.css">
<link rel="stylesheet" href="../assets/css/main.css" />
<link rel="icon" type="image/png" href="../images/AC_favicon.png" />
<!-- Matomo : petit analyseur de visites libre et opensource -->
<script>
var _paq = window._paq = window._paq || [];
/* tracker methods like "setCustomDimension" should be called before "trackPageView" */
_paq.push(["setDocumentTitle", document.title]);
_paq.push(["setCookieDomain", "*.adriencharbonneau.fr"]);
_paq.push(["setDomains", ["*.adriencharbonneau.fr"]]);
_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
(function() {
var u="https://stats.charbonneau.fr/";
_paq.push(['setTrackerUrl', u+'matomo.php']);
_paq.push(['setSiteId', '1']);
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
})();
</script>
<!-- End Matomo Code -->
</head>
<body class="is-preload">
<?php
class Version {
public static function get() {
$tag = trim(exec('git describe --tags --abbrev=0'));
return sprintf('%s', $tag);
}
}
class DateVersion {
public static function get() {
$commitDate = new \DateTime(trim(exec('git log -n1 --pretty=%ci index.php')));
$commitDate->setTimezone(new \DateTimeZone('Europe/Paris'));
return sprintf('%s', $commitDate->format('d/m/Y à H:i:s'));
}
}
// echo 'Version du site : ' . Version::get();
?>
<section>
<div class="container">
<header class="major">
<h2 id="logo">Actualité</h2>
<p>Mes projets, études, suivis ou intérêts du moment.</p>
</header>
<div class="container"><sup>Mise à jour de la page : <?php echo DateVersion::get(); ?></sup></div>
<div class="identity">Un peu plus de détails sur mes compétences : <a href="../" class="button small">- PRÉSENTATION -</a></div><br>
</div>
</section>
<section>
<div class="p-10 grid grid-cols-1 sm:grid-cols-1 md:grid-cols-3 lg:grid-cols-3 xl:grid-cols-3 gap-5">
<!-- Première carte -->
<div class="rounded overflow-hidden shadow-lg">
<img class="w-full" src="../images/CEN_PACA.png" alt="" loading="lazy"/>
<div class="px-6 py-4">
<div class="font-bold text-xl mb-2">PROFESSIONNEL</div>
<p class="text-gray-700 text-base">
<ul class="alt">
Chargé de mission ornithologie et gestion de sites au <a href="https://cen-paca.org/">Conservatoire despaces naturels de Provence-Alpes-Côte dAzur (CEN PACA)</a> Var (83)
</ul>
</p>
</div>
<div class="px-6 pt-4 pb-2">
<span class="inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2 mb-2">#profession</span>
<span class="inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2 mb-2">#association</span>
<span class="inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2 mb-2">#emploi</span>
</div>
</div>
<!-- Seconde carte-->
<div class="rounded overflow-hidden shadow-lg">
<img class="w-full" src="../images/BAGUAGE.jpg" alt="" loading="lazy"/>
<div class="px-6 py-4">
<div class="font-bold text-xl mb-2">NATURALISME</div>
<p class="text-gray-700 text-base">
<ul class="alt">
<li>Suivi de la migration nocturne (dépôt d'un enregistreur / analyse)</li>
<!-- <li><a href="https://oiseauxdefrance.org/news/actualite-35">Suivi des rassemblements d'Œdicnèmes criards (automne 2022)</a> Corse-du-Sud (2A)</li> -->
<!-- <li><a href="https://www.vigienature.fr/fr/suivi-hivernal-des-oiseaux-communs-shoc">SHOC (hiver 2023)</a> Drôme (26)</li> -->
<!-- <li><a href="https://www.faune-france.org/index.php?m_id=1164&a=2088#FN2088">EPOC - ODF (hiver 2022)</a> Drôme (26) et Corse-du-Sud (2A)</li> -->
<li>Baguage ornithologique (en particulier programmes <a href="https://crbpo.mnhn.fr/IMG/pdf/protocole_pheno_v1_7.pdf">PHENO</a> et <a href="https://crbpo.mnhn.fr/IMG/pdf/protocole_sejour_v1_7.pdf">SEJOUR</a> du <a href="https://crbpo.mnhn.fr/">CRBPO</a>)</li>
<li><a href="https://www.vigienature.fr/fr/observatoires/suivi-temporel-oiseaux-communs-stoc/detail-protocole-3362">STOC EPS (printemps 2024)</a></li>
<!-- <li><a href="https://oiseauxdefrance.org/get-involved/epoc-odf">EPOC - ODF (printemps 2022)</a></li> -->
</ul>
</p>
</div>
<div class="px-6 pt-4 pb-2">
<span class="inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2 mb-2">#ornithologie</span>
<span class="inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2 mb-2">#passion</span>
<span class="inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2 mb-2">#science</span>
</div>
</div>
<!-- Troisième carte -->
<div class="rounded overflow-hidden shadow-lg">
<img class="w-full" src="../images/NBM.jpg" alt="" loading="lazy"/>
<div class="px-6 py-4">
<div class="font-bold text-xl mb-2">PROJETS</div>
<p class="text-gray-700 text-base">
<ul class="alt">
<li>Construction d'un site web personnel et des services associés (serveur, applications web, etc...) - <a href="https://git.charbonneau.fr/Adrien/Site-internet"><b>accès à l'évolution du projet</b></a></li>
<li><a href="https://gitlab.com/nbm.challenge/nbm-nocturnal-bird-migration">Nocturnal Bird Migration</a></li>
<li><a href="https://laboratoireparallele.com/2020/04/17/silent%c2%b7cities-paysages-sonores-dun-monde-confine/">Silent-Cities</a></li>
</ul>
</p>
</div>
<div class="px-6 pt-4 pb-2">
<span class="inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2 mb-2">#site internet</span>
<span class="inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2 mb-2">#étude</span>
<span class="inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2 mb-2">#apprentissage</span>
</div>
</div>
</div>
</section>
<!-- Pied de page -->
<section id="footer">
<div class="container">
<ul class="copyright">
<li>&copy; Adrien CHARBONNEAU - <?php echo date("Y"); ?>. Tous droits réservés.</li>
<li><a href="../">Présentation</a></li>
<li><a href="../ACTUALITE/">Actualité</a></li>
</ul>
<ul class="copyright">
<li><a href="https://git.charbonneau.fr/Adrien/Site-internet" class="a_git"><img style="margin-right: .5rem; vertical-align: middle;" src="../images/GIT.svg" width="25px" height="25px"/><b>Version : </b><span class="git git_color1 blanc"><?php echo Version::get(); ?></span><b> Branch : </b><span class="git git_color1 blanc"> master </span></a></li>
</ul>
</div>
</section>
<!-- Scripts -->
<script src="../assets/js/jquery.min.js"></script>
<script src="../assets/js/jquery.scrollex.min.js"></script>
<script src="../assets/js/jquery.scrolly.min.js"></script>
<script src="../assets/js/browser.min.js"></script>
<script src="../assets/js/breakpoints.min.js"></script>
<script src="../assets/js/util.js"></script>
<script src="../assets/js/main.js"></script>
</body>
</html>

View File

@ -1,14 +1,21 @@
# Code du site internet # Code du site internet
Dépôt git du site internet https://www.adriencharbonneau.fr Dépôt git du site internet https://www.adriencharbonneau.fr
[![Version du Site Internet](https://flat.badgen.net/badge/Site%20Internet/1.3/green?icon=git)](https://adriencharbonneau.fr/) [![Version du Site Internet](https://flat.badgen.net/badge/Site%20Internet/2.0/green?icon=git)](https://adriencharbonneau.fr/)
*Librairies utilisées :*
* Font Awesome
* Tailwind
### Objectifs : ### Objectifs :
- **Construire un site internet statique** : son contenu ne variera pas en fonction des lecteurs, il s'agit simplement d'une unique page HTML affichant un contenu statique - **Construire un site internet statique** : son contenu ne variera pas en fonction des lecteurs, il s'agit simplement d'une unique page HTML affichant un contenu statique
- Posséder un **historique de version** (*versionning*) du site - Posséder un **historique de version** (*versionning*) du site
- **Code disponible** afin d'être réutilisé ([Inspiration initiale](https://html5up.net/)) - **Code disponible** afin d'être réutilisé. Je m'inspire énormément sur internet ([Inspiration initiale](https://html5up.net/)), il est donc logique que ce soit réciproque.
- **automatiser** au maximum les informations (*ex : intégration automatique du CV lors d'une mise à jour*) - **automatiser** au maximum les informations (*ex : intégration automatique du CV lors d'une mise à jour*)
### Participation du lecteur (*pas implémentée pour l'instant*) : ### Participation du lecteur (*pas implémentée pour l'instant*) :
Dans le cas où le lecteur du site internet remarquerait une anomalie, un dysfonctionnement ou toute autre information qui permettrait d'améliorer le site, ce dernier pourrait communiquer par le biais des tickets/issues. Dans le cas où le lecteur du site internet remarquerait une anomalie, un dysfonctionnement ou toute autre information qui permettrait d'améliorer le site, ce dernier pourrait communiquer par le biais des tickets/issues.
**Attention cependant : cette fonctionnalité (créer un ticket sans inscription au préalable sur le site) est impossible actuellement, les développeurs travaillent sur le sujet** **Attention cependant : cette fonctionnalité (créer un ticket sans inscription au préalable sur le site) est impossible actuellement, les développeurs travaillent sur le sujet**
Néanmoins n'hésitez surtout pas à faire remonter, par le moyen qu'il vous plaira, les problèmes rencontrés sur le site ! Merci par avance 😊

View File

@ -1,13 +0,0 @@
Version: 1.0
RestoreWorkspace: Default
SaveWorkspace: Default
AlwaysSaveHistory: Default
EnableCodeIndexing: Yes
UseSpacesForTab: Yes
NumSpacesForTab: 2
Encoding: UTF-8
RnwWeave: Sweave
LaTeX: pdfLaTeX

View File

@ -43,6 +43,12 @@ section, summary, time, mark, audio, video {
.blanc { .blanc {
color: #fff; color: #fff;
} }
.crop {
height: 1000px;
object-fit: cover;
object-position: 60%;
}
p.details { p.details {
color:#484848; color:#484848;
@ -84,7 +90,7 @@ body {
ol, ul { ol, ul {
list-style: none; list-style: none;
} }
blockquote, q { blockquote, q {
quotes: none; quotes: none;
@ -1760,7 +1766,7 @@ input, select, textarea {
.container { .container {
margin: 0 auto; margin: 0 auto;
max-width: calc(100% - 4.5em); max-width: calc(100% - 4.5em);
width: 45em; width: 50em;
} }
.container.xsmall { .container.xsmall {
@ -1812,7 +1818,7 @@ input, select, textarea {
header p { header p {
color: #aaa; color: #aaa;
position: relative; position: relative;
margin: 0 0 1.6875em 0; margin: 0 0 2em 0;
} }
header h2 + p { header h2 + p {
@ -2275,10 +2281,11 @@ input, select, textarea {
list-style: disc; list-style: disc;
margin: 0 0 2.25em 0; margin: 0 0 2.25em 0;
padding-left: 1em; padding-left: 1em;
} }
ul li { ul li {
padding-left: 0.5em; padding-left: 0em;
} }
ul.alt { ul.alt {
@ -2433,17 +2440,24 @@ input, select, textarea {
ul.feature-icons li.menu { ul.feature-icons li.menu {
text-decoration: none; text-decoration: none;
display: inline-block; display: inline-block;
margin: 0 0 1.6875em 0; margin: 0 0 2em 0;
padding: 0.35em 0 0 3.5em; padding: 0.35em 0 0 3.5em;
position: relative; position: relative;
vertical-align: top; vertical-align: top;
width: 48%; width: 48%;
} }
ul.feature-icons li.icon {
text-decoration: none;
margin: 0 0 2em 0;
padding: 0.35em 0 0 3.5em;
position: relative;
vertical-align: top;
}
ul.feature-icons li { ul.feature-icons li {
text-decoration: none; text-decoration: none;
margin: 0 0 1.6875em 0; margin: 0 0 2em 0;
padding: 0.35em 0 0 3.5em;
position: relative; position: relative;
vertical-align: top; vertical-align: top;
} }
@ -2910,7 +2924,7 @@ input, select, textarea {
} }
#main > section > .container { #main > section > .container {
padding: 6em 0 4em 0; padding: 2em 0 2em 0;
} }
#main > section:first-child { #main > section:first-child {
@ -2925,12 +2939,14 @@ input, select, textarea {
color: #c0c0c0; color: #c0c0c0;
overflow: hidden; overflow: hidden;
padding: 4em 0 2em 0; padding: 4em 0 2em 0;
text-align: center;
} }
#footer .copyright { #footer .copyright {
line-height: 1em; line-height: 1em;
list-style: none; list-style: none;
padding: 0; padding: 0;
margin: 0 0 1em 0;
} }
#footer .copyright li { #footer .copyright li {
@ -3111,7 +3127,7 @@ input, select, textarea {
top: 0; top: 0;
width: 100%; width: 100%;
z-index: 10001; z-index: 10001;
background: #222; background: #4cae4f;
color: #fff; color: #fff;
min-width: 320px; min-width: 320px;
} }
@ -3278,7 +3294,7 @@ input, select, textarea {
} }
#header > header .avatar { #header > header .avatar {
margin: 0 auto 1.6875em auto; margin: 0 auto 2em auto;
width: 6em; width: 6em;
} }
@ -3593,6 +3609,10 @@ input, select, textarea {
font-size: 0.8rem; font-size: 0.8rem;
} }
.caption p {
font-style: italic;
}
.gallery.style1 article .caption a { .gallery.style1 article .caption a {
pointer-events: auto; pointer-events: auto;
} }

175460
assets/css/tailwind.css Normal file

File diff suppressed because it is too large Load Diff

View File

@ -1,223 +0,0 @@
// breakpoints.scss v1.0 | @ajlkn | MIT licensed */
// Vars.
/// Breakpoints.
/// @var {list}
$breakpoints: () !global;
// Mixins.
/// Sets breakpoints.
/// @param {map} $x Breakpoints.
@mixin breakpoints($x: ()) {
$breakpoints: $x !global;
}
/// Wraps @content in a @media block targeting a specific orientation.
/// @param {string} $orientation Orientation.
@mixin orientation($orientation) {
@media screen and (orientation: #{$orientation}) {
@content;
}
}
/// Wraps @content in a @media block using a given query.
/// @param {string} $query Query.
@mixin breakpoint($query: null) {
$breakpoint: null;
$op: null;
$media: null;
// Determine operator, breakpoint.
// Greater than or equal.
@if (str-slice($query, 0, 2) == '>=') {
$op: 'gte';
$breakpoint: str-slice($query, 3);
}
// Less than or equal.
@elseif (str-slice($query, 0, 2) == '<=') {
$op: 'lte';
$breakpoint: str-slice($query, 3);
}
// Greater than.
@elseif (str-slice($query, 0, 1) == '>') {
$op: 'gt';
$breakpoint: str-slice($query, 2);
}
// Less than.
@elseif (str-slice($query, 0, 1) == '<') {
$op: 'lt';
$breakpoint: str-slice($query, 2);
}
// Not.
@elseif (str-slice($query, 0, 1) == '!') {
$op: 'not';
$breakpoint: str-slice($query, 2);
}
// Equal.
@else {
$op: 'eq';
$breakpoint: $query;
}
// Build media.
@if ($breakpoint and map-has-key($breakpoints, $breakpoint)) {
$a: map-get($breakpoints, $breakpoint);
// Range.
@if (type-of($a) == 'list') {
$x: nth($a, 1);
$y: nth($a, 2);
// Max only.
@if ($x == null) {
// Greater than or equal (>= 0 / anything)
@if ($op == 'gte') {
$media: 'screen';
}
// Less than or equal (<= y)
@elseif ($op == 'lte') {
$media: 'screen and (max-width: ' + $y + ')';
}
// Greater than (> y)
@elseif ($op == 'gt') {
$media: 'screen and (min-width: ' + ($y + 1) + ')';
}
// Less than (< 0 / invalid)
@elseif ($op == 'lt') {
$media: 'screen and (max-width: -1px)';
}
// Not (> y)
@elseif ($op == 'not') {
$media: 'screen and (min-width: ' + ($y + 1) + ')';
}
// Equal (<= y)
@else {
$media: 'screen and (max-width: ' + $y + ')';
}
}
// Min only.
@else if ($y == null) {
// Greater than or equal (>= x)
@if ($op == 'gte') {
$media: 'screen and (min-width: ' + $x + ')';
}
// Less than or equal (<= inf / anything)
@elseif ($op == 'lte') {
$media: 'screen';
}
// Greater than (> inf / invalid)
@elseif ($op == 'gt') {
$media: 'screen and (max-width: -1px)';
}
// Less than (< x)
@elseif ($op == 'lt') {
$media: 'screen and (max-width: ' + ($x - 1) + ')';
}
// Not (< x)
@elseif ($op == 'not') {
$media: 'screen and (max-width: ' + ($x - 1) + ')';
}
// Equal (>= x)
@else {
$media: 'screen and (min-width: ' + $x + ')';
}
}
// Min and max.
@else {
// Greater than or equal (>= x)
@if ($op == 'gte') {
$media: 'screen and (min-width: ' + $x + ')';
}
// Less than or equal (<= y)
@elseif ($op == 'lte') {
$media: 'screen and (max-width: ' + $y + ')';
}
// Greater than (> y)
@elseif ($op == 'gt') {
$media: 'screen and (min-width: ' + ($y + 1) + ')';
}
// Less than (< x)
@elseif ($op == 'lt') {
$media: 'screen and (max-width: ' + ($x - 1) + ')';
}
// Not (< x and > y)
@elseif ($op == 'not') {
$media: 'screen and (max-width: ' + ($x - 1) + '), screen and (min-width: ' + ($y + 1) + ')';
}
// Equal (>= x and <= y)
@else {
$media: 'screen and (min-width: ' + $x + ') and (max-width: ' + $y + ')';
}
}
}
// String.
@else {
// Missing a media type? Prefix with "screen".
@if (str-slice($a, 0, 1) == '(') {
$media: 'screen and ' + $a;
}
// Otherwise, use as-is.
@else {
$media: $a;
}
}
}
// Output.
@media #{$media} {
@content;
}
}

View File

@ -1,90 +0,0 @@
/// Removes a specific item from a list.
/// @author Hugo Giraudel
/// @param {list} $list List.
/// @param {integer} $index Index.
/// @return {list} Updated list.
@function remove-nth($list, $index) {
$result: null;
@if type-of($index) != number {
@warn "$index: #{quote($index)} is not a number for `remove-nth`.";
}
@else if $index == 0 {
@warn "List index 0 must be a non-zero integer for `remove-nth`.";
}
@else if abs($index) > length($list) {
@warn "List index is #{$index} but list is only #{length($list)} item long for `remove-nth`.";
}
@else {
$result: ();
$index: if($index < 0, length($list) + $index + 1, $index);
@for $i from 1 through length($list) {
@if $i != $index {
$result: append($result, nth($list, $i));
}
}
}
@return $result;
}
/// Gets a value from a map.
/// @author Hugo Giraudel
/// @param {map} $map Map.
/// @param {string} $keys Key(s).
/// @return {string} Value.
@function val($map, $keys...) {
@if nth($keys, 1) == null {
$keys: remove-nth($keys, 1);
}
@each $key in $keys {
$map: map-get($map, $key);
}
@return $map;
}
/// Gets a duration value.
/// @param {string} $keys Key(s).
/// @return {string} Value.
@function _duration($keys...) {
@return val($duration, $keys...);
}
/// Gets a font value.
/// @param {string} $keys Key(s).
/// @return {string} Value.
@function _font($keys...) {
@return val($font, $keys...);
}
/// Gets a misc value.
/// @param {string} $keys Key(s).
/// @return {string} Value.
@function _misc($keys...) {
@return val($misc, $keys...);
}
/// Gets a palette value.
/// @param {string} $keys Key(s).
/// @return {string} Value.
@function _palette($keys...) {
@return val($palette, $keys...);
}
/// Gets a size value.
/// @param {string} $keys Key(s).
/// @return {string} Value.
@function _size($keys...) {
@return val($size, $keys...);
}

View File

@ -1,149 +0,0 @@
// html-grid.scss v1.0 | @ajlkn | MIT licensed */
// Mixins.
/// Initializes the current element as an HTML grid.
/// @param {mixed} $gutters Gutters (either a single number to set both column/row gutters, or a list to set them individually).
/// @param {mixed} $suffix Column class suffix (optional; either a single suffix or a list).
@mixin html-grid($gutters: 1.5em, $suffix: '') {
// Initialize.
$cols: 12;
$multipliers: 0, 0.25, 0.5, 1, 1.50, 2.00;
$unit: 100% / $cols;
// Suffixes.
$suffixes: null;
@if (type-of($suffix) == 'list') {
$suffixes: $suffix;
}
@else {
$suffixes: ($suffix);
}
// Gutters.
$guttersCols: null;
$guttersRows: null;
@if (type-of($gutters) == 'list') {
$guttersCols: nth($gutters, 1);
$guttersRows: nth($gutters, 2);
}
@else {
$guttersCols: $gutters;
$guttersRows: 0;
}
// Row.
display: flex;
flex-wrap: wrap;
box-sizing: border-box;
align-items: stretch;
// Columns.
> * {
box-sizing: border-box;
}
// Gutters.
&.gtr-uniform {
> * {
> :last-child {
margin-bottom: 0;
}
}
}
// Alignment.
&.aln-left {
justify-content: flex-start;
}
&.aln-center {
justify-content: center;
}
&.aln-right {
justify-content: flex-end;
}
&.aln-top {
align-items: flex-start;
}
&.aln-middle {
align-items: center;
}
&.aln-bottom {
align-items: flex-end;
}
// Step through suffixes.
@each $suffix in $suffixes {
// Suffix.
@if ($suffix != '') {
$suffix: '-' + $suffix;
}
@else {
$suffix: '';
}
// Row.
// Important.
> .imp#{$suffix} {
order: -1;
}
// Columns, offsets.
@for $i from 1 through $cols {
> .col-#{$i}#{$suffix} {
width: $unit * $i;
}
> .off-#{$i}#{$suffix} {
margin-left: $unit * $i;
}
}
// Step through multipliers.
@each $multiplier in $multipliers {
// Gutters.
$class: null;
@if ($multiplier != 1) {
$class: '.gtr-' + ($multiplier * 100);
}
&#{$class} {
margin-top: ($guttersRows * $multiplier * -1);
margin-left: ($guttersCols * $multiplier * -1);
> * {
padding: ($guttersRows * $multiplier) 0 0 ($guttersCols * $multiplier);
}
// Uniform.
&.gtr-uniform {
margin-top: $guttersCols * $multiplier * -1;
> * {
padding-top: $guttersCols * $multiplier;
}
}
}
}
}
}

View File

@ -1,78 +0,0 @@
/// Makes an element's :before pseudoelement a FontAwesome icon.
/// @param {string} $content Optional content value to use.
/// @param {string} $category Optional category to use.
/// @param {string} $where Optional pseudoelement to target (before or after).
@mixin icon($content: false, $category: regular, $where: before) {
text-decoration: none;
&:#{$where} {
@if $content {
content: $content;
}
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
display: inline-block;
font-style: normal;
font-variant: normal;
text-rendering: auto;
line-height: 1;
text-transform: none !important;
@if ($category == brands) {
font-family: 'Font Awesome 5 Brands';
}
@elseif ($category == solid) {
font-family: 'Font Awesome 5 Free';
font-weight: 900;
}
@else {
font-family: 'Font Awesome 5 Free';
font-weight: 400;
}
}
}
/// Applies padding to an element, taking the current element-margin value into account.
/// @param {mixed} $tb Top/bottom padding.
/// @param {mixed} $lr Left/right padding.
/// @param {list} $pad Optional extra padding (in the following order top, right, bottom, left)
/// @param {bool} $important If true, adds !important.
@mixin padding($tb, $lr, $pad: (0,0,0,0), $important: null) {
@if $important {
$important: '!important';
}
$x: 0.1em;
@if unit(_size(element-margin)) == 'rem' {
$x: 0.1rem;
}
padding: ($tb + nth($pad,1)) ($lr + nth($pad,2)) max($x, $tb - _size(element-margin) + nth($pad,3)) ($lr + nth($pad,4)) #{$important};
}
/// Encodes a SVG data URL so IE doesn't choke (via codepen.io/jakob-e/pen/YXXBrp).
/// @param {string} $svg SVG data URL.
/// @return {string} Encoded SVG data URL.
@function svg-url($svg) {
$svg: str-replace($svg, '"', '\'');
$svg: str-replace($svg, '%', '%25');
$svg: str-replace($svg, '<', '%3C');
$svg: str-replace($svg, '>', '%3E');
$svg: str-replace($svg, '&', '%26');
$svg: str-replace($svg, '#', '%23');
$svg: str-replace($svg, '{', '%7B');
$svg: str-replace($svg, '}', '%7D');
$svg: str-replace($svg, ';', '%3B');
@return url("data:image/svg+xml;charset=utf8,#{$svg}");
}

View File

@ -1,64 +0,0 @@
// Misc.
$misc: (
z-index-base: 10000,
header-side: 'right'
);
// Duration.
$duration: (
header: 0.5s,
transition: 0.2s
);
// Size.
$size: (
border-radius: 5px,
border-width: 2px,
element-height: 2.75em,
element-margin: 2.25em,
container-width: 45em
);
// Font.
$font: (
family: ('Lato', sans-serif),
family-fixed: ('Source Code Pro', monospace),
weight: 400,
weight-bold: 700
);
// Palette.
$palette: (
bg: #fff,
fg: #888,
fg-bold: #777,
fg-light: #aaa,
border: #f4f4f4,
border-bg: #fafafa,
border2: #e4e4e4,
border2-bg: #f4f4f4,
border3: #e0e0e0,
border3-bg: #eaeaea,
accent1: (
bg: #4acaa8,
fg-bold: #ffffff,
fg: mix(#4acaa8, #ffffff, 25%),
fg-light: mix(#4acaa8, #ffffff, 40%)
),
accent2: (
bg: #989898,
fg-bold: #ffffff,
fg: mix(#989898, #ffffff, 25%),
fg-light: mix(#989898, #ffffff, 40%)
),
header: (
bg: #4acaa8,
fg-bold: #ffffff,
fg: mix(#4acaa8, #ffffff, 25%),
fg-light: mix(#4acaa8, #ffffff, 40%),
border: mix(#4acaa8, #ffffff, 90%)
)
);

View File

@ -1,376 +0,0 @@
// vendor.scss v1.0 | @ajlkn | MIT licensed */
// Vars.
/// Vendor prefixes.
/// @var {list}
$vendor-prefixes: (
'-moz-',
'-webkit-',
'-ms-',
''
);
/// Properties that should be vendorized.
/// Data via caniuse.com, github.com/postcss/autoprefixer, and developer.mozilla.org
/// @var {list}
$vendor-properties: (
// Animation.
'animation',
'animation-delay',
'animation-direction',
'animation-duration',
'animation-fill-mode',
'animation-iteration-count',
'animation-name',
'animation-play-state',
'animation-timing-function',
// Appearance.
'appearance',
// Backdrop filter.
'backdrop-filter',
// Background image options.
'background-clip',
'background-origin',
'background-size',
// Box sizing.
'box-sizing',
// Clip path.
'clip-path',
// Filter effects.
'filter',
// Flexbox.
'align-content',
'align-items',
'align-self',
'flex',
'flex-basis',
'flex-direction',
'flex-flow',
'flex-grow',
'flex-shrink',
'flex-wrap',
'justify-content',
'order',
// Font feature.
'font-feature-settings',
'font-language-override',
'font-variant-ligatures',
// Font kerning.
'font-kerning',
// Fragmented borders and backgrounds.
'box-decoration-break',
// Grid layout.
'grid-column',
'grid-column-align',
'grid-column-end',
'grid-column-start',
'grid-row',
'grid-row-align',
'grid-row-end',
'grid-row-start',
'grid-template-columns',
'grid-template-rows',
// Hyphens.
'hyphens',
'word-break',
// Masks.
'mask',
'mask-border',
'mask-border-outset',
'mask-border-repeat',
'mask-border-slice',
'mask-border-source',
'mask-border-width',
'mask-clip',
'mask-composite',
'mask-image',
'mask-origin',
'mask-position',
'mask-repeat',
'mask-size',
// Multicolumn.
'break-after',
'break-before',
'break-inside',
'column-count',
'column-fill',
'column-gap',
'column-rule',
'column-rule-color',
'column-rule-style',
'column-rule-width',
'column-span',
'column-width',
'columns',
// Object fit.
'object-fit',
'object-position',
// Regions.
'flow-from',
'flow-into',
'region-fragment',
// Scroll snap points.
'scroll-snap-coordinate',
'scroll-snap-destination',
'scroll-snap-points-x',
'scroll-snap-points-y',
'scroll-snap-type',
// Shapes.
'shape-image-threshold',
'shape-margin',
'shape-outside',
// Tab size.
'tab-size',
// Text align last.
'text-align-last',
// Text decoration.
'text-decoration-color',
'text-decoration-line',
'text-decoration-skip',
'text-decoration-style',
// Text emphasis.
'text-emphasis',
'text-emphasis-color',
'text-emphasis-position',
'text-emphasis-style',
// Text size adjust.
'text-size-adjust',
// Text spacing.
'text-spacing',
// Transform.
'transform',
'transform-origin',
// Transform 3D.
'backface-visibility',
'perspective',
'perspective-origin',
'transform-style',
// Transition.
'transition',
'transition-delay',
'transition-duration',
'transition-property',
'transition-timing-function',
// Unicode bidi.
'unicode-bidi',
// User select.
'user-select',
// Writing mode.
'writing-mode',
);
/// Values that should be vendorized.
/// Data via caniuse.com, github.com/postcss/autoprefixer, and developer.mozilla.org
/// @var {list}
$vendor-values: (
// Cross fade.
'cross-fade',
// Element function.
'element',
// Filter function.
'filter',
// Flexbox.
'flex',
'inline-flex',
// Grab cursors.
'grab',
'grabbing',
// Gradients.
'linear-gradient',
'repeating-linear-gradient',
'radial-gradient',
'repeating-radial-gradient',
// Grid layout.
'grid',
'inline-grid',
// Image set.
'image-set',
// Intrinsic width.
'max-content',
'min-content',
'fit-content',
'fill',
'fill-available',
'stretch',
// Sticky position.
'sticky',
// Transform.
'transform',
// Zoom cursors.
'zoom-in',
'zoom-out',
);
// Functions.
/// Removes a specific item from a list.
/// @author Hugo Giraudel
/// @param {list} $list List.
/// @param {integer} $index Index.
/// @return {list} Updated list.
@function remove-nth($list, $index) {
$result: null;
@if type-of($index) != number {
@warn "$index: #{quote($index)} is not a number for `remove-nth`.";
}
@else if $index == 0 {
@warn "List index 0 must be a non-zero integer for `remove-nth`.";
}
@else if abs($index) > length($list) {
@warn "List index is #{$index} but list is only #{length($list)} item long for `remove-nth`.";
}
@else {
$result: ();
$index: if($index < 0, length($list) + $index + 1, $index);
@for $i from 1 through length($list) {
@if $i != $index {
$result: append($result, nth($list, $i));
}
}
}
@return $result;
}
/// Replaces a substring within another string.
/// @author Hugo Giraudel
/// @param {string} $string String.
/// @param {string} $search Substring.
/// @param {string} $replace Replacement.
/// @return {string} Updated string.
@function str-replace($string, $search, $replace: '') {
$index: str-index($string, $search);
@if $index {
@return str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace);
}
@return $string;
}
/// Replaces a substring within each string in a list.
/// @param {list} $strings List of strings.
/// @param {string} $search Substring.
/// @param {string} $replace Replacement.
/// @return {list} Updated list of strings.
@function str-replace-all($strings, $search, $replace: '') {
@each $string in $strings {
$strings: set-nth($strings, index($strings, $string), str-replace($string, $search, $replace));
}
@return $strings;
}
// Mixins.
/// Wraps @content in vendorized keyframe blocks.
/// @param {string} $name Name.
@mixin keyframes($name) {
@-moz-keyframes #{$name} { @content; }
@-webkit-keyframes #{$name} { @content; }
@-ms-keyframes #{$name} { @content; }
@keyframes #{$name} { @content; }
}
/// Vendorizes a declaration's property and/or value(s).
/// @param {string} $property Property.
/// @param {mixed} $value String/list of value(s).
@mixin vendor($property, $value) {
// Determine if property should expand.
$expandProperty: index($vendor-properties, $property);
// Determine if value should expand (and if so, add '-prefix-' placeholder).
$expandValue: false;
@each $x in $value {
@each $y in $vendor-values {
@if $y == str-slice($x, 1, str-length($y)) {
$value: set-nth($value, index($value, $x), '-prefix-' + $x);
$expandValue: true;
}
}
}
// Expand property?
@if $expandProperty {
@each $vendor in $vendor-prefixes {
#{$vendor}#{$property}: #{str-replace-all($value, '-prefix-', $vendor)};
}
}
// Expand just the value?
@elseif $expandValue {
@each $vendor in $vendor-prefixes {
#{$property}: #{str-replace-all($value, '-prefix-', $vendor)};
}
}
// Neither? Treat them as a normal declaration.
@else {
#{$property}: #{$value};
}
}

File diff suppressed because it is too large Load Diff

BIN
images/BAGUAGE-BIGUGLIA.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 124 KiB

BIN
images/BAGUAGE-MAIN.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 359 KiB

BIN
images/BAGUAGE-ROITELET.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 154 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 359 KiB

After

Width:  |  Height:  |  Size: 1.5 MiB

BIN
images/CEN_PACA.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 734 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 189 KiB

After

Width:  |  Height:  |  Size: 249 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 34 KiB

View File

@ -1,457 +0,0 @@
<!DOCTYPE HTML>
<!-- Vous visitez mon code ? 😇 Vous pouvez le visualiser bien plus facilement directement ici : https://git.adriencharbonneau.fr/Adrien/Site-internet
Bonne lecture ! -->
<html>
<head>
</script>
<title>Adrien CHARBONNEAU Naturaliste écologue</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<meta name="description" content="Site de présentation d'Adrien CHARBONNEAU - Naturaliste écologue et ornithologue passionné.">
<meta name="author" content="Adrien CHARBONNEAU">
<meta property="og:title" content="Adrien CHARBONNEAU Naturaliste écologue" />
<meta property="og:image" content="https://adriencharbonneau.fr/images/CORSICA.jpg" />
<meta property="og:url" content="https://adriencharbonneau.fr" />
<meta property="og:description" content="Site de présentation d'Adrien CHARBONNEAU - Naturaliste écologue et ornithologue passionné." />
<meta property="og:nom_du_site" content="Adrien CHARBONNEAU Naturaliste écologue"/>
<link rel="stylesheet" href="assets/css/main.css" />
<link rel="icon" type="image/png" href="images/AC_favicon.png" />
<!-- Matomo -->
<script>
var _paq = window._paq = window._paq || [];
/* tracker methods like "setCustomDimension" should be called before "trackPageView" */
_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
(function() {
var u="//stat.adriencharbonneau.fr/";
_paq.push(['setTrackerUrl', u+'matomo.php']);
_paq.push(['setSiteId', '1']);
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
})();
</script>
<!-- End Matomo Code -->
</head>
<body class="is-preload">
<!-- Header -->
<section id="header">
<header>
<span class="image avatar"><img src="images/avatar.jpg" alt="" /></span>
<h1 id="logo"><a href="#">Adrien CHARBONNEAU</a></h1>
<p>Naturaliste écologue <br>
et ornithologue passionné</p>
</header>
<nav id="nav">
<ul id="menu">
<li><a href="#presentation" class="active">Présentation</a>
<li><a href="#publications">Publications</a></li>
<li><a href="#supports">Supports de stage</a></li>
<li><a href="#competences">Compétences professionnelles</a></li>
<!-- <li><a href="#contact">Contact</a></li> -->
</ul>
</nav>
<footer>
<ul class="icons">
<li><a href="https://www.linkedin.com/in/adrien-charbonneau/" target="_blank" class="icon brands fa-linkedin" title="Linkedin"><span class="label">Linkedin</span></a></li>
<li><a href="https://www.researchgate.net/profile/Adrien-Charbonneau" target="_blank" class="icon brands fa-researchgate" title="ResearchGate"><span class="label">ResearchGate</span></a></li>
<li><a href="https://git.adriencharbonneau.fr/Adrien/Site-internet" target="_blank" class="icon brands fa-git-square" title="Dépôt git"><span class="label">Dépôt Git</span></a></li>
<li><a href="mailto:adrien.charbonneau@free.fr" class="icon solid fa-envelope" title="Adresse courriel"><span class="label">Email</span></a></li>
<li><a href="https://git.adriencharbonneau.fr/Adrien/CV/raw/branch/master/CV_Adrien_CHARBONNEAU.pdf" target="_blank" class="icon solid fa-address-card" title="Curriculum Vitae"><span class="label">Curriculum Vitae</span></a></li>
<li><a class="icon solid fa-wrench" title="Documentation"><span class="label">Documentation du site internet</span></a></li>
</ul>
</footer>
</section>
<!-- Wrapper -->
<div id="wrapper">
<!-- Main -->
<div id="main">
<!-- presentation -->
<section id="presentation">
<div class="image main" data-position="center">
<img src="images/banner.jpg" alt="" />
</div>
<div class="container">
<header class="major">
<h2>Présentation</h2>
<p>Bonjour et bienvenue sur mon site !</p>
</header>
<div class="identity">
<b>Adrien CHARBONNEAU</b><br>
24 ans<br>
69100 - Villeurbanne, Rhône - France<br>
Permis B (2015) et A (2018)
</div><br>
<p>Cette page est, comme vous l'aurez compris, complémentaire à mon Curriculum Vitae (<i>que vous pourrez retrouver ci-dessous</i>).</p>
<p align="center"><a href="https://git.adriencharbonneau.fr/Adrien/CV/raw/branch/master/CV_Adrien_CHARBONNEAU.pdf" target="_blank" class="button"> CURRICULUM VITAE </a></p>
<p>Elle vous présente divers liens et informations utiles à ma présentation. Vous retrouverez notamment la liste de mes <u><b>compétences professionnelles</b></u>.<br>
<br>
<span class="image fit"><img src="images/CORSICA.jpg" alt=""><legend>En quête du Cincle plongeur (<i>Cinclus cinclus</i>) dans les rivières Corses © Adrien CHARBONNEAU</legend></span>
<div class="identity">Que fais-je en ce moment ? Pour le savoir rendez-vous ici : <a href="ACTUALITE.html" class="button small">- ACTUALITÉ -</a></div><br>
Nhésitez pas à me contacter, que ce soit pour une question, une compétence ou une demande de précision sur une expérience professionnelle, en utilisant mon adresse courriel ci-dessous :<br>
<ul>
<li><a href="mailto:adrien.charbonneau@free.fr">adrien.charbonneau@free.fr</a></li>
</ul></p>
</div>
</section>
<!-- Gallery -->
<div class="gallery lightbox style1 small">
<article>
<a href="images/galerie/fulls/ATHNOC2.jpg" class="image">
<img src="images/galerie/thumbs/ATHNOC2.jpg" alt="" />
</a>
<div class="caption">
<h3 align="center">Chevêche d'Athéna</h3>
<p>Athene noctua</p>
<ul class="actions fixed">
<li><span class="button small">Agrandir</span></li>
</ul>
</div>
</article>
<article>
<a href="images/galerie/fulls/EMBSCH.jpg" class="image">
<img src="images/galerie/thumbs/EMBSCH.jpg" alt="" />
</a>
<div class="caption">
<h3>Bruant des roseaux</h3>
<p>Emberiza schoeniclus</p>
<ul class="actions fixed">
<li><span class="button small">Agrandir</span></li>
</ul>
</div>
</article>
<article>
<a href="images/galerie/fulls/PARCAE.jpg" class="image">
<img src="images/galerie/thumbs/PARCAE.jpg" alt="" />
</a>
<div class="caption">
<h3>Mésange bleue</h3>
<p>Cyanistes caeruleus</p>
<ul class="actions fixed">
<li><span class="button small">Agrandir</span></li>
</ul>
</div>
</article>
<article>
<a href="images/galerie/fulls/PARMAJ.jpg" class="image">
<img src="images/galerie/thumbs/PARMAJ.jpg" alt="" />
</a>
<div class="caption">
<h3>Mésange charbonnière</h3>
<p>Parus major</p>
<ul class="actions fixed">
<li><span class="button small">Agrandir</span></li>
</ul>
</div>
</article>
<article>
<a href="images/galerie/fulls/POCHONS.jpg" class="image">
<img src="images/galerie/thumbs/POCHONS.jpg" alt="" />
</a>
<div class="caption">
<h3>Pochons</h3>
<p>Sac en tissu pour le transport des oiseaux</p>
<ul class="actions fixed">
<li><span class="button small">Agrandir</span></li>
</ul>
</div>
</article>
<article>
<a href="images/galerie/fulls/PRUMOD.jpg" class="image">
<img src="images/galerie/thumbs/PRUMOD.jpg" alt="" />
</a>
<div class="caption">
<h3>Accenteur mouchet</h3>
<p>Prunella modularis</p>
<ul class="actions fixed">
<li><span class="button small">Agrandir</span></li>
</ul>
</div>
</article>
<article>
<a href="images/galerie/fulls/TRAVEE.jpg" class="image">
<img src="images/galerie/thumbs/TRAVEE.jpg" alt="" />
</a>
<div class="caption">
<h3>Travée de baguage</h3>
<p>Zone ouverte où les filets de capture sont tendus</p>
<ul class="actions fixed">
<li><span class="button small">Agrandir</span></li>
</ul>
</div>
</article>
<article>
<a href="images/galerie/fulls/PHYCOL.jpg" class="image">
<img src="images/galerie/thumbs/PHYCOL.jpg" alt="" />
</a>
<div class="caption">
<h3>Pouillot véloce</h3>
<p>Phylloscopus collybita</p>
<ul class="actions fixed">
<li><span class="button small">Agrandir</span></li>
</ul>
</div>
</article>
</div>
<!-- publications -->
<section id="publications">
<div class="container">
<h3>Publications</h3>
<p>Mes différentes publications et écrits scientifiques majeurs qui ont jalonnés mon Master en Biodiversité, Écologie et Évolution.</p>
<div class="features">
<article>
<a href="" class="image"><img src="images/GECKO.jpg" alt="" /></a>
<div class="inner">
<h4>Compétition entre deux espèces de Geckos sur lîle de Porquerolles (<i>2019-2020</i>)</h4>
<p>(<i><b>Bientôt disponible</b></i>) - La Tarente de Maurétanie (<i>Tarentola mauritanica</i>) est, sur l'île de Porquerolles (83), une espèce importée par l'homme. Le Gecko indigène de l'île et occupant la même niche écologique que cette dernière est l'Hémidactyle verruqueux (<i>Hemidactylus turcicus</i>). Il est supposé qu'une compétition réside entre les deux espèces.</p>
</div>
</article>
<article>
<a href="docs/PGM.pdf" class="image"><img src="images/PGM.jpg" alt="" /></a>
<div class="inner">
<h4>Caractérisation du territoire de reproduction de la Pie-grièche méridionale (<i>2019</i>)</h4>
<p>La superficie du territoire de reproduction de la Pie-grièche méridionale (<i>Lanius meridionalis</i>) étant très peu connu, cette étude souhaite apporter des précisions quant à cela.</p>
</div>
</article>
<article>
<a href="docs/ORTHOPTERES.pdf" class="image"><img src="images/ORTHO.jpg" alt="" /></a>
<div class="inner">
<h4>Étude du lien entre communautés dOrthoptères et hauteur de végétation par différentes méthodes déchantillonnage dans la vallée de lUbaye (<i>2018-2019</i>)</h4>
<p>Sujet de l'école de terrain 2018. Dans le Parc National du Mercantour, la hauteur de végétation a-t-elle une importance dans la répartition des communautés d'Orthoptères ?</p>
</div>
</article>
</div>
</div>
</section>
<!-- supports -->
<section id="supports">
<div class="container">
<h3>Supports de stage</h3>
<p>De nombreuses données et annexes sont disponible durant un stage. Elles sont regroupées par stage :</p>
<div class="features">
<article>
<a href="http://adrien.charbonneau.free.fr/PRO/STAGE/ALAN/" class="image"><img src="images/ALAN.jpg" alt="" /></a>
<div class="inner">
<h4>Support de stage de Master 2 : <b>Impact de la lumière artificielle et de la structure du paysage sur la biodiversité en période nocturne</b> (<i>2020</i>)</h4>
<p>Il est admis que la lumière artificielle a des effets néfastes sur la biodiversité. Qu'en est-il en addition à la structure paysagère et au sein du Parc Naturel Régional des Baronnies provençales ?</p>
</div>
</article>
<article>
<a href="http://adrien.charbonneau.free.fr/PRO/STAGE/PGM/" class="image"><img src="images/PGM.jpg" alt="" /></a>
<div class="inner">
<h4>Support de stage de Master 1 : <b>Caractérisation du territoire de reproduction de la Pie-grièche méridionale</b> (<i>2019</i>)</h4>
<p>Dans un but de mesures de gestion de la garrigue et de précision du protocole d'échantillonnage du Plan National d'Actions sur les Pie-grièches (ici la Pie-grièche méridionale), la surface du territoire de reproduction de l'espèce est une information clé.</p>
</div>
</article>
</div>
</div>
</section>
<!-- competences -->
<section id="competences">
<div class="container">
<h3>Compétences</h3>
<p>Mes compétences sont présentées dans la liste ci-dessous, vous y trouverez les références du matériel et des ressources technologiques (<i>ex : logiciel</i>) que je maîtrise. Nhésitez pas, comme précisé précédemment, à me questionner (<i>ou demander un avis</i>) sur une compétence, méthode ou matériel utilisé, jy répondrai avec plaisir.<br>
<i>Dans les parties concernant le matériel, un astérisque (<b>*</b>) signifie que je possède le matériel cité. Pour les identifications acoustiques, le matériel est cité dans la section “acoustique”.</i></p>
<ul class="feature-icons">
<li class="icon solid fa-feather-alt menu"><a href="#naturalistes">Naturalistes</a></li>
<li class="icon solid fa-clipboard-check menu"><a href="#science">Méthodologie et démarche scientifique</a></li>
<li class="icon solid fa-percentage menu"><a href="#statistiques">Analyses statistiques et Modélisation</a></li>
<li class="icon solid fa-map-marked-alt menu"><a href="#cartographie">Analyses spatiales et Cartographie</a></li>
<li class="icon solid fa-microphone-alt menu"><a href="#acoustique">Acoustique</a></li>
<li class="icon solid fa-mountain menu"><a href="#interets">Autres compétences et intérêts divers</a></li>
</ul>
<hr>
<div class="features">
<article>
<h5 id="naturalistes">Compétences naturalistes</h5>
<a class="image comp"><img src="images/ADRIEN_CHARBONNEAU.png" alt="" /><legend>Suivi ornithologique et entomologique (odonates) dans la Tarentaise (73)</legend></a>
<div class="inner comp">
<ul class="feature-icons">
<li class="icon solid fa-feather-alt">Ornithologie<p class="details">Identification visuelle, en main (<i>formation de baguage</i>) et acoustique.</p></li>
<li class="icon solid fa-spider">Entomologie<p class="details">(<i>Lépidoptères, Odonates, Orthoptères</i>) - Identification visuelle, en main (<i>capture au filet, prospection au "drap" nocturne</i>) et acoustique.</p></li>
<li class="icon solid fa-paw">Mammalogie<p class="details">(<i>Chiroptères, Macro/Méso/Micro-mammifères</i>) - Identification visuelle et auditive - Télémétrie / Analyse de pelote de réjection.</p></li>
<li class="icon solid fa-frog">Herpétologie<p class="details">Identification visuelle, en main (<i>plaque à reptiles, "seau" à amphibiens</i>) et acoustique.</p></li>
<li class="icon solid fa-tree">Botanique généraliste<p class="details">Identification des familles et utilisation des flores (<i>Flora Gallica / Flore Méd' / Flores forestières...</i>) - Détermination des habitats - Loupe de botanique, mise en herbier et photographie.</p></li>
</ul>
</div>
</article>
<article>
<h5 id="science">Compétences en méthodologie et en démarche scientifique</h5>
<a class="image comp"><img src="images/RADIOPISTAGE.png" alt="" /><legend>Radiopistage de Pie-grièche méridionale (Lanius meridionalis) dans les Garrigues de Lançon (13)</legend></a>
<div class="inner comp">
<ul class="feature-icons">
<li class="icon solid fa-book">Bases théoriques de l'écologie<p class="details">
<ul class="sublist">
<li>Évolution</li>
<li>Conservation</li>
<li>Gestion de la biodiversité</li>
<li>Bio/Éco-acoustique</li>
<li>Paysage</li>
</ul>
</p></li>
<li class="icon solid fa-clipboard-list">Mise en place de protocole / étude pilote</p></li>
<li class="icon solid fa-map-marked-alt">Application de protocole/stratégie d'échantillonnage</li>
<li class="icon solid fa-chart-bar">Analyse de données<p class="ref">(voir Modélisation et Cartographie ci-dessous)</p></li>
<li class="icon solid fa-paragraph">Rédaction de rapports d'étude/articles scientifiques<p class="details">Introduction, Matériel et Méthode, Résultats, Discussion/Conclusion</p></li>
<li class="icon solid fa-file-alt">Rédaction de rapports d'inventaires/prédiagnostics/Volet Naturel d'Étude d'Impact</li>
</ul>
</div>
</article>
<article>
<h5 id="statistiques">Compétences en analyses statistiques et en modélisation</h5>
<a class="image comp"><img src="images/ABON-HV.png" alt="" /><legend>Représentation de labondance en orthoptères dans le massif du Mercantour (04) en fonction de la hauteur de végétation</legend></a>
<div class="inner comp">
<ul class="feature-icons">
<li class="icon solid fa-chart-line">Modèles Linéaires<p class="details">Simples et mixtes</p></li>
<li class="icon solid fa-percentage">Modèles Linéaires Généralisés<p class="details">Simples et mixtes - GLM/GLMM - Logiciel R</p></li>
<li class="icon solid fa-chart-area">Species Distribution Model<p class="details">SDM - Logiciel R et Maxent</p></li>
<li class="icon solid fa-ring">Capture-Marquage-Recapture<p class="details">CMR - Logiciel Mark</p></li>
</ul>
</div>
</article>
<article>
<h5 id="cartographie">Compétences en analyses spatiales et en cartographie</h5>
<a class="image comp"><img src="images/CARTE.png" alt="" /><legend>Tirage aléatoire de positions sur le territoire de la France métropolitaine</legend></a>
<div class="inner comp">
<ul class="feature-icons">
<li class="icon solid fa-layer-group">QGIS<p class="details">SAGA, GRASS, Modéleur graphique</p></li>
<li class="icon solid fa-globe">ARCGIS (<i>bases</i>)</li>
<li class="icon solid fa-code">R / packages<p class="details"><ul class="sublist">
<li><b><i>Cartographie</i></b> : rgdal ; rgeos ; gridExtra ; raster ; RSAGA ; maptools ; spatstat ; cartography ; sf ; sp</li>
<li><b><i>Acoustique</i></b> : tuneR ; seewave ; soundecology ; pumilioR</li>
<li><b><i>Écologie du paysage</i></b> : spatialEco ; landscapemetrics ; landscapetools</li>
<li><b><i>Domaine vital d'espèce</i></b> : adehabitatHR</li>
</ul></p></li>
</ul>
</div>
</article>
<article>
<h5 id="acoustique">Compétences acoustiques et audionaturalistes</h5>
<a class="image comp"><img src="images/AUDIOMOTH.jpg" alt="" /><legend>AudioMoth durant le stage de M2</legend></a>
<div class="inner comp">
<ul class="feature-icons">
<li class="icon solid fa-microphone-alt">Prise de son<p class="details"><ul class="sublist">
<li>Song Meter Acoustic Recorder (<i>SM4 Acoustic</i>)</li>
<li>AudioMoth (<i>version 1.1.0 et 1.2.0</i>) <b>*</b></li>
<li>Song Meter SM4BAT-FS Ultrasonic Recorder (<i>SM4 bat</i>)</li>
<li>Enregistreur ZOOM H5 <b>*</b> (<i>couplé à des microphones Primo EM172 et une parabole</i>)</li>
<li>PETTERSSON D240x</li>
<li>Echo Meter Touch 2 Pro</li>
<li>Magenta Bat 5 Detector <b>*</b></li>
</ul></p></li>
<li class="icon solid fa-file-audio">Analyse acoustique<p class="details">Identification des espèces, calcul des indices acoustiques,...<ul class="sublist">
<li>Audacity</li>
<li>Syrinx</li>
<li>Kaléidoscope</li>
<li>Batexplorer</li>
<li>Raven Lite</li>
<li><b><i>R / packages</i></b> : tuneR ; seewave ; soundecology ; pumilioR</li>
</ul></p></li>
</ul>
</div>
</article>
<p>
<span class="image fit"><img src="images/CLAGLA.jpg" alt="" /><legend>Sonogramme partiel dun Coucou geai (<i>Clamator glandarius</i>) en migration nocturne © Adrien CHARBONNEAU</legend></span>
</p>
<article>
<h5 id="interets">Les autres compétences et intérêts</h5>
<a class="image comp"><img src="images/LAUZANIER.jpg" alt="" /><legend>Lac du Lauzanier - Mercantour (04)</legend></a>
<div class="inner comp">
<ul class="feature-icons">
<li class="icon solid fa-cloud-sun-rain">Astronomie/Météorologie</li>
<li class="icon solid fa-hiking">Randonnée<p class="details">Très bonne condition physique et très bonnes connaissances des milieux fréquentés</p></li>
<li class="icon solid fa-server">Informatique<p class="details"><ul class="sublist">
<li>Connaissances des systèmes dexploitations Windows/MacOS/Distributions Linux Maintenance de ces derniers</li>
<li>Création de site internet : HTML / CSS / PHP</li>
<li>Base de données MySQL</li>
<li>Language de programmation : R, JavaScript, C++, Python, Bash (<i>shell</i>), Git (<i><a href="https://git.adriencharbonneau.fr/Adrien/Site-internet">Dépôt personnel</a> / Framagit / Github</i>)</li>
<li>Gestion/Montage de vidéo et photographies</li>
<li>Connaissances en sécurité informatique</li>
</ul></p></li>
<li class="icon solid fa-tools">Électronique et "bricolage"<p class="details"><ul class="sublist">
<li>Utilisation et programmation de Raspberry Pi/Arduino : Récepteur ADS-B / Serveur web / Routeur wifi / Projet de station météo, d'enregistreur passif (<i>type SM4 / AudioMoth</i>) et de caméra pour nichoir.</li>
<li>Montage dordinateur fixe et portable / connaissance du matériel</li>
<li>“Touche à tout” : bricolage divers (<i>ex : nichoirs, parabole, modélisme,…</i>)</li>
</ul></p></li>
<li class="icon solid fa-share-alt">Communication<p class="details"><ul class="sublist">
<li>Public : Prise de contact, oral, conférence, animation ...</li>
<li>Réseaux sociaux : Facebook; Twitter, Instagram, Blog,...</li>
</ul></p></li>
</ul>
</div>
</article>
</div>
</div>
</section>
<!-- contact
<section id="contact">
<div class="container">
<h3>Contact</h3>
<p>Nhésitez surtout pas à me contacter par le biais de ce formulaire ou de l'adresse courriel fournie en haut de page. Jy répondrai avec plaisir.</p>
<form method="post" action="mailto:adrien.charbonneau@free.fr">
<div class="row gtr-uniform">
<div class="col-6 col-12-xsmall"><input type="text" name="prenom" id="prenom" placeholder="Prénom" /></div>
<div class="col-6 col-12-xsmall"><input type="text" name="nom" id="nom" placeholder="Nom de famille" /></div>
<div class="col-12"><input type="email" name="email" id="email" placeholder="Email" /></div>
<div class="col-12"><input type="text" name="subject" id="subject" placeholder="Sujet" /></div>
<div class="col-12"><textarea name="message" id="message" placeholder="Message" rows="6"></textarea></div>
<div class="col-12">
<ul class="actions">
<li><input type="submit" class="primary" value="Envoyer le message" /></li>
<li><input type="reset" value="Effacer" /></li>
</ul>
</div>
</div>
</form>
</div>
</section>
-->
</div>
<!-- Footer -->
<section id="footer">
<div class="container">
<ul class="copyright">
<li>&copy; Adrien CHARBONNEAU - 2021. Tous droits réservés.</li>
<li><a href="https://git.adriencharbonneau.fr/Adrien/Site-internet" class="a_git"><img style="margin-right: .5rem; vertical-align: middle;" src="images/GIT.svg" width="25px" height="25px"><b>Version : </b><span class="git git_color1 blanc"> v1.3 </span><b> Branch : </b><span class="git git_color1 blanc"> master </span></a></li>
<li><a href="index.html">Présentation</a></li>
<li><a href="ACTUALITE.html">Actualité</a></li>
</ul>
</div>
</section>
</div>
<!-- Scripts -->
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/jquery.scrollex.min.js"></script>
<script src="assets/js/jquery.scrolly.min.js"></script>
<script src="assets/js/browser.min.js"></script>
<script src="assets/js/breakpoints.min.js"></script>
<script src="assets/js/util.js"></script>
<script src="assets/js/main.js"></script>
</body>
</html>

457
index.php Normal file
View File

@ -0,0 +1,457 @@
<!DOCTYPE HTML>
<!-- Vous visitez mon code ? 😇 Vous pouvez le visualiser bien plus facilement directement ici : https://git.charbonneau.fr/Adrien/Site-internet
Bonne lecture ! -->
<html>
<head>
<title>Adrien CHARBONNEAU Naturaliste écologue</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<meta name="description" content="Site de présentation d'Adrien CHARBONNEAU - Naturaliste écologue et ornithologue passionné.">
<meta name="author" content="Adrien CHARBONNEAU">
<meta property="og:title" content="Adrien CHARBONNEAU Naturaliste écologue" />
<meta property="og:image" content="https://www.adriencharbonneau.fr/images/CORSICA.jpg" />
<meta property="og:url" content="https://www.adriencharbonneau.fr" />
<meta property="og:description" content="Site de présentation d'Adrien CHARBONNEAU - Naturaliste écologue et ornithologue passionné." />
<meta property="og:nom_du_site" content="Adrien CHARBONNEAU Naturaliste écologue"/>
<meta property="og:site_name" content="Adrien CHARBONNEAU Naturaliste écologue"/>
<link rel="stylesheet" href="assets/css/tailwind.css">
<link rel="stylesheet" href="assets/css/main.css" />
<link rel="icon" type="image/png" href="images/AC_favicon.png" />
<!-- Matomo : petit analyseur de visites libre et opensource -->
<script>
var _paq = window._paq = window._paq || [];
/* tracker methods like "setCustomDimension" should be called before "trackPageView" */
_paq.push(["setDocumentTitle", document.title]);
_paq.push(["setCookieDomain", "*.adriencharbonneau.fr"]);
_paq.push(["setDomains", ["*.adriencharbonneau.fr"]]);
_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
(function() {
var u="https://stats.charbonneau.fr/";
_paq.push(['setTrackerUrl', u+'matomo.php']);
_paq.push(['setSiteId', '1']);
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
})();
</script>
</head>
<body class="is-preload">
<?php
class Version {
public static function get() {
$tag = trim(exec('git describe --tags --abbrev=0'));
return sprintf('%s', $tag);
}
}
// echo 'Version du site : ' . Version::get();
?>
<!-- En-tête -->
<section id="header">
<header>
<span class="image avatar"><img src="images/avatar.jpg" alt="Portrait d'Adrien CHARBONNEAU"/></span>
<h1 id="logo"><a href="#">Adrien CHARBONNEAU</a></h1>
<p>Naturaliste écologue <br>
et ornithologue passionné</p>
</header>
<nav id="nav">
<ul id="menu">
<li><a href="#presentation" class="active">Présentation</a>
<li><a href="#publications">Publications</a></li>
<li><a href="#supports">Supports de stage</a></li>
<li><a href="#competences">Compétences professionnelles</a></li>
<!-- <li><a href="#contact">Contact</a></li> -->
</ul>
</nav>
<footer>
<ul class="icons">
<li><a href="mailto:site-adrien@charbonneau.mozmail.com" class="icon solid fa-envelope" title="Adresse courriel"><span class="label">Email</span></a></li>
<li><a href="https://git.charbonneau.fr/Adrien/CV/raw/branch/master/CV_Adrien_CHARBONNEAU.pdf" target="_blank" class="icon solid fa-address-card" title="Curriculum Vitae"><span class="label">Curriculum Vitae</span></a></li>
<li><a class="icon solid fa-wrench" title="Documentation"><span class="label">Documentation du site internet</span></a></li>
</ul>
<ul class="icons">
<li><a href="https://www.linkedin.com/in/adrien-charbonneau/" target="_blank" class="icon brands fa-linkedin" title="Linkedin"><span class="label">Linkedin</span></a></li>
<li><a href="https://www.researchgate.net/profile/Adrien-Charbonneau" target="_blank" class="icon brands fa-researchgate" title="ResearchGate"><span class="label">ResearchGate</span></a></li>
<li><a href="https://git.charbonneau.fr/Adrien/Site-internet" target="_blank" class="icon brands fa-git-square" title="Dépôt git"><span class="label">Dépôt Git</span></a></li>
<li><a href="https://piaille.fr/web/@CharbonneauAdri" rel="me" target="_blank" class="icon brands fa-mastodon" title="Mastodon"><span class="label">Mastodon</span></a></li>
<li><a href="https://www.twitter.com/CharbonneauAdri/" target="_blank" class="icon brands fa-twitter-square" title"Twitter"><span class="label">Twitter</span></a></li>
</ul>
</footer>
</section>
<!-- Wrapper -->
<div id="wrapper">
<!-- Main -->
<div id="main">
<!-- presentation -->
<section id="presentation">
<div class="image main" data-position="center">
<img src="images/banner.jpg" alt="Bannière du site internet"/>
</div>
<div class="container">
<header class="major">
<h2>Présentation</h2>
<p>Bonjour et bienvenue sur mon site !</p>
</header>
<div class="identity">
<b>Adrien CHARBONNEAU</b><br>
27 ans<br>
83340 - Flassans-sur-Issole, Var (83) - France<br>
Permis B (2015) et A (2018)
<div class="px-6 pt-4 pb-2">
<span class="inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2 mb-2">#ornitho 🦅</span>
<span class="inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2 mb-2">#naturaliste 🌲</span>
<span class="inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2 mb-2">#science 🔭</span>
<span class="inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2 mb-2">#biodiversité 🏞</span>
</div>
</div><br>
<p>Cette page est, comme vous l'aurez compris, complémentaire à mon Curriculum Vitae (<i>que vous pourrez retrouver ci-dessous</i>).</p>
<p align="center"><a href="https://git.charbonneau.fr/Adrien/CV/raw/branch/master/CV_Adrien_CHARBONNEAU.pdf" target="_blank" class="button"> CURRICULUM VITAE </a></p>
<p>Elle vous présente divers liens et informations utiles à ma présentation. Vous retrouverez notamment la liste de mes <u><b>compétences professionnelles</b></u>.<br>
<br>
<span class="image fit"><img src="images/CORSICA.jpg" alt="Comptage d'un rassemblement d'Œdicnèmes criards (Burhinus oedicnemus) en Corse" loading="lazy"/><legend>Comptage d'un rassemblement d'Œdicnèmes criards (<i>Burhinus oedicnemus</i>) en Corse</legend></span>
<div class="identity">Que fais-je en ce moment ? Pour le savoir rendez-vous ici : <a href="./ACTUALITE/" class="button small">- ACTUALITÉ -</a></div><br>
Nhésitez pas à me contacter, que ce soit pour une question, une compétence ou une demande de précision sur une expérience professionnelle, en utilisant mon adresse courriel ci-dessous :<br>
<ul>
<li><a href="mailto:site-adrien@charbonneau.mozmail.com">site-adrien@charbonneau.mozmail.com</a></li>
</ul></p>
</div>
</section>
<!-- Galerie -->
<div class="gallery lightbox style1 small">
<article>
<a href="images/galerie/fulls/ATHNOC2.jpg" class="image">
<img src="images/galerie/thumbs/ATHNOC2.jpg" alt="Chevêche d'Athéna au baguage" loading="lazy"/>
</a>
<div class="caption">
<h3 align="center">Chevêche d'Athéna</h3>
<p>Athene noctua</p>
</div>
</article>
<article>
<a href="images/galerie/fulls/EMBSCH.jpg" class="image">
<img src="images/galerie/thumbs/EMBSCH.jpg" alt="Bruant des roseaux au baguage" loading="lazy"/>
</a>
<div class="caption">
<h3>Bruant des roseaux</h3>
<p>Emberiza schoeniclus</p>
</div>
</article>
<article>
<a href="images/galerie/fulls/PARCAE.jpg" class="image">
<img src="images/galerie/thumbs/PARCAE.jpg" alt="Mésange bleue au baguage" loading="lazy"/>
</a>
<div class="caption">
<h3>Mésange bleue</h3>
<p>Cyanistes caeruleus</p>
</div>
</article>
<article>
<a href="images/galerie/fulls/PARMAJ.jpg" class="image">
<img src="images/galerie/thumbs/PARMAJ.jpg" alt="Mésange charbonnière au baguage" loading="lazy"/>
</a>
<div class="caption">
<h3>Mésange charbonnière</h3>
<p>Parus major</p>
</div>
</article>
<article>
<a href="images/galerie/fulls/POCHONS.jpg" class="image">
<img src="images/galerie/thumbs/POCHONS.jpg" alt="Sac en tissu pour le transport des oiseaux" loading="lazy"/>
</a>
<div class="caption">
<h3>Pochons</h3>
<p>Sac en tissu pour le transport des oiseaux</p>
</div>
</article>
<article>
<a href="images/galerie/fulls/PRUMOD.jpg" class="image">
<img src="images/galerie/thumbs/PRUMOD.jpg" alt="Accenteur mouchet au baguage" loading="lazy"/>
</a>
<div class="caption">
<h3>Accenteur mouchet</h3>
<p>Prunella modularis</p>
</div>
</article>
<article>
<a href="images/galerie/fulls/TRAVEE.jpg" class="image">
<img src="images/galerie/thumbs/TRAVEE.jpg" alt="Zone ouverte où les filets de capture sont tendus<" loading="lazy"/>
</a>
<div class="caption">
<h3>Travée de baguage</h3>
<p>Zone ouverte les filets de capture sont tendus</p>
</div>
</article>
<article>
<a href="images/galerie/fulls/PHYCOL.jpg" class="image">
<img src="images/galerie/thumbs/PHYCOL.jpg" alt="Pouillot véloce au baguage" loading="lazy"/>
</a>
<div class="caption">
<h3>Pouillot véloce</h3>
<p>Phylloscopus collybita</p>
</div>
</article>
</div>
<!-- publications -->
<section id="publications">
<div class="container">
<h3>Publications 📑</h3>
<p>Mes différentes publications et écrits scientifiques majeurs qui ont jalonnés mon Master en Biodiversité, Écologie et Évolution.</p>
<div class="features">
<article>
<a href="" class="image"><img src="images/GECKO.jpg" alt="Tarente de Maurétanie" loading="lazy"/></a>
<div class="inner">
<h4>Compétition entre deux espèces de Geckos sur lîle de Porquerolles (<i>2019-2020</i>)</h4>
<p>(<i><b>Bientôt disponible</b></i>) - La Tarente de Maurétanie (<i>Tarentola mauritanica</i>) est, sur l'île de Porquerolles (83), une espèce importée par l'homme. Le Gecko indigène de l'île et occupant la même niche écologique que cette dernière est l'Hémidactyle verruqueux (<i>Hemidactylus turcicus</i>). Il est supposé qu'une compétition réside entre les deux espèces.</p>
</div>
</article>
<article>
<a href="docs/PGM.pdf" class="image"><img src="images/PGM.jpg" alt="Pie-grièche méridionale au baguage" loading="lazy"/></a>
<div class="inner">
<h4>Caractérisation du territoire de reproduction de la Pie-grièche méridionale (<i>2019</i>)</h4>
<p>La superficie du territoire de reproduction de la Pie-grièche méridionale (<i>Lanius meridionalis</i>) étant très peu connu, cette étude souhaite apporter des précisions quant à cela.</p>
</div>
</article>
<article>
<a href="docs/ORTHOPTERES.pdf" class="image"><img src="images/ORTHO.jpg" alt="Deux criquets lors d'une capture" loading="lazy"/></a>
<div class="inner">
<h4>Étude du lien entre communautés dOrthoptères et hauteur de végétation par différentes méthodes déchantillonnage dans la vallée de lUbaye (<i>2018-2019</i>)</h4>
<p>Sujet de l'école de terrain 2018. Dans le Parc National du Mercantour, la hauteur de végétation a-t-elle une importance dans la répartition des communautés d'Orthoptères ?</p>
</div>
</article>
</div>
</div>
</section>
<!-- supports -->
<section id="supports">
<div class="container">
<h3>Supports de stage 💼</h3>
<p>De nombreuses données et annexes sont disponible durant un stage. Elles sont regroupées par stage :</p>
<div class="features">
<article>
<a href="http://adrien.charbonneau.free.fr/PRO/STAGE/ALAN/" class="image"><img src="images/ALAN.jpg" alt="Illustration de la pollution lumineuse" loading="lazy"/></a>
<div class="inner">
<h4>Support de stage de Master 2 : <b>Impact de la lumière artificielle et de la structure du paysage sur la biodiversité en période nocturne</b> (<i>2020</i>)</h4>
<p>Il est admis que la lumière artificielle a des effets néfastes sur la biodiversité. Qu'en est-il en addition à la structure paysagère et au sein du Parc Naturel Régional des Baronnies provençales ?</p>
</div>
</article>
<article>
<a href="http://adrien.charbonneau.free.fr/PRO/STAGE/PGM/" class="image"><img src="images/PGM.jpg" alt="Pie-grièche méridionale au baguage" loading="lazy"/></a>
<div class="inner">
<h4>Support de stage de Master 1 : <b>Caractérisation du territoire de reproduction de la Pie-grièche méridionale</b> (<i>2019</i>)</h4>
<p>Dans un but de mesures de gestion de la garrigue et de précision du protocole d'échantillonnage du Plan National d'Actions sur les Pie-grièches (ici la Pie-grièche méridionale), la surface du territoire de reproduction de l'espèce est une information clé.</p>
</div>
</article>
</div>
</div>
</section>
<!-- competences -->
<section id="competences">
<div class="container">
<h3>Compétences 🔨</h3>
<p>Mes compétences sont présentées dans la liste ci-dessous, vous y trouverez les références du matériel et des ressources technologiques (<i>ex : logiciel</i>) que je maîtrise. Nhésitez pas, comme précisé précédemment, à me questionner (<i>ou demander un avis</i>) sur une compétence, méthode ou matériel utilisé, jy répondrai avec plaisir.<br>
<i>Dans les parties concernant le matériel, un astérisque (<b>*</b>) signifie que je possède le matériel cité. Pour les identifications acoustiques, le matériel est cité dans la section “acoustique”.</i></p>
<ul class="feature-icons">
<li class="icon solid fa-feather-alt menu"><a href="#naturalistes">Naturalistes</a></li>
<li class="icon solid fa-clipboard-check menu"><a href="#science">Méthodologie et démarche scientifique</a></li>
<li class="icon solid fa-percentage menu"><a href="#statistiques">Analyses statistiques et Modélisation</a></li>
<li class="icon solid fa-map-marked-alt menu"><a href="#cartographie">Analyses spatiales et Cartographie</a></li>
<li class="icon solid fa-microphone-alt menu"><a href="#acoustique">Acoustique</a></li>
<li class="icon solid fa-mountain menu"><a href="#interets">Autres compétences et intérêts divers</a></li>
</ul>
<hr>
<div class="features">
<article>
<h5 id="naturalistes">Compétences naturalistes</h5>
<a class="image comp"><img src="images/ADRIEN_CHARBONNEAU.png" alt="Portrait de Adrien CHARBONNEAU" loading="lazy"/><legend>Suivi ornithologique et entomologique (odonates) dans la Tarentaise (73)</legend></a>
<div class="inner comp">
<ul class="feature-icons">
<li class="icon solid fa-feather-alt">Ornithologie<p class="details">Identification visuelle, en main (<i>formation de baguage</i>) et acoustique.</p></li>
<li class="icon solid fa-spider">Entomologie<p class="details">(<i>Lépidoptères, Odonates, Orthoptères</i>) - Identification visuelle, en main (<i>capture au filet, prospection au "drap" nocturne</i>) et acoustique.</p></li>
<li class="icon solid fa-paw">Mammalogie<p class="details">(<i>Macro/Méso/Micro-mammifères</i>) - Identification visuelle / Analyse de pelote de réjection.<br>(<i>Chiroptères</i>) - Bases d'identification visuelle et auditive - Télémétrie.</p></li>
<li class="icon solid fa-frog">Herpétologie<p class="details">Identification visuelle, en main (<i>plaque à reptiles, "seau" à amphibiens</i>) et acoustique.</p></li>
<li class="icon solid fa-tree">Botanique généraliste<p class="details">Identification des familles et utilisation basique des flores (<i>Flora Gallica / Flore Méd' / Flores forestières...</i>) - Loupe de botanique, mise en herbier et photographie.</p></li>
</ul>
</div>
</article>
<article>
<h5 id="science">Compétences en méthodologie et en démarche scientifique</h5>
<a class="image comp"><img src="images/RADIOPISTAGE.png" alt="Action de radiopistage de Pie-grièche méridionale" loading="lazy"/><legend>Radiopistage de Pie-grièche méridionale (Lanius meridionalis) dans les Garrigues de Lançon (13)</legend></a>
<div class="inner comp">
<ul class="feature-icons">
<li class="icon solid fa-book">Bases théoriques de l'écologie<p class="details">
<ul class="sublist">
<li>Évolution</li>
<li>Conservation</li>
<li>Gestion de la biodiversité</li>
<li>Bio/Éco-acoustique</li>
<li>Paysage</li>
</ul>
</p></li>
<li class="icon solid fa-clipboard-list">Mise en place de protocole / étude pilote</p></li>
<li class="icon solid fa-map-marked-alt">Application de protocole/stratégie d'échantillonnage</li>
<li class="icon solid fa-chart-bar">Analyse de données<p class="ref">(voir Modélisation et Cartographie ci-dessous)</p></li>
<li class="icon solid fa-paragraph">Rédaction de rapports d'étude/articles scientifiques<p class="details">Introduction, Matériel et Méthode, Résultats, Discussion/Conclusion</p></li>
<li class="icon solid fa-file-alt">Rédaction de rapports d'inventaires/prédiagnostics/Volet Naturel d'Étude d'Impact</li>
</ul>
</div>
</article>
<article>
<h5 id="statistiques">Compétences en analyses statistiques et en modélisation</h5>
<a class="image comp"><img src="images/ABON-HV.png" alt="Graphique de l'abondance en orthoptère en fonction de la hauteur de végétation" loading="lazy"/><legend>Représentation de labondance en orthoptères dans le massif du Mercantour (04) en fonction de la hauteur de végétation</legend></a>
<div class="inner comp">
<ul class="feature-icons">
<li class="icon solid fa-chart-line">Modèles Linéaires<p class="details">Simples et mixtes</p></li>
<li class="icon solid fa-percentage">Modèles Linéaires Généralisés<p class="details">Simples et mixtes - GLM/GLMM - Logiciel R</p></li>
<li class="icon solid fa-chart-area">Species Distribution Model<p class="details">SDM - Logiciel R et Maxent</p></li>
<li class="icon solid fa-ring">Capture-Marquage-Recapture<p class="details">CMR - Logiciel Mark</p></li>
</ul>
</div>
</article>
<article>
<h5 id="cartographie">Compétences en analyses spatiales et en cartographie</h5>
<a class="image comp"><img src="images/CARTE.png" alt="Carte de la France" loading="lazy"/><legend>Tirage aléatoire de positions sur le territoire de la France métropolitaine</legend></a>
<div class="inner comp">
<ul class="feature-icons">
<li class="icon solid fa-layer-group">QGIS<p class="details">SAGA, GRASS, Modéleur graphique</p></li>
<li class="icon solid fa-globe">ARCGIS (<i>bases</i>)</li>
<li class="icon solid fa-code">R / packages<p class="details"><ul class="sublist">
<li><b><i>Cartographie</i></b> : rgdal ; rgeos ; gridExtra ; raster ; RSAGA ; maptools ; spatstat ; cartography ; sf ; sp</li>
<li><b><i>Acoustique</i></b> : tuneR ; seewave ; soundecology ; pumilioR</li>
<li><b><i>Écologie du paysage</i></b> : spatialEco ; landscapemetrics ; landscapetools</li>
<li><b><i>Domaine vital d'espèce</i></b> : adehabitatHR</li>
</ul></p></li>
</ul>
</div>
</article>
<article>
<h5 id="acoustique">Compétences acoustiques et audionaturalistes</h5>
<a class="image comp"><img src="images/AUDIOMOTH.jpg" alt="Enregistreur AudioMoth" class="crop" loading="lazy"/><legend>AudioMoth durant le stage de M2</legend></a>
<div class="inner comp">
<ul class="feature-icons">
<li class="icon solid fa-microphone-alt">Prise de son<p class="details"><ul class="sublist">
<li>Song Meter Acoustic Recorder (<i>SM4 Acoustic</i>)</li>
<li>Song Meter Mini Acoustic Recorder (<i>SM4 Mini Acoustic</i>)</li>
<li>AudioMoth (<i>version 1.1.0 et 1.2.0</i>) <b>*</b></li>
<li>Song Meter SM4BAT-FS Ultrasonic Recorder (<i>SM4 bat</i>)</li>
<li>Enregistreur ZOOM H5 <b>*</b> (<i>couplé à des microphones Primo EM172 et une parabole</i>)</li>
<li>PETTERSSON D240x</li>
<li>Echo Meter Touch 2 Pro</li>
<li>Magenta Bat 5 Detector <b>*</b></li>
</ul></p></li>
<li class="icon solid fa-file-audio">Analyse acoustique<p class="details">Identification des espèces, calcul des indices acoustiques,...<ul class="sublist">
<li>Audacity</li>
<li>ChiroSurf</li>
<li>Syrinx</li>
<li>Raven Lite</li>
<li><b><i>R / packages</i></b> : tuneR ; seewave ; soundecology ; pumilioR</li>
</ul></p></li>
</ul>
</div>
</article>
<p>
<span class="image fit"><img src="images/CLAGLA.jpg" alt="Sonogramme partiel dun Coucou geai en migration nocturne" loading="lazy"/><legend>Sonogramme partiel dun Coucou geai (<i>Clamator glandarius</i>) en migration nocturne</legend></span>
</p>
<article>
<h5 id="interets">Les autres compétences et intérêts</h5>
<a class="image comp"><img src="images/LAUZANIER.jpg" alt="Lac du Lauzanier" class="crop" loading="lazy"/><legend>Lac du Lauzanier - Mercantour (04)</legend></a>
<div class="inner comp">
<ul class="feature-icons">
<li class="icon solid fa-hiking">Randonnée<p class="details">Très bonne condition physique et très bonnes connaissances des milieux fréquentés</p></li>
<li class="icon solid fa-cloud-sun-rain">Astronomie/Météorologie</li>
<li class="icon solid fa-server">Informatique<p class="details"><ul class="sublist">
<li>Connaissances des systèmes dexploitations Windows/MacOS/Distributions Linux Maintenance de ces derniers</li>
<li>Création de site internet : HTML / CSS / PHP</li>
<li>Base de données MySQL</li>
<li>Programmation et versionning : R, JavaScript, Python, PowerShell/Bash (<i>shell</i>), Git (<i><a href="https://git.charbonneau.fr/Adrien/Site-internet">Dépôt personnel</a> / <a href="https://github.com/Adri-Charbonneau/">Github</a></i>)</li>
<li>Gestion/Montage de vidéo et photographies</li>
<li>Connaissances en sécurité informatique</li>
</ul></p></li>
<li class="icon solid fa-tools">Électronique et "bricolage"<p class="details"><ul class="sublist">
<li>Utilisation et programmation de Raspberry Pi/Arduino : Récepteur ADS-B / Serveur web / Routeur wifi / Projet de station météo, d'enregistreur passif (<i>type SM4 / AudioMoth</i>) et de caméra pour nichoir.</li>
<li>Montage dordinateur fixe et portable / connaissance du matériel</li>
<li>“Touche à tout” : bricolage divers (<i>ex : nichoirs, parabole, modélisme,</i>)</li>
</ul></p></li>
<li class="icon solid fa-share-alt">Communication<p class="details"><ul class="sublist">
<li>Public : Prise de contact, oral, conférence, animation ...</li>
<li>Réseaux sociaux : Facebook; Twitter, Instagram, Blog, ...</li>
</ul></p></li>
</ul>
</div>
</article>
</div>
</div>
</section>
<!-- contact
<section id="contact">
<div class="container">
<h3>Contact</h3>
<p>Nhésitez surtout pas à me contacter par le biais de ce formulaire ou de l'adresse courriel fournie en haut de page. Jy répondrai avec plaisir.</p>
<form method="post" action="mailto:site-internet@adriencharbonneau.anonaddy.com">
<div class="row gtr-uniform">
<div class="col-6 col-12-xsmall"><input type="text" name="prenom" id="prenom" placeholder="Prénom" /></div>
<div class="col-6 col-12-xsmall"><input type="text" name="nom" id="nom" placeholder="Nom de famille" /></div>
<div class="col-12"><input type="email" name="email" id="email" placeholder="Email" /></div>
<div class="col-12"><input type="text" name="subject" id="subject" placeholder="Sujet" /></div>
<div class="col-12"><textarea name="message" id="message" placeholder="Message" rows="6"></textarea></div>
<div class="col-12">
<ul class="actions">
<li><input type="submit" class="primary" value="Envoyer le message" /></li>
<li><input type="reset" value="Effacer" /></li>
</ul>
</div>
</div>
</form>
</div>
</section>
-->
</div>
<!-- Pied de page -->
<section id="footer">
<div class="container">
<ul class="copyright">
<li>&copy; Adrien CHARBONNEAU - <?php echo date("Y"); ?>. Tous droits réservés.</li> <li><a href="./">Présentation</a></li> <li><a href="./ACTUALITE/">Actualité</a></li>
</ul>
<ul class="copyright">
<li><a href="https://git.charbonneau.fr/Adrien/Site-internet" class="a_git"><img style="margin-right: .5rem; vertical-align: middle;" src="images/GIT.svg" width="25px" height="25px"/><b>Version : </b><span class="git git_color1 blanc"><?php echo Version::get(); ?></span><b> Branch : </b><span class="git git_color1 blanc"> master </span></a></li>
</ul>
</div>
</section>
</div>
<!-- Scripts -->
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/jquery.scrollex.min.js"></script>
<script src="assets/js/jquery.scrolly.min.js"></script>
<script src="assets/js/browser.min.js"></script>
<script src="assets/js/breakpoints.min.js"></script>
<script src="assets/js/util.js"></script>
<script src="assets/js/main.js"></script>
</body>
</html>