No Description
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

index.html 31KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490
  1. <!doctype html>
  2. <html lang="fr">
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  6. <meta name="description" content="Site internet personnel d'Hugo LEROUX - Étudiant en ingénierie informatique, passionnée par le logiciel libre, la sécurité informatique et le respect de la vie privée sur internet.">
  7. <meta name="author" content="Hugo LEROUX">
  8. <link rel="icon" href="pictures/favicon.png">
  9. <link rel="canonical" href="https://hugoleroux.ovh" />
  10. <title>Hugo LEROUX - Étudiant en ingénierie informatique.</title>
  11. <!-- Bootstrap CSS file -->
  12. <link href="./css/bootstrap.min.css" rel="stylesheet">
  13. <!-- Other JS files -->
  14. <script src="./js/jquery.slim.js"></script>
  15. <script src="./js/popper.min.js"></script>
  16. <!-- Bootstrap JS file -->
  17. <script src="./js/bootstrap.min.js"></script>
  18. <!-- Hugo CSS file -->
  19. <link href="./css/hugo.css" rel="stylesheet">
  20. <!-- ForkAwesome css file -->
  21. <link href="./forkawesome/css/fork-awesome.min.css" rel="stylesheet">
  22. </head>
  23. <body>
  24. <!-- Begin page content -->
  25. <nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top">
  26. <a class="navbar-brand" href="#"><i class="fa fa-home" aria-hidden="true"></i> hugo@website ~ $</a>
  27. <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
  28. <span class="navbar-toggler-icon"></span>
  29. </button>
  30. <div class="collapse navbar-collapse" id="navbarNav">
  31. <ul class="navbar-nav ml-auto">
  32. <li class="nav-item">
  33. <a class="nav-link" href="#"><i class="fa fa-user-circle" aria-hidden="true"></i> À propos</a>
  34. </li>
  35. <li class="nav-item">
  36. <a class="nav-link" href="#projects"><i class="fa fa-cubes" aria-hidden="true"></i> Projets</a>
  37. </li>
  38. <li class="nav-item">
  39. <a class="nav-link" href="#resume"><i class="fa fa-briefcase" aria-hidden="true"></i> Expériences</a>
  40. </li>
  41. <li class="nav-item">
  42. <a class="nav-link" href="#testimonies"><i class="fa fa-trophy" aria-hidden="true"></i> Attestations</a>
  43. </li>
  44. <li class="nav-item">
  45. <a class="nav-link" href="#school"><i class="fa fa-university" aria-hidden="true"></i> Scolarité</a>
  46. </li>
  47. <li class="nav-item">
  48. <a class="nav-link" href="#contact"><i class="fa fa-envelope" aria-hidden="true"></i> Contact</a>
  49. </li>
  50. <li class="nav-item">
  51. <a class="nav-icon ml-md-1" href="&#x78;&#x6d;&#x70;&#x70;&#x3a;&#x67;&#x6f;&#x74;&#x65;&#x78;&#x78;&#x40;&#x61;&#x6c;&#x74;&#x65;&#x72;&#x6e;&#x61;&#x6e;&#x65;&#x74;&#x2e;&#x66;&#x72;" title="Adresse XMPP: &#x67;&#x6f;&#x74;&#x65;&#x78;&#x78;&#x40;&#x61;&#x6c;&#x74;&#x65;&#x72;&#x6e;&#x61;&#x6e;&#x65;&#x74;&#x2e;&#x66;&#x72;"><i class="fa fa-xmpp fa-2x"></i></a>
  52. </li>
  53. <li class="nav-item">
  54. <a class="nav-icon ml-md-1" href="&#x6d;&#x61;&#x69;&#x6c;&#x74;&#x6f;&#x3a;&#x68;&#x75;&#x67;&#x6f;&#x2e;&#x6c;&#x65;&#x72;&#x6f;&#x75;&#x78;&#x40;&#x61;&#x6c;&#x74;&#x65;&#x72;&#x6e;&#x61;&#x6e;&#x65;&#x74;&#x2e;&#x66;&#x72;"><i class="fa fa-envelope fa-2x"></i></a>
  55. </li>
  56. <li class="nav-item">
  57. <a class="nav-icon ml-md-1" href="#" data-toggle="modal" data-target="#GPGPublicKeyModal" title="Clé publique GPG"><i class="fa fa-gnupg fa-2x"></i></a>
  58. </li>
  59. <li class="nav-item">
  60. <a class="nav-icon ml-md-1" href="https://git.alternanet.fr/gotexx" title="Profil Gitea"><i class="fa fa-git fa-2x"></i></a>
  61. </li>
  62. <li class="nav-item">
  63. <a rel="me" class="nav-icon ml-md-1" href="https://mstdn.alternanet.fr/@gotexx" title="Profil Mastodon"><i class="fa fa-mastodon fa-2x"></i></a>
  64. </li>
  65. </ul>
  66. <a href="#" class="btn btn-outline-light ml-md-3 disabled" role="button" aria-pressed="true">Blog</a>
  67. </div>
  68. </nav>
  69. <div class="container">
  70. <main role="main" class="section" id="about">
  71. <div class="row me">
  72. <div class="col-lg-2">
  73. <img src="pictures/portrait.png" alt="Avatar fictif d'Hugo LEROUX" class="rounded-circle img-fluid mx-auto d-block">
  74. </div>
  75. <div class="col-lg-10">
  76. <h1><span itemprop="givenName">Hugo</span> <span itemprop="familyName">LEROUX</span></h1>
  77. <h2><span itemprop="jobTitle">Administrateur Support Atelier</span>, <span itemprop="worksFor">THALES</span></h2>
  78. <div itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
  79. <h5><span itemprop="addressLocality">Bordeaux</span>, FRANCE</h5>
  80. </div>
  81. </div>
  82. </div>
  83. <p class="lead text-center">Étudiant en ingénierie informatique, passionné par le logiciel libre, la sécurité informatique et le respect de la vie privée sur internet.</p>
  84. <div class="card">
  85. <div class="card-body">
  86. <p>
  87. Actuellement étudiant en quatrième année d'ingénierie informatique au sein de l'EPSI de Bordeaux, j'occupe un poste
  88. d'Administrateur Support Atelier dans l'entreprise Thales sur le campus de Bordeaux Mérignac.
  89. </p>
  90. <p>
  91. Depuis plusieurs années maintenant, je suis passionné par la philosophie des logiciels libres et j'essaye d'y contribuer lorsque mon
  92. emploi du temps me le permet. De plus, je les utilisent autant que possible dans mes projets personnels.
  93. </p>
  94. </div>
  95. </div>
  96. </main>
  97. <div class="project section" id="projects">
  98. <h2><i class="fa fa-cubes" aria-hidden="true"></i> Projets</h2>
  99. <div class="row">
  100. <div class="col-md-6 col-sm-12">
  101. <div class="card space-bottom-card-10">
  102. <img class="card-img" src="pictures/projects-logo/logo-alternanet.png" alt="Logo du projet Alternanet.fr">
  103. <div class="card-body">
  104. <h5 class="card-title">Alternanet.fr</h5>
  105. <p class="card-text">Alternanet propose un ensemble de services libres et gratuits respectueux de votre vie privée.
  106. Alternanet se positionne en alternative vis à vis des GAFAM et leurs appétit constament grandissant de données personnelles.</p>
  107. <a href="https://alternanet.fr" class="btn btn-primary"><i class="fa fa-arrow-circle-right" aria-hidden="true"></i> Visiter</a>
  108. </div>
  109. </div>
  110. </div>
  111. <div class="col-md-6 col-sm-12">
  112. <div class="card">
  113. <img class="card-img" src="pictures/projects-logo/logo-billoky.png" alt="Logo du projet Billoky">
  114. <div class="card-body">
  115. <h5 class="card-title">Billoky</h5>
  116. <p class="card-text">Billoky vous permet de créer un inventaire sécurisé pour tout vos biens et ainsi accélérer vos démarches de remboursement lorsqu'un sinistre intervient dans votre vie.
  117. Billoky vous permet également de stocker vos documents à la manière d'un coffre-fort numérique.</p>
  118. <a href="#" class="btn btn-primary disabled"><i class="fa fa-arrow-circle-right" aria-hidden="true"></i> Visiter</a> <strong>Bientôt disponible !</strong>
  119. </div>
  120. </div>
  121. </div>
  122. </div>
  123. </div>
  124. <div class="resume section" id="resume">
  125. <h2><i class="fa fa-briefcase" aria-hidden="true"></i> Expériences</h2>
  126. <div class="row">
  127. <div class="col">
  128. <div class="card mb-3">
  129. <div class="card-header text-center">
  130. <strong>Depuis septembre 2017 <span class="badge badge-success"> Actuel</span></strong>
  131. </div>
  132. <div class="card-body">
  133. <div class="card-image"><img class="card-img" src="pictures/experiences-logo/thales.png" alt="Logo de l'entreprise THALES"></div>
  134. <h5 class="card-title">Administrateur Support Atelier</h5>
  135. <h6 class="card-subtitle mb-2 text-muted">Thales Global Services - Bordeaux, FRANCE</h6>
  136. <p class="card-text">J'ai intégré l'équipe DSI sur le campus de Bordeaux Mérignac en septembre 2017 pour un contrat professionnel
  137. d'une année afin de préparer ma licence "Concepteur développeur informatique" (RNCP niv II). Licence en poche, j'ai signé un
  138. second contrat d'une durée de deux années cette fois-ci afin de préparer mon master "expert en informatique et système d’information" (RNCP niv. I).<br>
  139. Je participe quotidiennement à la mise en place d'un système de supervision interne fonctionnant sur des outils open-source tel que Check_MK,
  140. Nagios ou encore Nagvis. Il s'agit d'un projet intéressant car il est question d'intégrer un nouvel outil tout en prenant en compte la complexité
  141. d'un réseau informatique national mais également de respecter des contraintes de sécurité lourdes.
  142. Ce projet m'a permis d'expérimenter mes connaissances en administration système Unix mais également en développement
  143. avec notamment l'utilisation des langages Python, PHP ou encore Shell.<br>
  144. Il s'agit de l'expérience la plus enrichissante à l'heure actuelle tant pour sa durée
  145. que pour son contenu.<br>
  146. </p>
  147. </div>
  148. <div class="card-footer">
  149. <strong>Concepts-clés:</strong>
  150. <h5>
  151. <span class="badge badge-primary"><i class="fa fa-hashtag" aria-hidden="true"></i> PHP</span>
  152. <span class="badge badge-primary"><i class="fa fa-hashtag" aria-hidden="true"></i> Gestion de projet</span>
  153. <span class="badge badge-primary"><i class="fa fa-hashtag" aria-hidden="true"></i> Admin. Sys. Unix</span>
  154. <span class="badge badge-primary"><i class="fa fa-hashtag" aria-hidden="true"></i> JS</span>
  155. <span class="badge badge-primary"><i class="fa fa-hashtag" aria-hidden="true"></i> Python</span>
  156. <span class="badge badge-primary"><i class="fa fa-hashtag" aria-hidden="true"></i> Shell</span>
  157. <span class="badge badge-primary"><i class="fa fa-hashtag" aria-hidden="true"></i> JenkinsCI</span>
  158. <span class="badge badge-primary"><i class="fa fa-hashtag" aria-hidden="true"></i> Groovy</span>
  159. </h5>
  160. </div>
  161. </div>
  162. </div>
  163. </div>
  164. </div>
  165. <div class="testimonies section" id="testimonies">
  166. <h2><i class="fa fa-trophy" aria-hidden="true"></i> Attestations</h2>
  167. <div class="row">
  168. <div class="col-md-6 col-sm-12">
  169. <div class="card card-reward space-bottom-card-10">
  170. <a href="#">
  171. <img src="pictures/testimonials-logo/cnil.png" class="card-img-top" alt="Logo de la Commission nationale française de l'informatique et des libertés">
  172. <div class="card-body">
  173. <h5 class="card-title">L'atelier RGPD de la CNIL</h5>
  174. <p class="card-text"><!--<span class="badge badge-danger">PDF</span> --><span class="badge badge-dark"><i class="fa fa-hourglass" aria-hidden="true"></i> En cours...</span></p>
  175. </div>
  176. </a>
  177. </div>
  178. </div>
  179. <div class="col-md-6 col-sm-12">
  180. <div class="card card-reward">
  181. <a href="files/attestation_secnumacademie.pdf">
  182. <img src="pictures/testimonials-logo/anssi.png" class="card-img-top" alt="Logo de l'Agence nationale française de la sécurité des systèmes d'information">
  183. <div class="card-body">
  184. <h5 class="card-title">SecuAcadémie de l'ANSSI</h5>
  185. <p class="card-text"><span class="badge badge-danger">PDF</span> <span class="badge badge-dark"><i class="fa fa-trophy" aria-hidden="true"></i> Obtenu le 16 mars 2019</span></p>
  186. </div>
  187. </a>
  188. </div>
  189. </div>
  190. </div>
  191. </div>
  192. <div class="school section" id="school">
  193. <h2><i class="fa fa-university" aria-hidden="true"></i> Scolarité</h2>
  194. <ul class="nav nav-pills nav-justified pb-2" id="scolarity-tab" role="tablist">
  195. <li class="nav-item">
  196. <a class="nav-link active" id="ingenierie-tab" data-toggle="tab" href="#ingenierie" role="tab" aria-controls="ingenierie" aria-selected="true">2018 - 2020</a>
  197. </li>
  198. <li class="nav-item">
  199. <a class="nav-link" id="bachelor-tab" data-toggle="tab" href="#bachelor" role="tab" aria-controls="bachelor" aria-selected="false">2015 - 2018</a>
  200. </li>
  201. </ul>
  202. <div class="tab-content" id="scolarityTabContent">
  203. <div class="tab-pane fade show active" id="ingenierie" role="tabpanel" aria-labelledby="ingenierie-tab">
  204. <div class="row">
  205. <div class="col">
  206. <div class="card mb-3">
  207. <div class="card-header text-center">
  208. <strong>Septembre 2018 - Août 2020 <span class="badge badge-success"> Actuel</span></strong>
  209. </div>
  210. <div class="card-body">
  211. <div class="card-image"><img class="card-img" src="pictures/school-logo/epsi.png" alt="Logo de l'EPSI, l'école d'ingénierie informatique"></div>
  212. <h5 class="card-title">Cursus Ingénierie
  213. </h5>
  214. <h6 class="card-subtitle mb-2 text-muted">EPSI - Bordeaux, FRANCE</h6>
  215. <p class="card-text">Dans la continuité de mon Bachelor Informatique et de mon titre RNCP Niveau I "Concepteur développeur informatique"
  216. j'ai continué ma scolarité en cycle Ingénierie pour une durée de 2 ans. À l'issue de ces deux années j'aspire à l'obtention
  217. d'un titre RNCP niveau I "Expert en Informatique et Système d’information". J'ai par la même occasion renouvelé mon contrat chez Thales
  218. pour une durée équivalente à ma scolarité: 2 ans.<br>
  219. </p>
  220. </div>
  221. <div class="card-footer">
  222. <strong>Concepts-clés:</strong>
  223. <h5>
  224. <span class="badge badge-primary"><i class="fa fa-hashtag" aria-hidden="true"></i> Gestion de projet</span>
  225. <span class="badge badge-primary"><i class="fa fa-hashtag" aria-hidden="true"></i> Agilité</span>
  226. <span class="badge badge-primary"><i class="fa fa-hashtag" aria-hidden="true"></i> IA</span>
  227. <span class="badge badge-primary"><i class="fa fa-hashtag" aria-hidden="true"></i> Étude financière</span>
  228. <span class="badge badge-primary"><i class="fa fa-hashtag" aria-hidden="true"></i> Prog. temps réel</span>
  229. <span class="badge badge-primary"><i class="fa fa-hashtag" aria-hidden="true"></i> Communication</span>
  230. </h5>
  231. </div>
  232. </div>
  233. </div>
  234. </div>
  235. </div>
  236. <div class="tab-pane fade" id="bachelor" role="tabpanel" aria-labelledby="bachelor-tab">
  237. <div class="row">
  238. <div class="col">
  239. <div class="card mb-3">
  240. <div class="card-header text-center">
  241. <strong>Septembre 2015 - Août 2018</strong>
  242. </div>
  243. <div class="card-body">
  244. <div class="card-image"><img class="card-img" src="pictures/school-logo/epsi.png" alt="Logo de l'EPSI, l'école d'ingénierie informatique"></div>
  245. <h5 class="card-title">Cursus Bachelor</h5>
  246. <h6 class="card-subtitle mb-2 text-muted">EPSI - Bordeaux, FRANCE</h6>
  247. <p class="card-text">Après avoir obtenu mon bac professionnel SEN avec mention assez bien, j'ai intégré l'EPSI de Bordeaux. Le cursus Bachelor
  248. permet d'obtenir les connaissances afin de prétendre au tire de Devops. J'ai alors réalisé 2 années en formation initiale. Grâce à Thales j'ai
  249. pu réaliser ma dernière année de cycle Bachelor en alternance et ainsi commencer à acquérir une expérience professionnelle.<br>
  250. <h5>Diplômes obtenus</h5>
  251. <div class="row">
  252. <div class="col-md-6 col-sm-12">
  253. <div class="card space-bottom-card-10">
  254. <div class="card-body">
  255. <div class="row">
  256. <div class="col-12 col-md-2 reward">
  257. <i class="fa fa-3x fa-graduation-cap" aria-hidden="true"></i>
  258. </div>
  259. <div class="col-md-10 align-self-center">
  260. Titre RNCP niveau II - "Concepteur développeur informatique"
  261. </div>
  262. </div>
  263. </div>
  264. </div>
  265. </div>
  266. <div class="col-md-6 col-sm-12">
  267. <div class="card">
  268. <div class="card-body">
  269. <div class="row">
  270. <div class="col-12 col-md-2 reward">
  271. <i class="fa fa-3x fa-graduation-cap" aria-hidden="true"></i>
  272. </div>
  273. <div class="col-md-10 align-self-center">
  274. Titre école EPSI – "Concepteur intégrateur devops"
  275. </div>
  276. </div>
  277. </div>
  278. </div>
  279. </div>
  280. </div>
  281. <h5>Documents rédigés</h5>
  282. <div class="row">
  283. <div class="col-md-6 col-sm-12">
  284. <div class="card space-bottom-card-10">
  285. <div class="card-body">
  286. <div class="row">
  287. <div class="col-12 col-md-2 reward">
  288. <i class="fa fa-3x fa-file-pdf-o" aria-hidden="true"></i>
  289. </div>
  290. <div class="col-md-10 align-self-center">
  291. Rapport d'activité <br/> <a href="https://cloud.alternanet.fr/index.php/s/dSxwwxoaMmdEqKk">https://cloud.alternanet.fr <i class="fa fa-external-link" aria-hidden="true"></i></a>
  292. </div>
  293. </div>
  294. </div>
  295. </div>
  296. </div>
  297. </div>
  298. </p>
  299. </div>
  300. <div class="card-footer">
  301. <strong>Concepts-clés:</strong>
  302. <h5>
  303. <span class="badge badge-primary"><i class="fa fa-hashtag" aria-hidden="true"></i> POO</span>
  304. <span class="badge badge-primary"><i class="fa fa-hashtag" aria-hidden="true"></i> Modélisation BDD</span>
  305. <span class="badge badge-primary"><i class="fa fa-hashtag" aria-hidden="true"></i> Tests unitaire</span>
  306. <span class="badge badge-primary"><i class="fa fa-hashtag" aria-hidden="true"></i> Oracle</span>
  307. <span class="badge badge-primary"><i class="fa fa-hashtag" aria-hidden="true"></i> Java</span>
  308. <span class="badge badge-primary"><i class="fa fa-hashtag" aria-hidden="true"></i> ITIL</span>
  309. </h5>
  310. </div>
  311. </div>
  312. </div>
  313. </div>
  314. </div>
  315. </div>
  316. </div>
  317. <div class="contact section pb-5" id="contact">
  318. <h2><i class="fa fa-envelope" aria-hidden="true"></i> Contact</h2>
  319. <ul class="list-group list-group-flush">
  320. <li class="list-group-item"><strong>Adresse email:</strong> <a href="&#x6d;&#x61;&#x69;&#x6c;&#x74;&#x6f;&#x3a;&#x68;&#x75;&#x67;&#x6f;&#x2e;&#x6c;&#x65;&#x72;&#x6f;&#x75;&#x78;&#x40;&#x61;&#x6c;&#x74;&#x65;&#x72;&#x6e;&#x61;&#x6e;&#x65;&#x74;&#x2e;&#x66;&#x72;">&#x68;&#x75;&#x67;&#x6f;&#x2e;&#x6c;&#x65;&#x72;&#x6f;&#x75;&#x78;&#x40;&#x61;&#x6c;&#x74;&#x65;&#x72;&#x6e;&#x61;&#x6e;&#x65;&#x74;&#x2e;&#x66;&#x72;</a></li>
  321. <li class="list-group-item"><strong>Adresse XMPP:</strong> <a href="&#x78;&#x6d;&#x70;&#x70;&#x3a;&#x67;&#x6f;&#x74;&#x65;&#x78;&#x78;&#x40;&#x61;&#x6c;&#x74;&#x65;&#x72;&#x6e;&#x61;&#x6e;&#x65;&#x74;&#x2e;&#x66;&#x72;">&#x67;&#x6f;&#x74;&#x65;&#x78;&#x78;&#x40;&#x61;&#x6c;&#x74;&#x65;&#x72;&#x6e;&#x61;&#x6e;&#x65;&#x74;&#x2e;&#x66;&#x72;</a> <button type="button" class="btn btn-success" data-toggle="modal" data-target="#XMPPFingerPrintsModal"><i class="fa fa-key-modern" aria-hidden="true"></i> Empreintes</button></li>
  322. <li class="list-group-item"><strong>Adresse Matrix:</strong> &#64;&#x67;&#x6f;&#x74;&#x65;&#x78;&#x78;&#58;&#x61;&#x6c;&#x74;&#x65;&#x72;&#x6e;&#x61;&#x6e;&#x65;&#x74;&#x2e;&#x66;&#x72; <button type="button" class="btn btn-success" data-toggle="modal" data-target="#matrixFingerPrintsModal"><i class="fa fa-key-modern" aria-hidden="true"></i> Empreintes</button></li>
  323. <li class="list-group-item"><strong>GPG:</strong> <a href="#" data-toggle="modal" data-target="#GPGPublicKeyModal">D957 5EB4 B797 FBA6 02E0 3239 <span class="font-weight-bold">3EA2 60A4 F0EE 1BCC</span></a></li>
  324. </ul>
  325. </div>
  326. </div>
  327. <!-- Modal XMPP -->
  328. <div class="modal fade" id="XMPPFingerPrintsModal" tabindex="-1" role="dialog" aria-labelledby="XMPPFingerPrintsModalTitle" aria-hidden="true">
  329. <div class="modal-dialog modal-xl">
  330. <div class="modal-content">
  331. <div class="modal-header">
  332. <h5 class="modal-title" id="XMPPFingerPrintsModalTitle"><i class="fa fa-key-modern" aria-hidden="true"></i> Empreintes OMEMO</h5>
  333. <button type="button" class="close" data-dismiss="modal" aria-label="Close">
  334. <span aria-hidden="true">&times;</span>
  335. </button>
  336. </div>
  337. <div class="modal-body">
  338. <table class="table table-sm table-borderless">
  339. <thead>
  340. <tr>
  341. <th scope="col">Type</th>
  342. <th scope="col">Appareil</th>
  343. <th scope="col">Empreinte</th>
  344. </tr>
  345. </thead>
  346. <tbody>
  347. <tr>
  348. <td><i class="fa fa-laptop" aria-hidden="true" tittle="Ordinateur portable"></i></td>
  349. <td>Zoya</td>
  350. <td><strong>cccbfd47 703e6027 b5e8a6ed 3eaa818d 162f4601 08d959cc 76281d8c b51a1307</strong></td>
  351. </tr>
  352. <tr>
  353. <td><i class="fa fa-desktop" aria-hidden="true" title="Ordinateur fixe"></i></td>
  354. <td>Thora</td>
  355. <td><strong>1f2e7a4a 2f6bfa78 b860ad31 af39d257 fa941171 85a59c64 51b4ce56 01d97452</strong></td>
  356. </tr>
  357. <tr>
  358. <td><i class="fa fa-mobile fa-2x" aria-hidden="true" title="Smartphone"></i></td>
  359. <td>Xiaomi Mi Note 2</td>
  360. <td><strong>a64b51e5 4dc435d2 53a312ea 4b28e2eb 58fb85c8 d3693ca4 45a1aa9a 82b37267</strong></td>
  361. </tr>
  362. </tbody>
  363. </table>
  364. </div>
  365. </div>
  366. </div>
  367. </div>
  368. <!-- Modal Matrix -->
  369. <div class="modal fade" id="matrixFingerPrintsModal" tabindex="-1" role="dialog" aria-labelledby="matrixFingerPrintsModalTitle" aria-hidden="true">
  370. <div class="modal-dialog modal-xl">
  371. <div class="modal-content">
  372. <div class="modal-header">
  373. <h5 class="modal-title" id="matrixFingerPrintsModalTitle"><i class="fa fa-key-modern" aria-hidden="true"></i> Empreintes Matrix</h5>
  374. <button type="button" class="close" data-dismiss="modal" aria-label="Close">
  375. <span aria-hidden="true">&times;</span>
  376. </button>
  377. </div>
  378. <div class="modal-body">
  379. <table class="table table-sm table-borderless">
  380. <thead>
  381. <tr>
  382. <th scope="col">Type</th>
  383. <th scope="col">Appareil</th>
  384. <th scope="col">Identifiant</th>
  385. <th scope="col">Clé</th>
  386. </tr>
  387. </thead>
  388. <tbody>
  389. <tr>
  390. <td><i class="fa fa-laptop" aria-hidden="true" tittle="Ordinateur portable"></i></td>
  391. <td>Zoya</td>
  392. <td>VJPVOAKVBV</td>
  393. <td><strong>Np1R BOUJ JkNo DlVq y0zf Ib/G D3+T b1zN lYJ8 HrOU /CY</strong></td>
  394. </tr>
  395. <tr>
  396. <td><i class="fa fa-desktop" aria-hidden="true" title="Ordinateur fixe"></i></td>
  397. <td>Thora</td>
  398. <td>FZAVPQUXUY</td>
  399. <td><strong>gVDi qv0O HXMW n5K/ +KCQ yw6u oIWb xO7e q71e tvFC Pzs</strong></td>
  400. </tr>
  401. <tr>
  402. <td><i class="fa fa-mobile fa-2x" aria-hidden="true" title="Smartphone"></i></td>
  403. <td>Xiaomi Mi Note 2</td>
  404. <td>DKYWVUPUNU</td>
  405. <td><strong>0ztW IDfV F25G a5VJ b+eL vZUJ b+NZ KPnc go7b wFl4 hI0</strong></td>
  406. </tr>
  407. </tbody>
  408. </table>
  409. </div>
  410. </div>
  411. </div>
  412. </div>
  413. <!-- Modal GPG -->
  414. <div class="modal fade" id="GPGPublicKeyModal" tabindex="-1" role="dialog" aria-labelledby="GPGPublicKeyModalTitle" aria-hidden="true">
  415. <div class="modal-dialog modal-xl">
  416. <div class="modal-content">
  417. <div class="modal-header">
  418. <h5 class="modal-title" id="GPGPublicKeyModalTitle"><i class="fa fa-gnupg" aria-hidden="true"></i> Clé GPG publique <a class="btn btn-success" download="hleroux.pub.txt" href="hleroux.pub.txt" role="button"><i class="fa fa-download" aria-hidden="true"></i> Télécharger</a> <small class="text-muted">SHA256: b68b049f3086e3cbe666b8cc7b8d830535712d28d352b674920539d5aee70d50</small></h5>
  419. <button type="button" class="close" data-dismiss="modal" aria-label="Close">
  420. <span aria-hidden="true">&times;</span>
  421. </button>
  422. </div>
  423. <div class="modal-body">
  424. <textarea class="form-control" rows="39" readonly>
  425. -----BEGIN PGP PUBLIC KEY BLOCK-----
  426. mQENBFv1hZ4BCADGEixiI4SGgqdl77B4xLjzkzeesrBm3iXWCO/9ln4FQeMXjEdM
  427. 8yT7PTXxsLsvLuiPzP+wAtmRm9GOaSsjphd+JHQN5ff7QjJ2SCJSIsq9JkhEPEoX
  428. ye2yv2Khatwrexkrr9EfWIAphQE+TiVWiQbUUvolOcWfw868Z26i6EDaU3LLhOv+
  429. Gn2WPZEGxlilPiJEv+aZuP+aLcKxPth5KyUvavEL0UvJlcAu5vE69BdZ/kU6m68E
  430. 0hOINGjgYlcF9r6AlwCkLWRSbM1yJvw3KJb4KMfiplHz7bZqywnuURJ5vsF+Fomt
  431. cIK2qBxCqJAxPyoc4bzvdmR2bArNHrmCQsYpABEBAAG0J0h1Z28gTEVST1VYIDxo
  432. dWdvLmxlcm91eEBhbHRlcm5hbmV0LmZyPokBVAQTAQgAPhYhBNlXXrS3l/umAuAy
  433. OT6iYKTw7hvMBQJb9YWeAhsDBQkDwmcABQsJCAcCBhUKCQgLAgQWAgMBAh4BAheA
  434. AAoJED6iYKTw7hvMn5EH/jp855U0gDHEQIYkFk+Yl5WW0wUvfSd34M4JxSHywANG
  435. YVFGh5SN+fzP0v7RbLJvCnbADvAQWijjHv+Mr/EbM/HiwbHw4e8plG0eW7xiyDdq
  436. 7bTny0o2sEH1OoRLUIkYTo8GmNboEmVSPEWYI/XyefeA0eY1hbZBjBhKaeqTDiXi
  437. wG4czBechF7O2TBmOjHXGqJ/r/aTPRvn8cGdpqe4PKmXSNCEJ6l3Ekw3YdwCoUbf
  438. qGTtHtLb4k+7Vb4OdtXfEqnV2vDuNIazos1CjjYjzh2idFfEOlrmdRw2QE4dBa1Z
  439. S6VdOKXENnzIvEevsL4UEt7BTuhfWPp7wOzwQ+IJvWi0Ikh1Z28gTEVST1VYIDxo
  440. dWdvLmxlcm91eDJAZXBzaS5mcj6JAVQEEwEIAD4WIQTZV160t5f7pgLgMjk+omCk
  441. 8O4bzAUCW/lAsAIbAwUJA8JnAAULCQgHAgYVCgkICwIEFgIDAQIeAQIXgAAKCRA+
  442. omCk8O4bzD3aCACW8rrSCFCGkLGJQy04fWENQhkx6oF1zeFl9GJXFG7SLbE+ccOK
  443. N2tirwVI5OC59dRLbQuQeS2ZMKgk0Tbb1jKn45dlkVuw7L7bS3sdSYZZO6veXG9p
  444. juqQgI9prJ/f6LPOyv2Te1/a+mghxhfPl/ht6vzkldrUdmy/PkQVMRqZJBE20jZB
  445. qx8FVqiyYYBu4V7bQuw32VPHeDnl0O0xR2dokbCn4rt++BK7rErH/0kf+5Xu9JAH
  446. 0UdaOTreIF6ais/8/b2NeCJQd2a3qYAxCPPdsdLYzI6+13Oqz+EVxiZCQaGUCpaC
  447. fIGW+Pogs8Fe/Hd0wtGrLPKde9CsmabNwzsQuQENBFv1hZ4BCADynKXxVJ54OFS2
  448. iNAwAHgj7JYpdn3TdZzDOfCkqsUJzyisUat1SWI5lV44dPWXymfJUVW91Zft32k6
  449. j5FVVVMGOBxvMDyr8urYGEx2wD9KGz8A7Ejzg0DFi/AbjTHeOWaPflRVna4obA9J
  450. rm8bsjdmzq7KCb4S428+jFOy8FcyEw1vLhhK3yO9A1g9B6eBEDfOn8uALekBZAU5
  451. 4s64XVKxmMy8Ms3m/MwFmQ2wyD9IhpXwW+rhO9oG7qqmFEN9yskyCAV+1PE8Vcpx
  452. 6n4hLQXqC8Mo8N/pdMxysGtDzlGWFr8SI/ogH48k6AglnXN67fd58eVxStehNY3N
  453. xiwWrAPFABEBAAGJATwEGAEIACYWIQTZV160t5f7pgLgMjk+omCk8O4bzAUCW/WF
  454. ngIbDAUJA8JnAAAKCRA+omCk8O4bzOhMB/4jicNaOhteRGN5wk76rKHndwDQ1jrM
  455. cRkGL670OnN/SK4if7X1GFBeKDeAZiItxmZZ9VxCuX90M8CRS0dG2x8GaLJcy0cQ
  456. Ub/9ic+FNJOQYFTqIhXWcqnJ1DrOnliR4NZwnkv/CQ4XffzIBJjgmdakdwVA4SwU
  457. XSM+2R+IzkjDCGgvcmWQP92rOgfy2YTtZnyY3rYD0PjGKcBRjTtDPXtfGWg7cnZk
  458. 2PTEPV50rCXTw8RYRWHudJ0ubR0zrfn6C5IVqwtoiRSeO2BRcOd6o3PK95ejpiHx
  459. PS+/h4OsXkQ0g6Gov8F4xvWPVqVlqYRzAgehdmKCeoGkjL4iAM4j9aAW
  460. =rtOt
  461. -----END PGP PUBLIC KEY BLOCK-----
  462. </textarea>
  463. </div>
  464. </div>
  465. </div>
  466. </div>
  467. <footer class="footer">
  468. <div class="container">
  469. <span class="text-muted icon-footer">
  470. <a href="&#x78;&#x6d;&#x70;&#x70;&#x3a;&#x67;&#x6f;&#x74;&#x65;&#x78;&#x78;&#x40;&#x61;&#x6c;&#x74;&#x65;&#x72;&#x6e;&#x61;&#x6e;&#x65;&#x74;&#x2e;&#x66;&#x72;" title="Adresse XMPP: &#x67;&#x6f;&#x74;&#x65;&#x78;&#x78;&#x40;&#x61;&#x6c;&#x74;&#x65;&#x72;&#x6e;&#x61;&#x6e;&#x65;&#x74;&#x2e;&#x66;&#x72;"><i class="fa fa-xmpp fa-2x"></i></a>
  471. <a href="&#x6d;&#x61;&#x69;&#x6c;&#x74;&#x6f;&#x3a;&#x68;&#x75;&#x67;&#x6f;&#x2e;&#x6c;&#x65;&#x72;&#x6f;&#x75;&#x78;&#x40;&#x61;&#x6c;&#x74;&#x65;&#x72;&#x6e;&#x61;&#x6e;&#x65;&#x74;&#x2e;&#x66;&#x72;"><i class="fa fa-envelope fa-2x"></i></a>
  472. <a href="#" data-toggle="modal" data-target="#GPGPublicKeyModal" title="Clé publique GPG"><i class="fa fa-gnupg fa-2x"></i></a>
  473. <a href="https://git.alternanet.fr/gotexx" title="Profil Gitea"><i class="fa fa-git fa-2x"></i></a>
  474. <a href="https://mstdn.alternanet.fr/@gotexx" title="Profil Mastodon"><i class="fa fa-mastodon fa-2x"></i></a>
  475. <a href="https://git.alternanet.fr/gotexx/hugo-perso">Code source</a>
  476. </span>
  477. </div>
  478. </footer>
  479. </body>
  480. </html>