css/base.css

@@ -1,31 +1,21 @@
-
-/* Primary Font */
 @font-face {
-    font-family: MonTrappist;
-    src: url(../assets/fonts/MonTrappist-Black.woff);
+    font-family: Banquise;
+    src: url(../assets/Banquise-Regular.woff);
 }
 
-/* Secondary Font */
 @font-face {
-    font-family: Segoesc;
-    src: url(../assets/fonts/segoesc.ttf);
+    font-family: Dymo;
+    src: url(../assets/Dymo.ttf);
 }
 
-:root {
-    --primary-bg-color: black; /* global scope */
-    --accent-violet:  #8800FF;
-    --accent-yellow:  #ffbf3e;
-    --accent-orange: #FF4E00 ;
-    --accent-minor-blue: #33D8D8;
-    --text-color-primary: #FFFFFF;
+@font-face {
+    font-family: Erika;
+    src: url(../assets/Erika-Type.ttf);
 }
 
 html, body {
+    height: 100%;
     margin: 0;
-    font-family: "Verdana", "Helvetica", "Arial", sans-serif;
-    color: var(--text-color-primary);
-    background: var(--primary-bg-color);
-    overflow-x: hidden; /* empêche les stickers de déborder horizontalement */
 }
 
 img {
@@ -33,106 +23,45 @@ img {
 }
 
 a {
-    color: inherit;
+    text-decoration: none;
+    color: black;
 }
 
-nav a, footer a {
-    color: black;
-    text-decoration: none;
+main {
+    /* background-color: #413f43;*/
+    background: #058C9E;
+    background: radial-gradient(at left top, #058C9E, #BC5180);
+    /* background-repeat: no-repeat;
+    background-size: cover; */
 }
 
+
 main h1, main h2, main h3 {
-    font-family: MonTrappist;
+    font-family: Banquise;
     color: white;
-    z-index: 20;
+    z-index: 2;
 }
 
 main h1 {
-    position: relative;
-    text-align: center;
-    margin: auto;
-    width: 50%;
-    font-size: clamp(4em, 14vw, 8em);
-    margin-top: 5%;
-    max-width: 1400px;
-}
-
-main h2 {
-    position: relative;
-    margin: 12% auto 5% auto;
-    text-align: center;
-    font-size: clamp(1.5em, 12vw, 4em);
-    font-family: segoesc;
-}
-
-main h2:first-of-type {
-    font-size: clamp(1.5em, 5vw, 5em);
-    margin: 1em auto 0.5em auto;
-}
-
-main h3 {
-    position: relative;
-    margin: auto;
-    width: 100%;
-    font-size: clamp(1.8em, 3vw, 4em);
-    margin-top: 5%;
-    margin-bottom: 2%;
-    font-weight: lighter;
-    text-align: center;
-}
-
-main section h3 {
-    text-align: left;
-}
-
-main h4 {
-  margin: 0.8em 0;
-}
-
-main p {
-    margin: 0 0 min(1em, 2%) 1%;
-    display: inline-block;
-    z-index: 3;
-}
-
-main p:last-child {
-    margin-bottom: 0;
-}
-
-section {
-    position: relative;
-    max-width: 900px;
-    font-size: 1.5em;
-    line-height: 1.3em;
-    margin: auto;
-    margin-bottom: 100px;
-    padding: 2%;
-    padding-left: min(1em, 2%);
-    z-index: 1000;
-    box-shadow: -5px 5px 0px var(--accent-yellow), -10px 10px 0px var(--accent-orange), -15px 15px 0px var(--accent-violet);
-    background-color: #000000b8;
-}
-
-section :is(h1, h2, h3, h4, h5, h6) {
-    line-height: 1em;
+    font-size: 8em;
 }
 
 nav, footer, aside {
-    background: var(--accent-violet);
+    background: #d7d7d7;
+    background: url(../assets/paper.avif);
     padding: 5px;
-    font-family: MonTrappist;
+    font-family: Erika;
     z-index: 10000;
     position: relative;
-}
-
-nav {
-    padding-left: 10%;
+    opacity: 0.95;
+    box-shadow: 0px 0px 10px #00000070;
 }
 
 nav a, footer a, aside a {
+    font-family: Dymo;
     font-size: 3em;
     display: inline-block;
-    margin: 0.1em 0.3em;
+    margin-right: 1em;
 }
 
 nav a.current {
@@ -143,6 +72,8 @@ footer a:hover, nav a:hover {
     transform: rotate(-2deg);
 }
 
+
+
 footer {
     display: block;
     text-align: center;
@@ -157,58 +88,3 @@ footer {
         align-items: center;
     }
 }
-
-main > img {
-    object-fit: scale-down;
-}
-
-figcaption {
-  font-size: 0.6em;
-  line-height: initial;
-}
-
-.btn-nice {
-    color: #FFFFFF;
-    text-shadow: -2px 2px 0px var(--accent-orange), -4px 4px 0px var(--accent-violet);
-    color: var(--accent-yellow);
-    font-size: 1.2em;
-    text-align: center;
-    margin: auto;
-    position: relative;
-    display: block;
-    font-weight: bold;
-}
-
-#camp {
-    font-family: segoesc;
-    float: left;
-    margin-left: 10%;
-    line-height: 0.8em;
-}
-
-#interhack {
-    text-shadow: -5px 5px 0px var(--accent-orange), -10px 10px 0px var(--accent-violet);
-    color: var(--accent-yellow);
-    margin-right: 10%;
-    line-height: 0.5em;
-}
-
-code {
-    background: #ffffff1f;
-    padding: 0.2em 0.4em;
-    border-radius: 0.2em;
-    margin-right: 0.5ex;
-}
-
-.btn-nice code {
-    background: none;
-    padding: 0;
-    margin-right: 0;
-}
-
-@media (max-width: 500px) {
-    /* Hide stickers on mobile */
-    .randomStart {
-        display: none;
-    }
-}

css/drag.css

@@ -1,10 +1,10 @@
 
 
 main img.draggable {
-    max-width: 200px;
-    max-height: 200px;
+    max-width: 150px;
+    max-height: 150px;
     position: absolute;
-    z-index: 1;
+    filter: saturate(2);
 }
 
 

css/guide.css

@@ -0,0 +1,112 @@
+body {
+    background-image: radial-gradient(at left top, #058C9E, #BC5180);
+    background-repeat: no-repeat;
+    background-attachment: fixed;
+}
+
+main {
+    width: 100%;
+    max-width: 800px;
+    margin-left: auto;
+    margin-right: auto;
+    background: none;
+    padding-bottom: 100px;
+    font-family: Erika;
+    line-height: 1.5;
+}
+
+main > * {
+    width: 100%;
+    background: linear-gradient(to top, rgba(255,255,255,0.5)), url(../assets/notebook.jpg), white;
+    box-sizing: border-box;
+    margin: 0;
+    background-size: 100% auto;
+    padding-bottom: 1em;
+    filter: drop-shadow(5px 3px 2px #000000b7);
+    padding-left: 15px;
+    padding-right: 15px;
+    z-index: 1;
+    position: relative;
+    max-width: 100%;
+}
+
+main > img {
+    object-fit: scale-down;
+}
+
+main > .sticker {
+    background: none;
+    z-index: 0;
+}
+
+main > *.draggable:not(.sticker) {
+
+    &:not(h2) {
+        width: 100%;
+    }
+
+    &:not(h1):not(h2):hover {
+        animation: none;
+    }
+}
+
+
+main ul,
+main ol,
+main dl {
+    padding-left: calc(1em + 15px);
+}
+
+main h1 {
+    text-align: center;
+    font-size: 4rem;
+}
+
+main h1,
+main h2 {
+    background: none;
+    padding-top: 1.5em;
+    padding-left: 0;
+    padding-right: 0;
+}
+
+@media screen and (max-width: 800px) {
+    main h2 {
+        padding-left: 1em;
+    }
+}
+
+main h1 + *,
+main h2 + * {
+    padding-top: 1em;
+}
+
+main h1 small {
+    display: block;
+    background: url(../assets/notebook.jpg);
+    color: black;
+    font-family: Erika;
+    font-size: 2.5rem;
+    width: fit-content;
+    max-width: 90%;
+    margin-left: auto;
+    margin-right: auto;
+    transform: translateY(-0.3em) rotate(-2deg);
+}
+
+main pre {
+    white-space: pre-wrap;
+}
+
+main a {
+    text-decoration: underline;
+    color: teal;
+}
+
+main a:visited {
+    color: rebeccapurple;
+}
+
+footer {
+    padding: 1em;
+}

css/home.css

@@ -1,9 +1,63 @@
+main {
+    display: block;
+    color: black;
+    overflow: hidden;
+    width: 100%;
+    min-height: 1000px;
+}
+
+main h1 {
+    position: relative;
+    text-align: center;
+    margin: auto;
+    width: 100%;
+    font-size: clamp(4em, 14vw, 8em);
+    margin-top: 5%;
+}
+
+main h2 {
+    position: relative;
+    margin: 4% auto;
+    text-align: center;
+    font-size: clamp(2.5em, 5vw, 4em);
+}
+
+main h3 {
+    position: relative;
+    text-align: center;
+    margin: auto;
+    width: 100%;
+    font-size: clamp(2em, 4vw, 4em);
+    margin-top: 5%;
+}
+
+main p {
+    margin: 1%;
+    padding: 1%;
+    background: white;
+    background: url(../assets/notebook.jpg);
+    /* border: solid 1px; */
+    opacity: 0.92;
+    display: inline-block;
+    z-index: 3;
+}
+
+section {
+    max-width: 1400px;
+    font-size: 1.5em;
+    text-align: center;
+    font-family: Erika;
+    margin: auto;
+    margin-bottom: 100px;
+    padding: 2%;
+}
 
 .logo {
     width: 100%;
     height: 100%;
     max-width: 7em ;
     padding: 0.2em;
+    background-color:rgba(99, 99, 99, 0.2);
     box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
     margin: 1em;
     z-index: 2;
@@ -15,44 +69,4 @@
     justify-content: center;
     align-items: center;
     height: 200px;
-}
-
-/* Barre de progression */
-
-.progression {
-animation: 3s loadbar;
-width:auto;
-background-color: white;
-display: inline-block;
-padding: 0.7em 0.5em 0.5em 0.5em;
-text-wrap: nowrap;
-}
-
-@keyframes loadbar {
-  0% { width:0%; }
-}
-
-.bar {
-width : 50%;
-margin : auto;
-border : 2px solid white;
-display: inline-block;
-}
-.progression > span {
-
-display: inline-block;
-width: 100%;
-font-family: MonTrappist;
-font-size : 1.5em;
-}
-
-.lessthanhalf span {
-    padding-left: 100%;
-    color: white;
-    padding-left: calc(100% + 1em);
-}
-
-.morethanhalf {
-text-align : end;
-color:black;
-}
+}

css/poster.css

@@ -4,6 +4,7 @@ body {
 }
 
 aside {
+    background: url(../assets/notebook.jpg);
     width: fit-content;
     margin-top: 10px;
 }
@@ -15,7 +16,6 @@ main {
     box-shadow: 5px 5px 5px #00000085;
     margin: 50px auto;
     position: relative;
-    background: var(--primary-bg-color);
 }
 
 @page {

guide.template.html

@@ -13,48 +13,35 @@ BISOUS
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <link rel="stylesheet" href="css/base.css">
+    <link rel="stylesheet" href="css/guide.css">
     <link rel="stylesheet" href="css/drag.css">
 	<script src="js/drag.js" defer></script>
-    <link rel="icon" type="image/x-icon" href="assets/stickers/ecran.png">
     <title>Guide Interhack Camp 2026</title>
 </head>
 <body id="page-guide">
     <nav>
-        <a href="index.html">maison</a>
+        <a href="index.html">home</a>
         <a href="guide.html" class="current">guide</a>
         <a href="poster.html">poster</a>
     </nav>
-
     <main>
-        <img class="draggable randomStart " aria-hidden="true" src="assets/stickers/ecran.png" alt="">
-        <img class="draggable randomStart " aria-hidden="true" src="assets/stickers/ferasouder.png" alt="">
-        <img class="draggable randomStart " aria-hidden="true" src="assets/stickers/machineacoudre.png" alt="">
-        <img class="draggable randomStart " aria-hidden="true" src="assets/stickers/tracteur.png" alt="">
-
-        <img class="draggable randomStart " aria-hidden="true" src="assets/stickers/ecran.png" alt="">
-        <img class="draggable randomStart " aria-hidden="true" src="assets/stickers/ferasouder.png" alt="">
-        <img class="draggable randomStart " aria-hidden="true" src="assets/stickers/machineacoudre.png" alt="">
-        <img class="draggable randomStart " aria-hidden="true" src="assets/stickers/tracteur.png" alt="">
-
-        <img class="draggable randomStart " aria-hidden="true" src="assets/stickers/ecran.png" alt="">
-        <img class="draggable randomStart " aria-hidden="true" src="assets/stickers/ferasouder.png" alt="">
-        <img class="draggable randomStart " aria-hidden="true" src="assets/stickers/machineacoudre.png" alt="">
-        <img class="draggable randomStart " aria-hidden="true" src="assets/stickers/tracteur.png" alt="">
-
-        <h1>
-            <span id="camp" class="draggable">camp</span>
-            <br>
-            <span id="interhack" class="draggable">interhack</span>
-        </h1>
-
-        <h2>
-            <span class="draggable">Informations pratiques</span>
-        </h2>
-
-        <section>
+        <img class="draggable randomStart sticker" src="assets/stickers/arbre-hetre.webp" alt="">
+        <img class="draggable randomStart sticker" src="assets/stickers/bac-e2.webp" alt="">
+        <img class="draggable randomStart sticker" src="assets/stickers/clavier.webp" alt="">
+        <img class="draggable randomStart sticker" src="assets/stickers/clef.webp" alt="">
+        <img class="draggable randomStart sticker" src="assets/stickers/ecran.webp" alt="">
+        <img class="draggable randomStart sticker" src="assets/stickers/foin.webp" alt="">
+        <img class="draggable randomStart sticker" src="assets/stickers/machineacoudre.webp" alt="">
+        <img class="draggable randomStart sticker" src="assets/stickers/tracteur.webp" alt="">
+        <img class="draggable randomStart sticker" src="assets/stickers/arbre-hetre.webp" alt="">
+        <img class="draggable randomStart sticker" src="assets/stickers/bac-e2.webp" alt="">
+        <img class="draggable randomStart sticker" src="assets/stickers/clavier.webp" alt="">
+        <img class="draggable randomStart sticker" src="assets/stickers/clef.webp" alt="">
+        <img class="draggable randomStart sticker" src="assets/stickers/ecran.webp" alt="">
+        <img class="draggable randomStart sticker" src="assets/stickers/foin.webp" alt="">
+        <img class="draggable randomStart sticker" src="assets/stickers/machineacoudre.webp" alt="">
+        <img class="draggable randomStart sticker" src="assets/stickers/tracteur.webp" alt="">
         <!-- EDGEDOC: A la place de ce commentaire, le contenu du Edgedoc https://md.lqdn.fr/H0gKhjbKTfeM41L9bG9zUA -->
-
-        </section>
     </main>
     <footer>
         <div>

index.html

@@ -1,5 +1,4 @@
-<!DOCTYPE html>
-<html lang="fr">
+<html lang="en">
 
 	<head>
 		<meta charset="UTF-8">
@@ -8,33 +7,38 @@
 		<link rel="stylesheet" href="css/home.css">
 		<link rel="stylesheet" href="css/drag.css">
 		<script src="js/drag.js" defer></script>
-		<script src="js/progress.js" defer></script>
-		<link rel="icon" type="image/x-icon" href="assets/stickers/ecran.png">
-		<title>Camp Interhack</title>
+		<title>Camp Interhack 2026</title>
 	</head>
 
 	<body>
 		<nav>
-			<a href="index.html" class="current">maison</a>
+			<a href="index.html" class="current">home</a>
 			<a href="guide.html">guide</a>
 			<a href="poster.html">poster</a>
 		</nav>
 		<main>
 
-			<img class="draggable randomStart" aria-hidden="true" src="assets/stickers/ecran.png" alt="">
-			<img class="draggable randomStart" aria-hidden="true" src="assets/stickers/ferasouder.png" alt="">
-			<img class="draggable randomStart" aria-hidden="true" src="assets/stickers/machineacoudre.png" alt="">
-			<img class="draggable randomStart" aria-hidden="true" src="assets/stickers/tracteur.png" alt="">
-
-			<img class="draggable randomStart" aria-hidden="true" src="assets/stickers/ecran.png" alt="">
-			<img class="draggable randomStart" aria-hidden="true" src="assets/stickers/ferasouder.png" alt="">
-			<img class="draggable randomStart" aria-hidden="true" src="assets/stickers/machineacoudre.png" alt="">
-			<img class="draggable randomStart" aria-hidden="true" src="assets/stickers/tracteur.png" alt="">
+			<img class="draggable randomStart" src="assets/stickers/arbre-hetre.webp" alt="">
+			<img class="draggable randomStart" src="assets/stickers/bac-e2.webp" alt="">
+			<img class="draggable randomStart" src="assets/stickers/clavier.webp" alt="">
+			<img class="draggable randomStart" src="assets/stickers/clef.webp" alt="">
+			<img class="draggable randomStart" src="assets/stickers/ecran.webp" alt="">
+			<img class="draggable randomStart" src="assets/stickers/foin.webp" alt="">
+			<img class="draggable randomStart" src="assets/stickers/machineacoudre.webp" alt="">
+			<img class="draggable randomStart" src="assets/stickers/tracteur.webp" alt="">
+			<img class="draggable randomStart" src="assets/stickers/arbre-hetre.webp" alt="">
+			<img class="draggable randomStart" src="assets/stickers/bac-e2.webp" alt="">
+			<img class="draggable randomStart" src="assets/stickers/clavier.webp" alt="">
+			<img class="draggable randomStart" src="assets/stickers/clef.webp" alt="">
+			<img class="draggable randomStart" src="assets/stickers/ecran.webp" alt="">
+			<img class="draggable randomStart" src="assets/stickers/foin.webp" alt="">
+			<img class="draggable randomStart" src="assets/stickers/machineacoudre.webp" alt="">
+			<img class="draggable randomStart" src="assets/stickers/tracteur.webp" alt="">
 
 			<h1>
-				<span id="camp" class="draggable">camp</span>
-				<br>
-				<span id="interhack" class="draggable">interhack</span>
+				<span class="draggable">Camp</span>
+				<span class="draggable">Interhack</span>
+				<span class="draggable">2026</span>
 			</h1>
 
 			<h2>
@@ -81,37 +85,26 @@
 					Seule exigence, respecter toutes les marginalités, originalités, bizarreries et normaleries de
 					chacun·es.</p>
 			</section>
-			<h3>
-				<span>Où en est-on ?</span>
-			</h3>
-			<section id="progress">
-				<p>Il y a</p>
-				<div class="places"><span class="bar"><span id="gauge-bar" style="width:0" class="progression lessthanhalf"><span id="gauge-text">?/200</span></span></span></div>
-				<p>places déjà réservées. Ouverture prochaine des inscriptions !</p>
-				<br>
-				<p>Et nous avons reçu</p>
-				<div class="places"><span class="bar"><span id="fundraising-bar" style="width:0" class="progression lessthanhalf"><span id="fundraising-text">? %</span></span></span></div>
-				<p>des dons dont nous avons besoin (voir le détail des comptes)</p>
-			</section>
+
+
 			<h3>
 				<span>Iels y participent</span>
 			</h3>
 
-			<div class="participants">
+			<section class="participants">
 					<a href="https://lqdn.fr">
-						<img class="logo" src="assets/logos/lqdn.png" alt="La Quadrature Du Net">
+						<img class="logo" src="assets/lqdn.png" alt="La Quadrature Du Net">
 					</a>
 					<a href="https://datapaulette.org/">
-						<img class="logo" src="assets/logos/datapaulette.jpg" alt="Datapaulette">
+						<img class="logo" src="assets/datapaulette.jpg" alt="Datapaulette">
 					</a>
-					<a href="https://lebib.org"><img class="logo" src="assets/logos/lebib.png" alt="Le Bib Net"></a>
-				</div>
-			<div class="participants">
-					<a href="https://hackstub.eu/"><img class="logo" src="assets/logos/hackstub.svg" alt="La Hackstub"></a>
-					<a href="https://fuz.re"><img class="logo" src="assets/logos/fuz.png" alt="Le Fuz"></a>
-					<a href="https://labolyon.fr/"><img class="logo" src="assets/logos/lol_logo_txt.png" alt="Le Laboratoire Ouvert Lyonnais"></a>
+					<a href="https://lebib.org"><img class="logo" src="assets/lebib.png" alt="Le Bib Net"></a>
+			</section>
+			<section class="participants">
+					<a href="https://hackstub.eu/"><img class="logo" src="assets/hackstub.svg" alt="La Hackstub"></a>
+					<a href="https://fuz.re"><img class="logo" src="assets/fuz.png" alt="Le Fuz"></a>
 
-			</div>
+			</section>
 		</main>
 		<footer>
 			<div>
@@ -129,5 +122,4 @@
 			</div>
 		</footer>
 	</body>
-	
 </html>

js/drag.js

@@ -1,6 +1,10 @@
-const stepSize = 1;
+const stepSize = 100;
 const main = document.querySelector('main');
 
+for(let guideDraggable of document.querySelectorAll("#page-guide main > *")) {
+    guideDraggable.classList.add("draggable");
+}
+
 const draggables = document.querySelectorAll(".draggable");
 const randomStarts = document.querySelectorAll(".randomStart");
 
@@ -9,8 +13,8 @@ var zIndex = 2;
 activateDraggables();
 
 /**
- *
- * @param {number} n
+ * 
+ * @param {number} n 
  * @returns {number}
  */
 function stepedSize(n) {
@@ -20,6 +24,8 @@ function stepedSize(n) {
 function move(e) {
     e.preventDefault();
     let target = e.target;
+    target.style['z-index'] = zIndex;
+    zIndex++;
 
     target.moving = true;
 
@@ -62,14 +68,13 @@ function activateDraggables() {
 }
 
 function randomizeDragables() {
-    maxX = main.offsetWidth - 250;
+    maxX = main.offsetWidth - 150;
     maxY = main.offsetHeight - 150;
     for (var randomStart of randomStarts) {
         randX = Math.floor(Math.random() * maxX);
         randY = Math.floor(Math.random() * maxY);
         randomStart.style.left = randX + "px";
         randomStart.style.top = randY + "px";
-        randomStart.style.rotate = Math.floor(Math.random() * 61) - 30 + "deg";
     }
 }
 

js/progress.js

@@ -1,91 +0,0 @@
-const gauge_url = "https://api.camp.interhacker.space/api/gauge"
-const fundraising_url = "https://api.camp.interhacker.space/api/fundraising"
-const gaugeMax = 250;
-const fundraisingTotalMax = 20000;
-
-async function getGauge() {
-    // REMOVE WHEN SIGNUP FORM IS OPEN
-    return 0;
-
-    try {
-        const response = await fetch(gauge_url);
-        if (!response.ok) {
-            throw new Error(`Response status: ${response.status}`);
-        }
-
-        const result = await response.json();
-
-        return result.gauge
-    } catch (error) {
-        console.error(error.message);
-
-        return null;
-    }
-}
-
-async function getFundraisingTotal() {
-    try {
-        const response = await fetch(fundraising_url);
-        if (!response.ok) {
-            throw new Error(`Response status: ${response.status}`);
-        }
-
-        const result = await response.json();
-
-        return result.total
-    } catch (error) {
-        console.error(error.message);
-
-        return null;
-    }
-}
-
-function percentRatio(ratio) {
-    return Math.floor(ratio * 100);
-}
-
-function setAboveHalf(ratio, element) {
-    if (ratio > 0.5) {
-        element.classList.remove("lessthanhalf");
-        element.classList.add("morethanhalf");
-    }
-}
-
-async function setGauge() {
-    const gauge = await getGauge();
-
-    if (gauge !== null) {
-        const gaugeBar = document.getElementById("gauge-bar");
-        const gaugeText = document.getElementById("gauge-text");
-
-        const gaugeRatio = gauge / gaugeMax;
-
-        gaugeBar.style.setProperty("width", percentRatio(gaugeRatio) + "%");
-        gaugeText.innerText = gauge + "/" + gaugeMax;
-
-        setAboveHalf(gaugeRatio, gaugeBar);
-    }
-}
-
-async function setFundraisingTotal() {
-    const fundraising_total = await getFundraisingTotal();
-
-    if (fundraising_total !== null) {
-        const fundraisingBar = document.getElementById("fundraising-bar");
-        const fundraisingText = document.getElementById("fundraising-text");
-
-        const fundraisingRatio = fundraising_total / fundraisingTotalMax;
-
-        fundraisingBar.style.setProperty("width", percentRatio(fundraisingRatio) + "%");
-        fundraisingText.innerText = percentRatio(fundraisingRatio) + " %";
-
-        setAboveHalf(fundraisingRatio, fundraisingBar);
-    }
-}
-
-async function setProgress() {
-    setGauge();
-    setFundraisingTotal();
-}
-
-document.addEventListener("DOMContentLoaded", setProgress);

poster.html

@@ -7,13 +7,12 @@
     <link rel="stylesheet" href="css/poster.css">
     <link rel="stylesheet" href="css/drag.css">
     <script src="js/drag.js" defer></script>
-    <link rel="icon" type="image/x-icon" href="assets/stickers/ecran.png">
     <title>Camp Interhack 2026 – Poster</title>
 </head>
 
 <body>
     <nav>
-        <a href="index.html">maison</a>
+        <a href="index.html">home</a>
         <a href="guide.html" >guide</a>
         <a href="poster.html" class="current">poster</a>
     </nav>
@@ -21,20 +20,23 @@
 
     <aside>
         <a href="javascript:if(window.print)window.print()" class="print">🖨️ imprimer</a>
-        <section>
-            <p>
-                Vous pouvez arranger vous mêmes votre affiche en bougeant les informations et les autocollants !
-            </p>
-        </section>
+            <section>
+        <p>
+        Vous pouvez arranger vous mêmes votre affiche en bougeant les informations et les autocollants !
+        </p>
+    </section>
     </aside>
 
 
     <main>
-
-        <img class="draggable randomStart" src="assets/stickers/ecran.png" alt="">
-        <img class="draggable randomStart" src="assets/stickers/ferasouder.png" alt="">
-        <img class="draggable randomStart" src="assets/stickers/machineacoudre.png" alt="">
-        <img class="draggable randomStart" src="assets/stickers/tracteur.png" alt="">
+        <img class="draggable randomStart" src="assets/stickers/arbre-hetre.webp" alt="">
+        <img class="draggable randomStart" src="assets/stickers/bac-e2.webp" alt="">
+        <img class="draggable randomStart" src="assets/stickers/clavier.webp" alt="">
+        <img class="draggable randomStart" src="assets/stickers/clef.webp" alt="">
+        <img class="draggable randomStart" src="assets/stickers/ecran.webp" alt="">
+        <img class="draggable randomStart" src="assets/stickers/foin.webp" alt="">
+        <img class="draggable randomStart" src="assets/stickers/machineacoudre.webp" alt="">
+        <img class="draggable randomStart" src="assets/stickers/tracteur.webp" alt="">
 
         <h1>
             <span class="draggable text">Camp</span>