commit 55cf9d663627faa193beb478545b1ed7e2fe75e4 Author: vincent-peugnet Date: Tue Nov 11 14:21:34 2025 +0100 first draft version diff --git a/assets/Banquise-Regular.woff b/assets/Banquise-Regular.woff new file mode 100644 index 0000000..9454177 Binary files /dev/null and b/assets/Banquise-Regular.woff differ diff --git a/assets/Dymo.ttf b/assets/Dymo.ttf new file mode 100644 index 0000000..4ae075c Binary files /dev/null and b/assets/Dymo.ttf differ diff --git a/assets/Erika-Type.ttf b/assets/Erika-Type.ttf new file mode 100644 index 0000000..c581164 Binary files /dev/null and b/assets/Erika-Type.ttf differ diff --git a/assets/background.jpg b/assets/background.jpg new file mode 100644 index 0000000..88531b7 Binary files /dev/null and b/assets/background.jpg differ diff --git a/assets/notebook.jpg b/assets/notebook.jpg new file mode 100644 index 0000000..9414892 Binary files /dev/null and b/assets/notebook.jpg differ diff --git a/assets/paper.avif b/assets/paper.avif new file mode 100644 index 0000000..3aef4ec Binary files /dev/null and b/assets/paper.avif differ diff --git a/assets/stickers/arbre-hetre.webp b/assets/stickers/arbre-hetre.webp new file mode 100644 index 0000000..25fc852 Binary files /dev/null and b/assets/stickers/arbre-hetre.webp differ diff --git a/assets/stickers/bac-e2.webp b/assets/stickers/bac-e2.webp new file mode 100644 index 0000000..5dc3f98 Binary files /dev/null and b/assets/stickers/bac-e2.webp differ diff --git a/assets/stickers/clavier.webp b/assets/stickers/clavier.webp new file mode 100644 index 0000000..cdb50d6 Binary files /dev/null and b/assets/stickers/clavier.webp differ diff --git a/assets/stickers/clef.webp b/assets/stickers/clef.webp new file mode 100644 index 0000000..e84b8bd Binary files /dev/null and b/assets/stickers/clef.webp differ diff --git a/assets/stickers/ecran.webp b/assets/stickers/ecran.webp new file mode 100644 index 0000000..01abf76 Binary files /dev/null and b/assets/stickers/ecran.webp differ diff --git a/assets/stickers/foin.webp b/assets/stickers/foin.webp new file mode 100644 index 0000000..5a25c86 Binary files /dev/null and b/assets/stickers/foin.webp differ diff --git a/assets/stickers/machineacoudre.webp b/assets/stickers/machineacoudre.webp new file mode 100644 index 0000000..efe4814 Binary files /dev/null and b/assets/stickers/machineacoudre.webp differ diff --git a/assets/stickers/tracteur.webp b/assets/stickers/tracteur.webp new file mode 100644 index 0000000..8cb2127 Binary files /dev/null and b/assets/stickers/tracteur.webp differ diff --git a/base.css b/base.css new file mode 100644 index 0000000..84e4ba2 --- /dev/null +++ b/base.css @@ -0,0 +1,54 @@ +@font-face { + font-family: Banquise; + src: url(assets/Banquise-Regular.woff); +} + +@font-face { + font-family: Dymo; + src: url(assets/Dymo.ttf); +} + +@font-face { + font-family: Erika; + src: url(assets/Erika-Type.ttf); +} + +html, body { + height: 100%; + margin: 0; +} + +a { + text-decoration: none; + color: black; +} + +main { + background-color: #413f43; + background-image: url(assets/background.jpg); + background-repeat: no-repeat; + background-size: cover; +} + + +main h1, main h2 { + font-family: Banquise; + color: white; +} + +main h1 { + font-size: 8em; +} + +nav, footer, aside { + background: #d7d7d7; + background: url(assets/paper.avif); + padding: 5px; + font-family: Erika; +} + +nav a, footer a, aside a { + font-family: Dymo; + font-size: 3em; +} + diff --git a/drag.css b/drag.css new file mode 100644 index 0000000..6e97cd7 --- /dev/null +++ b/drag.css @@ -0,0 +1,28 @@ + + +main img.draggable { + max-width: 150px; + max-height: 150px; + position: absolute; + filter: saturate(2); +} + + +.draggable { + cursor: move; + position: relative; + width: fit-content; + user-select: none; + z-index: 1; + filter: drop-shadow(5px 3px 2px #000000b7); +} + +span.draggable { + display: inline-block; + /* text-shadow: 1px 1px black, 0px 1px black, -1px 0px black, -1px -1px black; */ +} + +.draggable[data-moving="1"] { + transform: rotate(-3deg); + filter: drop-shadow(15px 15px 6px #20202052); +} diff --git a/drag.js b/drag.js new file mode 100644 index 0000000..2f24f4a --- /dev/null +++ b/drag.js @@ -0,0 +1,89 @@ +const stepSize = 100; +const main = document.querySelector('main'); +const draggables = document.querySelectorAll(".draggable"); +const randomStarts = document.querySelectorAll(".randomStart"); + +var zIndex = 2; + +activateDraggables(); + +/** + * + * @param {number} n + * @returns {number} + */ +function stepedSize(n) { + return stepSize * Math.round(n / stepSize); +} + +function move(e) { + e.preventDefault(); + let target = e.target; + target.style['z-index'] = zIndex; + zIndex++; + + target.moving = true; + + target.setAttribute('data-moving', '1'); + + if (e.clientX) { + target.oldX = e.clientX; // If they exist then use Mouse input + target.oldY = e.clientY; + } else { + target.oldX = e.touches[0].clientX; // Otherwise use touch input + target.oldY = e.touches[0].clientY; + } + + target.oldLeft = window.getComputedStyle(target).getPropertyValue('left').split('px')[0] * 1; + target.oldTop = window.getComputedStyle(target).getPropertyValue('top').split('px')[0] * 1; + + document.addEventListener('mousemove', drag); + document.addEventListener('touchmove', drag, {passive: true}); + + function drag(event) { + event.preventDefault(); + + if (!target.moving) { + return; + } + if (event.clientX) { + target.distX = event.clientX - target.oldX; + target.distY = event.clientY - target.oldY; + } else { + target.distX = event.touches[0].clientX - target.oldX; + target.distY = event.touches[0].clientY - target.oldY; + } + + newLeft = target.oldLeft + target.distX; + newTop = target.oldTop + target.distY; + target.style.left = stepedSize(newLeft) + "px"; + target.style.top = stepedSize(newTop) + "px"; + } + + function endDrag() { + target.moving = false; + target.setAttribute('data-moving', '0'); + } + document.addEventListener('mouseup', endDrag) + document.addEventListener('touchend', endDrag) +} + +function activateDraggables() { + for (var draggable of draggables) { + draggable.addEventListener('mousedown', move); + draggable.addEventListener('touchstart', move, {passive: true}); + } +} + +function randomizeDragables() { + 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"; + } +} + +document.addEventListener("DOMContentLoaded", randomizeDragables); diff --git a/home.css b/home.css new file mode 100644 index 0000000..39f0bad --- /dev/null +++ b/home.css @@ -0,0 +1,49 @@ +main { + display: block; + color: black; + overflow: hidden; + width: 100%; + min-height: 1000px; +} + +footer { + display: block; + height: 100px; + text-align: center; +} + +main h1 { + position: relative; + text-align: center; + margin: auto; + width: 100%; + font-size: 8em; + margin-top: 5%; +} + +main h2 { + margin: 4% auto; + text-align: center; + font-size: 4em; +} + +main p { + margin: 1%; + padding: 1%; + background: white; + background: url(assets/notebook.jpg); + /* border: solid 1px; */ + opacity: 0.92; + display: inline-block; +} + +section { + max-width: 1400px; + font-size: 1.5em; + text-align: center; + font-family: Erika; + margin: auto; + margin-bottom: 100px; + columns: 560px; + padding: 2%; +} diff --git a/index.html b/index.html new file mode 100644 index 0000000..3b45018 --- /dev/null +++ b/index.html @@ -0,0 +1,96 @@ + + + + + + + + + + stickers + + + + +
+ + + + + + + + + + + + + + + + + + +

+ Camp + Interhack + 2026 +

+ +

+ du 5 au 9 Juillet + à l'Antenne +

+ + +
+

Il est venu le temps du Camp Interhack !
+ Un grand rassemblement des membres et ami.e.s des hackerspaces de France, pour partager des + connaissances, questionner nos techniques, et réinventer ensemble nos manières de faire vivre.

+ +

Durant quatre jours, L’Interhack investit L'Antenne (Sévérac - 44) pour transformer ce + lieu en terrain + d’expérimentations et de rencontres : des ateliers, des tables rondes, des démonstrations, des + installations, des concerts, des projections et des moments informels — le tout imaginé, fabriqué et + animé par et pour la communauté.

+ +

Ici, on parle autant de machines que de mécaniques humaines, de savoir-faire artisanaux + que de + technologies numériques, de détournement que de réappropriation, d’éducation populaire que de poésie du + quotidien.

+ +

Le Camp InterHack, c’est aussi un espace pour ajouter de l’intime et du sensible aux + techniques, pour + explorer la ruralité comme terrain fertile d’innovation, et pour déconstruire les rapports de domination + qui traversent nos outils, nos corps et nos collectifs.

+ +

On vient ici pour apprendre, fabriquer, détourner, réparer, hacker les structures + autant que les + imaginaires.
+ On y croise des bricoleur·euses, des artistes, des chercheur·euses, des paysan·nes, des codeur·euses, + des rêveur·euses.
+ On y célèbre la diversité des hack(h)eureuses et des formes de hacking, loin de l’image du hacker + solitaire, blanc et capuché derrière son écran.

+ +

Le programme se compose au fil des propositions : chacun·e est invité·e à contribuer, + qu’il s’agisse + d’une idée naissante ou d’un projet longuement mûri. Les croisements entre les pratiques, les + disciplines et les vécus sont encouragés — parce que c’est là que se fabrique la richesse du commun.

+ +

Venez participer à quatre jours d’autonomie joyeuse, de curiosité partagée et de + réinvention + collective.
+ Seule exigence, respecter toutes les marginalités, originalités, bizarreries et normaleries de + chacun·es.

+ +
+
+ + + + diff --git a/poster.css b/poster.css new file mode 100644 index 0000000..cb1ed6a --- /dev/null +++ b/poster.css @@ -0,0 +1,33 @@ + +body { + background: #434343; +} + +aside { + background: url(assets/notebook.jpg); + width: fit-content; +} + +main { + overflow: hidden; + max-width: 21cm; + aspect-ratio: 1 / 1.414; + box-shadow: 5px 5px 5px #00000085; + margin: 50px auto; + position: relative; +} + +@page { + size: portrait; + margin: 0; +} + +@media print { + body main { + margin: 0 !important; + } + + aside, footer, nav { + display: none; + } +} diff --git a/poster.html b/poster.html new file mode 100644 index 0000000..10d992d --- /dev/null +++ b/poster.html @@ -0,0 +1,40 @@ + + + + + + + + + + stickers + + + + + +
+ + + + + + + + + +

+ Camp + Interhack + 2026 +

+ +
+ + +