diff --git a/README.md b/README.md index 360b2aa..58b473c 100644 --- a/README.md +++ b/README.md @@ -30,9 +30,11 @@ L'application est ensuite disponible sur `http://localhost:8080`. ## Fichiers clés -- `index.html` : page de configuration et reprise de match +- `index.html` : page d'accueil du site +- `application.html` : page de configuration et reprise de match - `chrono.html` : page dédiée à la phase chrono - `cube.html` : page dédiée à la phase cube +- `reglement.html` : page éditoriale qui présente le règlement officiel - `styles.css` : design mobile/tablette - `app.js` : logique de match et arbitrage - `docker-compose.yml` + `Dockerfile` : exécution locale diff --git a/app.js b/app.js index 873e3f7..2fd8b77 100644 --- a/app.js +++ b/app.js @@ -1,4 +1,5 @@ const PAGE = document.body.dataset.page; +const SETUP_PAGE = "application.html"; const STORAGE_KEY = "chesscubing-arena-state-v2"; const WINDOW_NAME_KEY = "chesscubing-arena-state-v2:"; @@ -178,7 +179,7 @@ function initSetupPage() { function initChronoPage() { if (!match) { - replaceTo("index.html"); + replaceTo(SETUP_PAGE); return; } @@ -314,7 +315,7 @@ function initChronoPage() { refs.arbiterResetButton?.addEventListener("click", () => { clearMatch(); - replaceTo("index.html"); + replaceTo(SETUP_PAGE); }); function handleChronoTap(color) { @@ -344,7 +345,7 @@ function initChronoPage() { syncRunningState(match); if (match.result) { - navigateTo("index.html"); + navigateTo(SETUP_PAGE); return; } @@ -500,7 +501,7 @@ function initChronoPage() { function initCubePage() { if (!match) { - replaceTo("index.html"); + replaceTo(SETUP_PAGE); return; } @@ -564,7 +565,7 @@ function initCubePage() { refs.primaryButton?.addEventListener("click", () => { if (match.result) { - navigateTo("index.html"); + navigateTo(SETUP_PAGE); return; } @@ -596,7 +597,7 @@ function initCubePage() { refs.resetButton?.addEventListener("click", () => { clearMatch(); - replaceTo("index.html"); + replaceTo(SETUP_PAGE); }); function handleCubeTap(color) { @@ -1384,7 +1385,7 @@ function resultText(storedMatch) { function routeForMatch(storedMatch) { if (!storedMatch) { - return "index.html"; + return SETUP_PAGE; } return storedMatch.phase === "cube" && !storedMatch.result ? "cube.html" : "chrono.html"; diff --git a/application.html b/application.html new file mode 100644 index 0000000..6adf738 --- /dev/null +++ b/application.html @@ -0,0 +1,259 @@ + + + + + + + ChessCubing Arena | Application + + + +
+
+ +
+
+
+

Application officielle de match

+

ChessCubing Arena

+

+ Une version mobile et tablette organisée par phases : configuration, + page chrono ultra lisible, puis page cube dédiée qui s'ouvre + automatiquement à la fin de la phase chess. +

+
+ Pages séparées + Face-à-face téléphone + Twice + Time + Arbitrage tactile +
+
+ Accueil du site + Consulter le règlement +
+
+ + +
+ +
+
+
+
+

Nouvelle rencontre

+

Configuration

+
+

+ Les réglages ci-dessous préparent les pages chrono et cube. +

+
+ +
+ + +
+ Mode officiel +
+ + +
+
+ +
+ Cadence du block +
+ + + +
+
+ +
+ Temps personnalisés +
+ + +
+
+ + + + + + + + + + + +
+ +
+ + + Consulter le règlement +
+
+
+ + +
+
+ + + + diff --git a/chrono.html b/chrono.html index c767602..07add23 100644 --- a/chrono.html +++ b/chrono.html @@ -13,7 +13,7 @@
- Configuration + Application

Phase chrono

Block 1

diff --git a/cube.html b/cube.html index 929461c..4a86b53 100644 --- a/cube.html +++ b/cube.html @@ -13,7 +13,7 @@
- Configuration + Application

Phase cube

Cube n°1

diff --git a/index.html b/index.html index c55087a..d377eac 100644 --- a/index.html +++ b/index.html @@ -5,251 +5,244 @@ - ChessCubing Arena | Configuration + ChessCubing Arena | Accueil - +
-
-
+
+
-

Application officielle de match

-

ChessCubing Arena

+

Association ChessCubing

+

Les échecs rencontrent le Rubik's Cube

- Une version mobile et tablette organisée par phases : configuration, - page chrono ultra lisible, puis page cube dédiée qui s'ouvre - automatiquement à la fin de la phase chess. + ChessCubing propose un jeu hybride simple à comprendre, intense à + vivre et très plaisant à regarder. On joue un block d'échecs, on + passe par une phase cube obligatoire, puis la partie repart avec un + nouveau rythme.

- Pages séparées - Face-à-face téléphone - Twice + Time - Arbitrage tactile + Accessible en club + Spectaculaire en démonstration + Stratégie + vitesse + Application officielle +
+
+ Ouvrir l'application + Lire le règlement
-
-
+
+
-

Nouvelle rencontre

-

Configuration

+

L'association

+

Une passerelle entre deux passions

- Les réglages ci-dessous préparent les pages chrono et cube. + L'association ChessCubing veut créer des moments de rencontre, de + découverte et de jeu partagé autour d'un format hybride.

-
- - -
- Mode officiel -
- - -
-
- -
- Cadence du block -
- - - -
-
- -
- Temps personnalisés -
- - -
-
- - - - - - - - - - - -
- -
- - - Consulter le règlement -
-
+
+
+ Partager + Faire découvrir un format original +

+ L'idée est simple : réunir des profils différents autour d'un + jeu lisible, vivant et immédiatement intriguant. +

+
+
+ Rassembler + Créer un terrain commun +

+ Joueurs d'échecs, cubers, curieux, familles ou clubs peuvent se + retrouver dans une expérience facile à lancer et à commenter. +

+
+
+ Animer + Donner envie de revenir jouer +

+ Le mélange de réflexion, de vitesse et de rebondissements donne + au format un côté spectaculaire qui marche très bien en + initiation comme en événement. +

+
+
- +
+ +
+
+
+

Deux formats

+

Deux manières de vivre le duel

+
+

+ Le règlement officiel propose deux lectures du même concept, l'une + plus orientée initiative, l'autre plus orientée gestion du temps. +

+
+ +
+
+
+ ChessCubing Twice +

Le cube donne l'élan

+

+ Le joueur le plus rapide sur la phase cube prend le départ du + block suivant et peut même obtenir un double coup dans + certaines situations. +

+
+
+ Mode nerveux + Initiative forte + Effet immédiat +
+
+ +
+
+ ChessCubing Time +

Le cube agit sur les chronos

+

+ Ici, on garde le trait mais la performance sur le cube retire + ou ajoute du temps selon l'alternance des blocs. +

+
+
+ Gestion de temps + Blocs - et + + Suspense permanent +
+
+
+
+ +
+
+
+

Envie de tester

+

Choisis ton entrée

+
+

+ Tu peux découvrir le jeu tranquillement avec la page règlement ou + aller directement vers l'application officielle de match. +

+
+ +
+ + Application + Ouvrir la partie arbitrage +

Configurer une rencontre, lancer le chrono et enchaîner avec la phase cube.

+ + + Règlement + Comprendre les formats officiels +

Retrouver une présentation claire du Twice, du Time et des règles de match.

+ + + PDF officiel + Lire le texte source +

Consulter directement le document officiel si tu veux tous les détails.

+ +
+
- - diff --git a/reglement.html b/reglement.html index 6ad67b0..7c396d1 100644 --- a/reglement.html +++ b/reglement.html @@ -32,8 +32,8 @@ Fin uniquement par mat ou abandon
- Retour à l'application - Comparer les formats + Ouvrir l'application + Retour à l'accueil
@@ -339,7 +339,7 @@ ChessCubing Time V1

Version entrée en vigueur le 4 février 2026.

- + Application Retour à ChessCubing Arena

Revenir à la configuration du match et à l'arbitrage mobile.

diff --git a/styles.css b/styles.css index 6acb785..f94ba84 100644 --- a/styles.css +++ b/styles.css @@ -792,6 +792,15 @@ textarea:focus { 0 0 30px rgba(30, 214, 255, 0.08); } +.hero-home h1 { + margin: 0; + font-size: clamp(2.9rem, 6.4vw, 5.2rem); + line-height: 0.93; + text-shadow: + 0 0 12px rgba(30, 214, 255, 0.18), + 0 0 32px rgba(24, 217, 127, 0.08); +} + .hero-actions { display: flex; flex-wrap: wrap; @@ -870,6 +879,12 @@ textarea:focus { gap: 0.9rem; } +.home-story-grid { + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + gap: 0.9rem; +} + .stage-card { display: grid; gap: 0.45rem; @@ -898,6 +913,39 @@ textarea:focus { opacity: 0.7; } +.mini-panel { + position: relative; + display: grid; + gap: 0.45rem; + padding: 1rem; + border-radius: 22px; + border: 1px solid var(--panel-border-soft); + background: + linear-gradient(160deg, rgba(10, 31, 47, 0.96), rgba(3, 13, 21, 0.96)); + box-shadow: + inset 0 0 0 1px rgba(30, 214, 255, 0.03), + 0 0 22px rgba(30, 214, 255, 0.04); +} + +.mini-panel p { + margin-bottom: 0; + color: var(--muted); +} + +.home-mini-grid { + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + gap: 0.9rem; +} + +.home-mini-grid.two-columns { + grid-template-columns: repeat(2, minmax(0, 1fr)); +} + +.cta-panel { + border-color: rgba(125, 247, 189, 0.24); +} + .twice-card { border-color: rgba(117, 242, 255, 0.24); } @@ -1035,8 +1083,11 @@ textarea:focus { .faceoff-board, .rules-compare, .rules-stage-grid, + .home-story-grid, .split-callouts, - .source-grid { + .source-grid, + .home-mini-grid, + .home-mini-grid.two-columns { grid-template-columns: 1fr; }