diff --git a/README.md b/README.md index 2a7dfc8..5fdadf5 100644 --- a/README.md +++ b/README.md @@ -38,3 +38,7 @@ PDF can be generated thanks to `pandoc` and the good old `curl` this way: ```sh curl -s https://md.interhacker.space/u2VNUSO6S36xx5Ensc3FCw/download | pandoc -V geometry:margin=3cm -o assets/Camp-Interhack_Statuts.pdf ``` + +## Generation de la page Guide. + +La page Guide est générée depuis un Hedgedocs, en markdown, via le fichier update-guide.sh qui utilise le fichier guide.template.html. Le contenu de la page est donc un HTML basique in fine. \ No newline at end of file diff --git a/assets/datapaulette.jpg b/assets/datapaulette.jpg new file mode 100644 index 0000000..24f7f5e Binary files /dev/null and b/assets/datapaulette.jpg differ diff --git a/assets/fuz.png b/assets/fuz.png new file mode 100644 index 0000000..2a9db37 Binary files /dev/null and b/assets/fuz.png differ diff --git a/assets/hackstub.svg b/assets/hackstub.svg new file mode 100644 index 0000000..9a6a1af --- /dev/null +++ b/assets/hackstub.svg @@ -0,0 +1,16 @@ + + \ No newline at end of file diff --git a/assets/lebib.png b/assets/lebib.png new file mode 100644 index 0000000..a8e71d8 Binary files /dev/null and b/assets/lebib.png differ diff --git a/assets/lqdn.png b/assets/lqdn.png new file mode 100644 index 0000000..4e3bedd Binary files /dev/null and b/assets/lqdn.png differ diff --git a/css/base.css b/css/base.css index d3886d5..6e2fe0f 100644 --- a/css/base.css +++ b/css/base.css @@ -18,22 +18,28 @@ html, body { margin: 0; } +img { + max-width: 100%; +} + a { text-decoration: none; color: black; } main { - background-color: #413f43; - background-image: url(../assets/background.jpg); - background-repeat: no-repeat; - background-size: cover; + /* 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 h1, main h2, main h3 { font-family: Banquise; color: white; + z-index: 2; } main h1 { @@ -55,6 +61,7 @@ nav a, footer a, aside a { font-family: Dymo; font-size: 3em; display: inline-block; + margin-right: 1em; } nav a.current { @@ -72,10 +79,12 @@ footer { text-align: center; display: flex; justify-content: space-evenly; + align-items: end; } @media (max-width: 600px) { footer { flex-direction: column; + align-items: center; } -} \ No newline at end of file +} diff --git a/css/drag.css b/css/drag.css index 6e97cd7..b3b3804 100644 --- a/css/drag.css +++ b/css/drag.css @@ -17,6 +17,28 @@ main img.draggable { filter: drop-shadow(5px 3px 2px #000000b7); } +.draggable:hover { + /* Start the shake animation and make the animation last for 0.5 seconds */ + animation: shake 3s; + + /* When the animation is finished, start again */ + animation-iteration-count: infinite; +} + +@keyframes shake { + 0% { transform: translate(1px, 1px) rotate(0deg); } + 10% { transform: translate(-1px, -2px) rotate(-1deg); } + 20% { transform: translate(-2px, 0px) rotate(1deg); } + 30% { transform: translate(2px, 2px) rotate(0deg); } + 40% { transform: translate(1px, -1px) rotate(1deg); } + 50% { transform: translate(-1px, 2px) rotate(-1deg); } + 60% { transform: translate(-3px, 1px) rotate(0deg); } + 70% { transform: translate(2px, 1px) rotate(-1deg); } + 80% { transform: translate(-1px, -1px) rotate(1deg); } + 90% { transform: translate(1px, 2px) rotate(0deg); } + 100% { transform: translate(1px, -2px) rotate(-1deg); } +} + span.draggable { display: inline-block; /* text-shadow: 1px 1px black, 0px 1px black, -1px 0px black, -1px -1px black; */ diff --git a/css/guide.css b/css/guide.css new file mode 100644 index 0000000..d175b18 --- /dev/null +++ b/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; +} \ No newline at end of file diff --git a/css/home.css b/css/home.css index eb9d863..859720c 100644 --- a/css/home.css +++ b/css/home.css @@ -16,11 +16,21 @@ main h1 { } 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%; @@ -29,6 +39,7 @@ main p { /* border: solid 1px; */ opacity: 0.92; display: inline-block; + z-index: 3; } section { @@ -38,6 +49,24 @@ section { font-family: Erika; margin: auto; margin-bottom: 100px; - columns: 560px; 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; + position: relative; +} + +.participants { + display: flex; + justify-content: center; + align-items: center; + height: 200px; +} \ No newline at end of file diff --git a/guide.html b/guide.html new file mode 100644 index 0000000..1769a3c --- /dev/null +++ b/guide.html @@ -0,0 +1,190 @@ + + + + + + + + + + Guide Interhack Camp 2026 + + + +
+ + + + + + + + + + + + + + + + + +

Camp Interhack 2026 +Infos pratiques

+

Le Camp Interhack 2026 se déroulera du jeudi 2 Juillet au +dimanche 5 Juillet 2026 à l’Antenne Paulette +(47.541451, +-2.091871). L’Antenne Paulette est un hackerspace qui se trouve à +Sévérac en Loire Atlantique (44) entre Nantes et Redon, au sein d’un ancien centre +de vacances de la Poste avec dortoir, hangard, champs et forêts…

+
+ + +
+
+ + +
+

Tickets

+

Nous attendons au maximum 200 personnes au Camp. Prenez votre ticket +pour réserver votre place. Nous préfèrons ne pas dépasser la jauge de +200 personnes pour éviter de surcharger les personnes qui organisent +l’événement.

+

Le ticket pour venir au Camp est à prix libre. Vous pouvez donner ce +que vous pouvez ou voulez donner. Le prix des billet permet de financer +la réservation du lieu, la nourriture sur place, la location du materiel +et les autres frais de l’èvénement.

+

Nous n’avons pas encore finalisé le système de réservation. Il est +pas encore possible de prendre votre ticket.

+

Dormir sur place

+

Il est possible de dormir sur place. Les dortoirs peuvent accueillir +jusqu’a 54 personnes dasn un lit. Un espace camping est prévu pour poser +une tente et un parking à l’ombre pour poser votre camion si vous dormez +dedans.

+ +

Proposer une activité

+ +

Participer a l’organisation

+

Le Camp est auto-organisé et tourne grâce aux personnes qui y +participent, dans une ambiance joyeuse et démocratique. Vous pouvez +également participer en proposant votre aide sur diverses choses, que +vous soyez forte en organisation ou juste envie de passer dire coucou et +nous donner de la force !

+

Rendez-vous sur le groupe Matrix du camp : +https://matrix.to/#/#camp-space:matrix.interhacker.space

+

Comment ?

+ +

qui ?

+ +

Autre

+ +
+ + + diff --git a/guide.template.html b/guide.template.html new file mode 100644 index 0000000..c8822ae --- /dev/null +++ b/guide.template.html @@ -0,0 +1,65 @@ + + + + + + + + + + + + + Guide Interhack Camp 2026 + + + +
+ + + + + + + + + + + + + + + + + +
+ + + diff --git a/index.html b/index.html index d3b628e..4d17ca0 100644 --- a/index.html +++ b/index.html @@ -14,6 +14,7 @@
@@ -84,6 +85,26 @@ Seule exigence, respecter toutes les marginalités, originalités, bizarreries et normaleries de chacun·es.

+ + +

+ Iels y participent +

+ +
+ + + + + + + +
+
+ + + +