Ooooooook good !

content/collections/prices/pass-1-jour.md

@@ -4,5 +4,7 @@ blueprint: price
 title: 'Pass 1 Jour'
 price: 19
 updated_by: cf207a21-df92-4f9c-b7c7-897476d8f464
-updated_at: 1768580315
+updated_at: 1769870439
+sold_out: false
 ---
+Une journée de folie au milieu de machines mythiques et de joueurs de tous les horizons !

content/collections/prices/pass-3-jours.md

@@ -4,5 +4,7 @@ blueprint: price
 title: 'Pass 3 Jours'
 price: 49
 updated_by: cf207a21-df92-4f9c-b7c7-897476d8f464
-updated_at: 1768580300
+updated_at: 1769870380
+sold_out: false
 ---
+Passez 3 jours entiers avec nous, assistez aux compétitions et vivez votre meilleure vie !

content/collections/prices/pass-damage-reduce.md

@@ -1,10 +1,10 @@
 ---
 id: b55e882a-e77f-4044-94a1-daa008e8cc68
 blueprint: price
-title: 'Pass Damage Reduce'
+title: 'Damage Reduce'
 price: 39
 updated_by: cf207a21-df92-4f9c-b7c7-897476d8f464
-updated_at: 1769422568
+updated_at: 1769870356
 sold_out: true
 ---
-Pour les 100 premières places !
+Pass 3 jours a prix réduit, pour les 100 premières places vendues uniquement !

content/globals/hfs.yaml

@@ -4,4 +4,9 @@ data:
   date_start: '2026-05-29'
   date_end: '2026-05-31'
   place: 'Halle des Expositions, Evreux'
+  description: |-
+    Nouveau lieu, même passion !
+    Venez découvrir ou retrouver l'ambiance du HFS Summer dans notre nouveau fief, le Hall des Expositions d'Evreux !
+    Une bulle de nostalgie ou bornes d'arcade, flippers, consoles retro, jeux forains et LAN party à l'ancienne cohabitent dans la bonne humeur. Des tournois internationaux ou pour le fun à vivre de l'intérieur, en spectateur ou en tant que compétiteur. Prenez part à l'aventure HFS Play, embarquez avec nous pour une toute nouvelle édition XXL !
+  image: og_image.png
   lien_billetterie: 'https://www.billetweb.fr/hfs-summer-2026'

public/assets/.meta/og_image.png.yaml

@@ -0,0 +1,7 @@
+data: {  }
+size: 1029430
+last_modified: 1769866341
+width: 1985
+height: 1112
+mime_type: image/png
+duration: null

public/assets/fonts/line-icons.css

@@ -0,0 +1,947 @@
+@font-face {
+  font-family: 'LineIcons';
+  src:  url('../fonts/LineIcons.eot?tc3uo0');
+  src:  url('../fonts/LineIcons.eot?tc3uo0#iefix') format('embedded-opentype'),
+    url('../fonts/LineIcons.ttf?tc3uo0') format('truetype'),
+    url('../fonts/LineIcons.woff?tc3uo0') format('woff'),
+    url('../fonts/LineIcons.svg?tc3uo0#LineIcons') format('svg');
+  font-weight: normal;
+  font-style: normal;
+}
+
+[class^="lni-"], [class*=" lni-"] {
+  /* use !important to prevent issues with browser extensions that change fonts */
+  font-family: 'LineIcons' !important;
+  speak: none;
+  font-style: normal;
+  font-weight: normal;
+  font-variant: normal;
+  text-transform: none;
+  line-height: 1;
+
+  /* Better Font Rendering =========== */
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.lni-image:before {
+  content: "\e991";
+}
+.lni-linkedin-filled:before {
+  content: "\e9ac";
+}
+.lni-add-files:before {
+  content: "\e900";
+}
+.lni-agenda:before {
+  content: "\e901";
+}
+.lni-alarm-clock:before {
+  content: "\e902";
+}
+.lni-alarm:before {
+  content: "\e903";
+}
+.lni-amazon:before {
+  content: "\e904";
+}
+.lni-amex:before {
+  content: "\e905";
+}
+.lni-anchor:before {
+  content: "\e906";
+}
+.lni-android:before {
+  content: "\e907";
+}
+.lni-angle-double-down:before {
+  content: "\e908";
+}
+.lni-angle-double-left:before {
+  content: "\e909";
+}
+.lni-angle-double-right:before {
+  content: "\e90a";
+}
+.lni-angle-double-up:before {
+  content: "\e90b";
+}
+.lni-apartment:before {
+  content: "\e90c";
+}
+.lni-apple:before {
+  content: "\e90d";
+}
+.lni-archive:before {
+  content: "\e90e";
+}
+.lni-arrow-down-circle:before {
+  content: "\e90f";
+}
+.lni-arrow-down:before {
+  content: "\e910";
+}
+.lni-arrow-left-circle:before {
+  content: "\e911";
+}
+.lni-arrow-left:before {
+  content: "\e912";
+}
+.lni-arrow-right-circle:before {
+  content: "\e913";
+}
+.lni-arrow-right:before {
+  content: "\e914";
+}
+.lni-arrow-top-left:before {
+  content: "\e915";
+}
+.lni-arrow-top-right:before {
+  content: "\e916";
+}
+.lni-arrow-up-circle:before {
+  content: "\e917";
+}
+.lni-arrow-up:before {
+  content: "\e918";
+}
+.lni-arrows-horizontal:before {
+  content: "\e919";
+}
+.lni-arrows-vertical:before {
+  content: "\e91a";
+}
+.lni-ban:before {
+  content: "\e91b";
+}
+.lni-bar-chart:before {
+  content: "\e91c";
+}
+.lni-basketball:before {
+  content: "\e91d";
+}
+.lni-behance:before {
+  content: "\e91e";
+}
+.lni-bi-cycle:before {
+  content: "\e91f";
+}
+.lni-bitbucket:before {
+  content: "\e920";
+}
+.lni-bitcoin:before {
+  content: "\e921";
+}
+.lni-blackboard:before {
+  content: "\e922";
+}
+.lni-bluetooth:before {
+  content: "\e923";
+}
+.lni-bold:before {
+  content: "\e924";
+}
+.lni-bolt-alt:before {
+  content: "\e925";
+}
+.lni-bolt:before {
+  content: "\e926";
+}
+.lni-book:before {
+  content: "\e927";
+}
+.lni-bookmark-alt:before {
+  content: "\e928";
+}
+.lni-bookmark:before {
+  content: "\e929";
+}
+.lni-briefcase:before {
+  content: "\e92a";
+}
+.lni-brush-alt:before {
+  content: "\e92b";
+}
+.lni-brush:before {
+  content: "\e92c";
+}
+.lni-bubble:before {
+  content: "\e92d";
+}
+.lni-bug:before {
+  content: "\e92e";
+}
+.lni-bulb:before {
+  content: "\e92f";
+}
+.lni-bullhorn:before {
+  content: "\e930";
+}
+.lni-bus:before {
+  content: "\e931";
+}
+.lni-calendar:before {
+  content: "\e932";
+}
+.lni-camera:before {
+  content: "\e933";
+}
+.lni-car:before {
+  content: "\e934";
+}
+.lni-cart-full:before {
+  content: "\e935";
+}
+.lni-cart:before {
+  content: "\e936";
+}
+.lni-check-box:before {
+  content: "\e937";
+}
+.lni-check-mark-circle:before {
+  content: "\e938";
+}
+.lni-chevron-down-circle:before {
+  content: "\e939";
+}
+.lni-chevron-down:before {
+  content: "\e93a";
+}
+.lni-chevron-left-circle:before {
+  content: "\e93b";
+}
+.lni-chevron-left:before {
+  content: "\e93c";
+}
+.lni-chevron-right-circle:before {
+  content: "\e93d";
+}
+.lni-chevron-right:before {
+  content: "\e93e";
+}
+.lni-chevron-up-circle:before {
+  content: "\e93f";
+}
+.lni-chevron-up:before {
+  content: "\e940";
+}
+.lni-chrome:before {
+  content: "\e941";
+}
+.lni-circle-minus:before {
+  content: "\e942";
+}
+.lni-clipboard:before {
+  content: "\e943";
+}
+.lni-close:before {
+  content: "\e944";
+}
+.lni-cloud-check:before {
+  content: "\e945";
+}
+.lni-cloud-download:before {
+  content: "\e946";
+}
+.lni-cloud-sync:before {
+  content: "\e947";
+}
+.lni-cloud-upload:before {
+  content: "\e948";
+}
+.lni-cloud:before {
+  content: "\e949";
+}
+.lni-code:before {
+  content: "\e94a";
+}
+.lni-coffee-cup:before {
+  content: "\e94b";
+}
+.lni-cog:before {
+  content: "\e94c";
+}
+.lni-color-pallet:before {
+  content: "\e94d";
+}
+.lni-comment-reply-alt:before {
+  content: "\e94e";
+}
+.lni-comments-alt:before {
+  content: "\e94f";
+}
+.lni-comments:before {
+  content: "\e950";
+}
+.lni-construction:before {
+  content: "\e951";
+}
+.lni-control-panel:before {
+  content: "\e952";
+}
+.lni-crop:before {
+  content: "\e953";
+}
+.lni-cross-circle:before {
+  content: "\e954";
+}
+.lni-crown:before {
+  content: "\e955";
+}
+.lni-css3:before {
+  content: "\e956";
+}
+.lni-cup:before {
+  content: "\e957";
+}
+.lni-cut:before {
+  content: "\e958";
+}
+.lni-dashboard:before {
+  content: "\e959";
+}
+.lni-database:before {
+  content: "\e95a";
+}
+.lni-dinner:before {
+  content: "\e95b";
+}
+.lni-direction-alt:before {
+  content: "\e95c";
+}
+.lni-direction-ltr:before {
+  content: "\e95d";
+}
+.lni-direction-rtl:before {
+  content: "\e95e";
+}
+.lni-direction:before {
+  content: "\e95f";
+}
+.lni-display:before {
+  content: "\e960";
+}
+.lni-download:before {
+  content: "\e961";
+}
+.lni-drop:before {
+  content: "\e962";
+}
+.lni-dropbox:before {
+  content: "\e963";
+}
+.lni-drupal:before {
+  content: "\e964";
+}
+.lni-emoji-neutral:before {
+  content: "\e965";
+}
+.lni-emoji-sad:before {
+  content: "\e966";
+}
+.lni-emoji-smile:before {
+  content: "\e967";
+}
+.lni-empty-file:before {
+  content: "\e968";
+}
+.lni-enter:before {
+  content: "\e969";
+}
+.lni-envelope:before {
+  content: "\e96a";
+}
+.lni-eraser:before {
+  content: "\e96b";
+}
+.lni-exit-down:before {
+  content: "\e96c";
+}
+.lni-exit-up:before {
+  content: "\e96d";
+}
+.lni-exit:before {
+  content: "\e96e";
+}
+.lni-eye:before {
+  content: "\e96f";
+}
+.lni-facebook-filled:before {
+  content: "\e970";
+}
+.lni-facebook:before {
+  content: "\e971";
+}
+.lni-files:before {
+  content: "\e972";
+}
+.lni-film-play:before {
+  content: "\e973";
+}
+.lni-firefox:before {
+  content: "\e974";
+}
+.lni-flag-alt:before {
+  content: "\e975";
+}
+.lni-flag-cubic:before {
+  content: "\e976";
+}
+.lni-flag:before {
+  content: "\e977";
+}
+.lni-folder:before {
+  content: "\e978";
+}
+.lni-frame-contract:before {
+  content: "\e979";
+}
+.lni-frame-expand:before {
+  content: "\e97a";
+}
+.lni-full-screen:before {
+  content: "\e97b";
+}
+.lni-funnel:before {
+  content: "\e97c";
+}
+.lni-gallery:before {
+  content: "\e97d";
+}
+.lni-game:before {
+  content: "\e97e";
+}
+.lni-gift:before {
+  content: "\e97f";
+}
+.lni-git:before {
+  content: "\e980";
+}
+.lni-github:before {
+  content: "\e981";
+}
+.lni-google-plus:before {
+  content: "\e982";
+}
+.lni-graduation:before {
+  content: "\e983";
+}
+.lni-grid-alt:before {
+  content: "\e984";
+}
+.lni-grid:before {
+  content: "\e985";
+}
+.lni-hammer:before {
+  content: "\e986";
+}
+.lni-hand:before {
+  content: "\e987";
+}
+.lni-harddrive:before {
+  content: "\e988";
+}
+.lni-headphone-alt:before {
+  content: "\e989";
+}
+.lni-headphone:before {
+  content: "\e98a";
+}
+.lni-heart-filled:before {
+  content: "\e98b";
+}
+.lni-heart-pulse:before {
+  content: "\e98c";
+}
+.lni-heart:before {
+  content: "\e98d";
+}
+.lni-help:before {
+  content: "\e98e";
+}
+.lni-highlight-alt:before {
+  content: "\e98f";
+}
+.lni-highlight:before {
+  content: "\e990";
+}
+.lni-hobile:before {
+  content: "\e992";
+}
+.lni-home:before {
+  content: "\e993";
+}
+.lni-hourglass:before {
+  content: "\e994";
+}
+.lni-html5:before {
+  content: "\e995";
+}
+.lni-inbox:before {
+  content: "\e996";
+}
+.lni-indent-decrease:before {
+  content: "\e997";
+}
+.lni-indent-increase:before {
+  content: "\e998";
+}
+.lni-Infinite:before {
+  content: "\e999";
+}
+.lni-information:before {
+  content: "\e99a";
+}
+.lni-instagram-filled:before {
+  content: "\e99b";
+}
+.lni-instagram:before {
+  content: "\e99c";
+}
+.lni-italic:before {
+  content: "\e99d";
+}
+.lni-joomla:before {
+  content: "\e99e";
+}
+.lni-key:before {
+  content: "\e99f";
+}
+.lni-keyboard:before {
+  content: "\e9a0";
+}
+.lni-laptop-phone:before {
+  content: "\e9a1";
+}
+.lni-laptop:before {
+  content: "\e9a2";
+}
+.lni-layers:before {
+  content: "\e9a3";
+}
+.lni-layout:before {
+  content: "\e9a4";
+}
+.lni-leaf:before {
+  content: "\e9a5";
+}
+.lni-licencse:before {
+  content: "\e9a6";
+}
+.lni-line-dashed:before {
+  content: "\e9a7";
+}
+.lni-line-dotted:before {
+  content: "\e9a8";
+}
+.lni-line-double:before {
+  content: "\e9a9";
+}
+.lni-line-spacing:before {
+  content: "\e9aa";
+}
+.lni-link:before {
+  content: "\e9ab";
+}
+.lni-linkedin:before {
+  content: "\e9ad";
+}
+.lni-list:before {
+  content: "\e9ae";
+}
+.lni-lock:before {
+  content: "\e9af";
+}
+.lni-magnet:before {
+  content: "\e9b0";
+}
+.lni-magnifier:before {
+  content: "\e9b1";
+}
+.lni-map-marker:before {
+  content: "\e9b2";
+}
+.lni-map:before {
+  content: "\e9b3";
+}
+.lni-mastercard:before {
+  content: "\e9b4";
+}
+.lni-medall-alt:before {
+  content: "\e9b5";
+}
+.lni-medall:before {
+  content: "\e9b6";
+}
+.lni-medium:before {
+  content: "\e9b7";
+}
+.lni-menu-circle:before {
+  content: "\e9b8";
+}
+.lni-menu:before {
+  content: "\e9b9";
+}
+.lni-mic:before {
+  content: "\e9ba";
+}
+.lni-microphone:before {
+  content: "\e9bb";
+}
+.lni-minus:before {
+  content: "\e9bc";
+}
+.lni-mobile:before {
+  content: "\e9bd";
+}
+.lni-more-alt:before {
+  content: "\e9be";
+}
+.lni-more:before {
+  content: "\e9bf";
+}
+.lni-mouse:before {
+  content: "\e9c0";
+}
+.lni-move:before {
+  content: "\e9c1";
+}
+.lni-music:before {
+  content: "\e9c2";
+}
+.lni-notepad:before {
+  content: "\e9c3";
+}
+.lni-package:before {
+  content: "\e9c4";
+}
+.lni-page-break:before {
+  content: "\e9c5";
+}
+.lni-paint-bucket:before {
+  content: "\e9c6";
+}
+.lni-paint-roller:before {
+  content: "\e9c7";
+}
+.lni-paperclip:before {
+  content: "\e9c8";
+}
+.lni-paypal:before {
+  content: "\e9c9";
+}
+.lni-pencil-alt:before {
+  content: "\e9ca";
+}
+.lni-pencil:before {
+  content: "\e9cb";
+}
+.lni-phone-handset:before {
+  content: "\e9cc";
+}
+.lni-phone:before {
+  content: "\e9cd";
+}
+.lni-pie-chart:before {
+  content: "\e9ce";
+}
+.lni-pilcrow:before {
+  content: "\e9cf";
+}
+.lni-pin-alt:before {
+  content: "\e9d0";
+}
+.lni-pin-corner:before {
+  content: "\e9d1";
+}
+.lni-pin:before {
+  content: "\e9d2";
+}
+.lni-pinterest:before {
+  content: "\e9d3";
+}
+.lni-playstore:before {
+  content: "\e9d4";
+}
+.lni-plug:before {
+  content: "\e9d5";
+}
+.lni-plus:before {
+  content: "\e9d6";
+}
+.lni-pointer-down:before {
+  content: "\e9d7";
+}
+.lni-pointer-left:before {
+  content: "\e9d8";
+}
+.lni-pointer-right:before {
+  content: "\e9d9";
+}
+.lni-pointer-up:before {
+  content: "\e9da";
+}
+.lni-pointer:before {
+  content: "\e9db";
+}
+.lni-power-switch:before {
+  content: "\e9dc";
+}
+.lni-printer:before {
+  content: "\e9dd";
+}
+.lni-pulse:before {
+  content: "\e9de";
+}
+.lni-question-circle:before {
+  content: "\e9df";
+}
+.lni-quora:before {
+  content: "\e9e0";
+}
+.lni-reddit:before {
+  content: "\e9e1";
+}
+.lni-reload:before {
+  content: "\e9e2";
+}
+.lni-reply:before {
+  content: "\e9e3";
+}
+.lni-rocket:before {
+  content: "\e9e4";
+}
+.lni-rss-feed:before {
+  content: "\e9e5";
+}
+.lni-ruler-alt:before {
+  content: "\e9e6";
+}
+.lni-ruler-pencil:before {
+  content: "\e9e7";
+}
+.lni-ruler:before {
+  content: "\e9e8";
+}
+.lni-save-alt:before {
+  content: "\e9e9";
+}
+.lni-save:before {
+  content: "\e9ea";
+}
+.lni-search:before {
+  content: "\e9eb";
+}
+.lni-select:before {
+  content: "\e9ec";
+}
+.lni-share-alt:before {
+  content: "\e9ed";
+}
+.lni-share:before {
+  content: "\e9ee";
+}
+.lni-shield:before {
+  content: "\e9ef";
+}
+.lni-shift-left:before {
+  content: "\e9f0";
+}
+.lni-shift-right:before {
+  content: "\e9f1";
+}
+.lni-shortcode:before {
+  content: "\e9f2";
+}
+.lni-signal:before {
+  content: "\e9f3";
+}
+.lni-slice:before {
+  content: "\e9f4";
+}
+.lni-sort-alpha-asc:before {
+  content: "\e9f5";
+}
+.lni-sort-amount-asc:before {
+  content: "\e9f6";
+}
+.lni-soundcloud:before {
+  content: "\e9f7";
+}
+.lni-spellcheck:before {
+  content: "\e9f8";
+}
+.lni-spotify:before {
+  content: "\e9f9";
+}
+.lni-spray:before {
+  content: "\e9fa";
+}
+.lni-stamp:before {
+  content: "\e9fb";
+}
+.lni-star-empty:before {
+  content: "\e9fc";
+}
+.lni-star-filled:before {
+  content: "\e9fd";
+}
+.lni-star-half:before {
+  content: "\e9fe";
+}
+.lni-star:before {
+  content: "\e9ff";
+}
+.lni-stats-down:before {
+  content: "\ea00";
+}
+.lni-stats-up:before {
+  content: "\ea01";
+}
+.lni-strikethrough:before {
+  content: "\ea02";
+}
+.lni-stripe:before {
+  content: "\ea03";
+}
+.lni-support:before {
+  content: "\ea04";
+}
+.lni-tab:before {
+  content: "\ea05";
+}
+.lni-tag:before {
+  content: "\ea06";
+}
+.lni-target:before {
+  content: "\ea07";
+}
+.lni-teabag:before {
+  content: "\ea08";
+}
+.lni-text-align-right:before {
+  content: "\ea09";
+}
+.lni-text-align-center:before {
+  content: "\ea0a";
+}
+.lni-text-align-justify:before {
+  content: "\ea0b";
+}
+.lni-text-align-left:before {
+  content: "\ea0c";
+}
+.lni-text-format-remove:before {
+  content: "\ea0d";
+}
+.lni-text-format:before {
+  content: "\ea0e";
+}
+.lni-text-size:before {
+  content: "\ea0f";
+}
+.lni-thought:before {
+  content: "\ea10";
+}
+.lni-thumbs-down:before {
+  content: "\ea11";
+}
+.lni-thumbs-up:before {
+  content: "\ea12";
+}
+.lni-ticket-alt:before {
+  content: "\ea13";
+}
+.lni-ticket:before {
+  content: "\ea14";
+}
+.lni-timer:before {
+  content: "\ea15";
+}
+.lni-train:before {
+  content: "\ea16";
+}
+.lni-trash:before {
+  content: "\ea17";
+}
+.lni-tshirt:before {
+  content: "\ea18";
+}
+.lni-twitter-filled:before {
+  content: "\ea19";
+}
+.lni-twitter:before {
+  content: "\ea1a";
+}
+.lni-underline:before {
+  content: "\ea1b";
+}
+.lni-unlink:before {
+  content: "\ea1c";
+}
+.lni-unlock:before {
+  content: "\ea1d";
+}
+.lni-upload:before {
+  content: "\ea1e";
+}
+.lni-user:before {
+  content: "\ea1f";
+}
+.lni-users:before {
+  content: "\ea20";
+}
+.lni-vector:before {
+  content: "\ea21";
+}
+.lni-video:before {
+  content: "\ea22";
+}
+.lni-visa:before {
+  content: "\ea23";
+}
+.lni-volume-high:before {
+  content: "\ea24";
+}
+.lni-volume-low:before {
+  content: "\ea25";
+}
+.lni-volume-medium:before {
+  content: "\ea26";
+}
+.lni-volume-mute:before {
+  content: "\ea27";
+}
+.lni-wallet:before {
+  content: "\ea28";
+}
+.lni-warning:before {
+  content: "\ea29";
+}
+.lni-wheelchair:before {
+  content: "\ea2a";
+}
+.lni-wordpress-filled:before {
+  content: "\ea2b";
+}
+.lni-wordpress:before {
+  content: "\ea2c";
+}
+.lni-world-alt:before {
+  content: "\ea2d";
+}
+.lni-world:before {
+  content: "\ea2e";
+}
+.lni-write:before {
+  content: "\ea2f";
+}
+.lni-zip:before {
+  content: "\ea30";
+}
+.lni-zoom-in:before {
+  content: "\ea31";
+}
+.lni-zoom-out:before {
+  content: "\ea32";
+}

public/assets/js/main.js

@@ -101,11 +101,11 @@ document.addEventListener('DOMContentLoaded', () => {
         photoEl.addEventListener('click', () => {
             console.log('Photo clicked');
             // get next photo-full element inside the parent div
-            let fullPhoto = photoEl.parentElement.querySelector('.photo-full');
+            let fullPhoto = photoEl.parentElement.querySelector('.modal');
             if (!fullPhoto) return;
-            fullPhoto.style.display = 'block';
+            fullPhoto.classList.toggle('is-active');
             fullPhoto.addEventListener('click', () => {
-                fullPhoto.style.display = 'none';
+                fullPhoto.classList.toggle('is-active');
             })
         });
     });

public/css/site.css

@@ -12,6 +12,9 @@
     --bulma-black-s: 0%;
     --bulma-black-l: 6%;
     --bulma-body-background-color: hsl(0, 0%, 6%);
+    --bulma-danger-h: 360deg;
+    --bulma-danger-s: 69%;
+    --bulma-danger-l: 50%;
 }
 .card{
     --bulma-card-shadow: none !important;
@@ -52,6 +55,9 @@ h1{
 .section.is-fullheight{
     min-height:100lvh;
 }
+.modal{
+    --bulma-modal-content-width: 90vw;
+}
 /* -----------------------------------------------*/
 
 /*Custom classes*/
@@ -75,7 +81,7 @@ h1{
 }
 #reel{
     width:100%;
-    height:100vh;
+    height:100lvh;
     position: relative;
     background: none;
 }
@@ -85,7 +91,7 @@ video{
     right: 0;
     bottom: 0;
     left: 0;
-    height:100vh;
+    height:100lvh;
     width:100%;
     object-fit: cover;
     z-index:-20;
@@ -305,6 +311,39 @@ video{
     /*box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);*/
     aspect-ratio: 1;
 }
+a.partner-link, a.partner-link img{
+    transition: transform 0.2s ease-in-out;
+}
+a.partner-link:hover{
+    transform: scale(1.1);
+}
+a.partner-link:hover img{
+    transform: scale(0.8);
+}
+
+/*POOP*/
+/*Tooltip made specially for the link to X, a.k.a. the Nazi Dumpster Fire thing.*/
+.poop:after{
+    content: '💩';
+    position: absolute;
+    top:-100%;
+    background: var(--bulma-black);
+    color: var(--bulma-white);
+    padding: 5px 10px;
+    border-radius: 5px;
+    border: 1px solid var(--bulma-primary);
+    font-size: 2rem;
+    white-space: nowrap;
+    opacity: 0;
+    pointer-events: none;
+    transform: translateY(-10px);
+    transition: opacity 0.2s ease, transform 0.2s ease;
+}
+.poop:hover:after {
+    opacity: 1;
+    pointer-events: auto;
+    transform: translateY(-20px);
+}
 
 /*FOOTER*/
 .footer-logo{

resources/blueprints/globals/hfs.yaml

@@ -30,6 +30,21 @@ tabs:
             field:
               type: text
               display: Place
+          -
+            handle: description
+            field:
+              type: textarea
+              display: Description
+              instructions: 'Description utilisée dans les liens de preview (FB, Twitter, etc...)'
+          -
+            handle: image
+            field:
+              max_files: 1
+              container: assets
+              type: assets
+              display: Image
+              instructions: 'Image utilisée dans les liens vers le site (FB/Twitter...)'
+              mode: grid
       -
         display: BIlletterie
         fields:

resources/views/_incentiveblock.antlers.html

@@ -1,5 +1,6 @@
-<div class="incentive-block block py-3 fixed-grid has-1-cols has-2-cols-tablet">
+{{ isOdd = index % 2 }}
-    {{ isOdd = index % 2 }}
+{{# DESKTOP VERSION #}}
+<div class="is-hidden-mobile incentive-block block py-3 fixed-grid has-1-cols has-2-cols-tablet ">
     <div class="bg" style="background-image:url('{{ glide:photo q="80" width="1344" fm="webp"}}')"></div>
     <div class="grid text-content py-3">
         {{ if isOdd }} <div></div> {{ /if }}
@@ -10,3 +11,14 @@
         {{ if !isOdd }}<div></div>{{ /if }}
     </div>
 </div>
+
+{{# MOBILE VERSION #}}
+<div class="is-hidden-tablet incentive-block block py-3">
+    <img src="{{ glide:photo q="80" width="500" fm="webp"}}"/>
+    <div class="grid text-content py-3">
+        <div class="has-background-black {{ isOdd ? 'has-text-right' : '' }} px-p-5 box">
+            <div class="is-size-3-tablet has-text-primary is-uppercase block has-text-weight-bold">{{ title }}</div>
+            <p class="is-size-5-tablet">{{ description }}</p>
+        </div>
+    </div>
+</div>

resources/views/_photoblock.antlers.html

@@ -1,9 +0,0 @@
-<div class="cell has-text-centered">
-    {{? $angle = rand(-15,15); ?}}
-    <img src="{{ glide:url preset="thumbnail" fm="webp"}}"
-        data-url-full="{{ glide:url }}"
-        alt="{{ alt }}"
-        class="photo"
-        style="transform: rotate({{ $angle }}deg);">
-    <img src="{{ glide:url w="1280" q="70" fm="webp"}}" alt="{{ alt }}" class="photo-full">
-</div>

resources/views/_photoblock.antlers.php

@@ -0,0 +1,17 @@
+<div class="cell has-text-centered">
+    <?php $angle = rand(-15,15); ?>
+    <img src="{{ glide:url preset="thumbnail" fm="webp"}}"
+        data-url-full="{{ glide:url }}"
+        alt="{{ alt }}"
+        class="photo"
+        style="transform: rotate(<?php echo $angle; ?>deg);">
+    <div class="modal">
+        <div class="modal-background"></div>
+        <div class="modal-content is-fullwidth">
+            <p class="image">
+                <img src="{{ glide:url w="1280" q="70" fm="webp"}}" alt="{{ alt }}" class="is-fullwidth">
+            </p>
+        </div>
+        <button class="modal-close is-large" aria-label="close"></button>
+    </div>
+</div>

resources/views/_priceblock.antlers.html

@@ -0,0 +1,18 @@
+<div class="card">
+    <div class="card-content">
+        <p class="title">
+            {{ title }}
+        </p>
+        <p class="subtitle">{{content}}</p>
+    </div>
+    <footer class="card-footer">
+        <p class="card-footer-item {{ sold_out ? 'has-text-danger':'has-text-primary'}} has-text-weight-bolder is-size-4">
+            {{ price }} €
+        </p>
+        {{ if sold_out }}
+        <p class="card-footer-item">
+                <span class="tag is-danger has-text-white has-text-weight-bold">ÉPUISÉ</span>
+        </p>
+        {{ /if }}
+    </footer>
+</div>

resources/views/home.antlers.html

@@ -16,14 +16,14 @@
 </section>
 
 <section class="section has-background-primary has-text-black ink bottom" id="catch">
-    <div class="is-size-1 has-text-weight-bold is-uppercase container">
+    <div class="is-size-3-mobile is-size-1-tablet has-text-weight-bold is-uppercase container">
         {{ content | widont }}
     </div>
 </section>
 
 <section class="section has-background-black ink bottom yellow" id="event">
     <div class="container">
-        <h2 class="is-size-2 has-text-weight-bold is-uppercase has-text-primary block">L'évènement</h2>
+        <h2 class="is-size-2 has-text-weight-bold is-uppercase has-text-primary block mb-6">L'évènement</h2>
         {{ incentives }}
         {{ partial:_incentiveblock  }}
         {{ /incentives }}
@@ -32,7 +32,7 @@
 
 <section class="section has-background-primary has-text-black" id="tournaments">
     <div class="container">
-    <h2 class="is-size-2 has-text-weight-bold is-uppercase block">
+    <h2 class="is-size-2 has-text-weight-bold is-uppercase block  mb-6">
         Tournois
         <a class="navbar-item button is-rounded is-float-right" href="/reglement">
             Règlement
@@ -73,11 +73,13 @@
 
 <section class="section ink top yellow" id="gallery">
     <div class="container">
-        <h2 class="is-size-2 has-text-weight-bold is-uppercase block has-text-primary">Gallerie</h2>
+        <h2 class="is-size-2 has-text-weight-bold is-uppercase block has-text-primary mb-6">Gallerie</h2>
-        <div class="grid is-col-min-9 is-col-min">
+        <div class="fixed-grid has-5-cols-tablet has-2-cols-mobile">
-            {{ photos }}
+            <div class="grid">
-            {{  partial:_photoblock  }}
+                {{ photos }}
-            {{ /photos }}
+                {{  partial:_photoblock  }}
+                {{ /photos }}
+            </div>
         </div>
     </div>
 </section>
@@ -85,7 +87,7 @@
 
 <section class="section has-background-primary has-text-black" id="faq">
     <div class="container">
-        <h2 class="is-size-2 has-text-weight-bold is-uppercase block">Infos pratiques</h2>
+        <h2 class="is-size-2 has-text-weight-bold is-uppercase block mb-6">Infos pratiques</h2>
 
         <div class="faq-list">
             {{ faqs sort="order asc" }}
@@ -108,28 +110,23 @@
 
 <section class="section" id="tickets">
     <div class="container">
-        <h2 class="is-size-2 has-text-weight-bold is-uppercase block has-text-primary">Tarifs</h2>
+        <h2 class="is-size-2 has-text-weight-bold is-uppercase block has-text-primary mb-6">Tarifs</h2>
 
-        <div class="grid is-multiline">
+        <div class="grid is-multiline is-col-min-9">
             {{ collection:prices sort="order asc" limit="3" }}
-                <div class="cell block has-text-centered">
+            {{  partial:_priceblock  }}
-                    <h3 class="is-size-4 has-text-weight-bold is-uppercase mb-2">{{ title }}</h3>
-                    {{ if sold_out }}<span class="tag is-primary has-text-weight-bold">ÉPUISÉ</span>{{ /if }}
-                    <p>{{ content }}</p>
-                    <p class="is-size-1 has-text-weight-bold mb-3">{{ price }} €</p>
-                </div>
             {{ /collection:prices }}
         </div>
 
         <p class="mt-4">
-            <a href="{{ hfs:lien_billetterie }}" class="button is-outlined is-primary is-fullwidth is-rounded" target="_blank">Voir la billetterie</a>
+            <a href="{{ hfs:lien_billetterie }}" class="button is-outlined is-large is-uppercase is-primary is-fullwidth is-rounded" target="_blank">Voir la billetterie</a>
         </p>
     </div>
 </section>
 
 <section class="section has-background-primary has-text-black ink bottom" id="sponsors">
     <div class="container">
-        <h2 class="is-size-2 has-text-weight-bold is-uppercase block">Sponsors & partenaires</h2>
+        <h2 class="is-size-2 has-text-weight-bold is-uppercase block mb-6">Sponsors & partenaires</h2>
 
         <div class="columns is-multiline is-mobile">
             {{ collection:sponsors sort="order asc" }}

resources/views/layout.antlers.html

@@ -14,6 +14,22 @@
         <link rel="icon" type="image/png" sizes="16x16" href="/assets/favicon-16x16.png">
         <link rel="manifest" href="/assets/site.webmanifest">
         <title>{{ title ?? site:name }}</title>
+
+        <meta name="title" content="{{ title ?? site:name }}">
+        <meta name="description" content="{{ hfs:description }}" />
+        <!-- Open Graph / Facebook -->
+        <meta property="og:type" content="website">
+        <meta property="og:url" content="https://summer.hfsplay.fr/">
+        <meta property="og:title" content="{{ title ?? site:name }}">
+        <meta property="og:description" content="{{ hfs:description }}">
+        <meta property="og:image" content="{{ glide:hfs:image fm="webp" }}">
+
+        <!-- Twitter -->
+        <meta property="twitter:card" content="summary_large_image">
+        <meta property="twitter:url" content="https://summer.hfsplay.fr/">
+        <meta property="twitter:title" content="{{ title ?? site:name }}">
+        <meta property="twitter:description" content="{{ hfs:description }}">
+        <meta property="twitter:image" content="{{ glide:hfs:image fm="webp" }}">
     </head>
     <body>
         <nav id="nav" class="navbar is-fixed-top p-5 has-text-primary" role="navigation" aria-label="main navigation">
@@ -42,7 +58,7 @@
             </div>
 
             <div class="navbar-end">
-                <a class="navbar-item button is-rounded has-text-primary" href="{{ hfs:lien_billetterie }}" target="_blank">
+                <a class="navbar-item button is-medium is-rounded has-text-primary" href="{{ hfs:lien_billetterie }}" target="_blank">
                     Billetterie
                 </a>
             </div>
@@ -52,19 +68,23 @@
 
         <footer class="footer has-background-black">
         <div class="grid is-col-min-9">
-            <div class="cell has-text-centered has-text-primary">
+            <div class="cell has-text-centered has-text-primary mb-3">
-                <a class="footer-logo has-text-primary" href="https://www.hfsplay.fr" target="_blank">
+                <a class="footer-logo has-text-primary mb-3" href="https://www.hfsplay.fr" target="_blank">
                     <img src="/assets/logo2.svg" alt="" style="width:3rem;" class="px-2">
                     <div class="is-size-3 has-text-weight-bolder px-2">HFS PLAY</div>
                 </a>
+                <p class="has-text-grey">
+                    Une association d'entraide communautaire autour de l'arcade et aussi une association délivrant du love.
+                </p>
             </div>
             <div class="cell"></div>
-            <div class="cell">
+            <div class="cell has-text-centered">
-                <ul>
+                <h3 class="has-text-primary mb-3 is-size-3">FOLLOW US ON</h3>
-                    {{ nav:main }}
+                <div class="links">
-                        <li><a href="{{ url }}">{{ title }}</a></li>
+                    <a class="button is-primary is-outlined mr-1" href="https://bsky.app/profile/hfsplay.bsky.social" target="_blank">BLUESKY</a>
-                    {{ /nav:main }}
+                    <a class="button is-primary is-outlined mr-1" href="https://fr-fr.facebook.com/HFSPlay/" target="_blank">FACEBOOK</a>
-                </ul>
+                    <a class="button is-primary is-outlined poop mr-1" href="https://x.com/HFSplay" target="_blank">X</a>
+                </div>
             </div>
         </div>
         </footer>
@@ -73,6 +93,6 @@
     <script src="/assets/js/main.js"></script>
 
 {{#     {{ vite src="public/assets/js/main.js|public/assets/css/site.css" }} #}}
-{{#     {{ vite src="resources/js/site.js|resources/css/site.css" }} #}}
+    {{ vite src="resources/js/site.js|resources/css/site.css" }}
 
 </html>