Ajoute le mode standalone sur iPhone

This commit is contained in:
2026-04-12 15:25:28 +02:00
parent 3bf1e93543
commit c3818e6417
7 changed files with 68 additions and 6 deletions

View File

@@ -2,13 +2,21 @@
<html lang="fr"> <html lang="fr">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
<meta name="theme-color" content="#140700" />
<meta name="application-name" content="ChessCubing Arena" />
<meta name="mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<meta name="apple-mobile-web-app-title" content="ChessCubing" />
<meta <meta
name="description" name="description"
content="Application officielle de match pour ChessCubing Arena sur téléphone et tablette." content="Application officielle de match pour ChessCubing Arena sur téléphone et tablette."
/> />
<title>ChessCubing Arena | Application</title> <title>ChessCubing Arena | Application</title>
<link rel="icon" type="image/png" href="logo.png" /> <link rel="icon" type="image/png" href="logo.png" />
<link rel="apple-touch-icon" href="logo.png" />
<link rel="manifest" href="site.webmanifest" />
<link rel="stylesheet" href="styles.css" /> <link rel="stylesheet" href="styles.css" />
</head> </head>
<body data-page="setup"> <body data-page="setup">

View File

@@ -2,13 +2,21 @@
<html lang="fr"> <html lang="fr">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
<meta name="theme-color" content="#140700" />
<meta name="application-name" content="ChessCubing Arena" />
<meta name="mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<meta name="apple-mobile-web-app-title" content="ChessCubing" />
<meta <meta
name="description" name="description"
content="Phase chrono de ChessCubing Arena avec gros boutons face-à-face." content="Phase chrono de ChessCubing Arena avec gros boutons face-à-face."
/> />
<title>ChessCubing Arena | Phase Chrono</title> <title>ChessCubing Arena | Phase Chrono</title>
<link rel="icon" type="image/png" href="logo.png" /> <link rel="icon" type="image/png" href="logo.png" />
<link rel="apple-touch-icon" href="logo.png" />
<link rel="manifest" href="site.webmanifest" />
<link rel="stylesheet" href="styles.css" /> <link rel="stylesheet" href="styles.css" />
</head> </head>
<body data-page="chrono" class="phase-body"> <body data-page="chrono" class="phase-body">

View File

@@ -2,13 +2,21 @@
<html lang="fr"> <html lang="fr">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
<meta name="theme-color" content="#140700" />
<meta name="application-name" content="ChessCubing Arena" />
<meta name="mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<meta name="apple-mobile-web-app-title" content="ChessCubing" />
<meta <meta
name="description" name="description"
content="Phase cube de ChessCubing Arena avec gros boutons de fin." content="Phase cube de ChessCubing Arena avec gros boutons de fin."
/> />
<title>ChessCubing Arena | Phase Cube</title> <title>ChessCubing Arena | Phase Cube</title>
<link rel="icon" type="image/png" href="logo.png" /> <link rel="icon" type="image/png" href="logo.png" />
<link rel="apple-touch-icon" href="logo.png" />
<link rel="manifest" href="site.webmanifest" />
<link rel="stylesheet" href="styles.css" /> <link rel="stylesheet" href="styles.css" />
</head> </head>
<body data-page="cube" class="phase-body"> <body data-page="cube" class="phase-body">

View File

@@ -2,13 +2,21 @@
<html lang="fr"> <html lang="fr">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
<meta name="theme-color" content="#140700" />
<meta name="application-name" content="ChessCubing Arena" />
<meta name="mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<meta name="apple-mobile-web-app-title" content="ChessCubing" />
<meta <meta
name="description" name="description"
content="Découvrez ChessCubing, l'association et le jeu qui réunit échecs et Rubik's Cube dans un format simple, vivant et spectaculaire." content="Découvrez ChessCubing, l'association et le jeu qui réunit échecs et Rubik's Cube dans un format simple, vivant et spectaculaire."
/> />
<title>ChessCubing Arena | Accueil</title> <title>ChessCubing Arena | Accueil</title>
<link rel="icon" type="image/png" href="logo.png" /> <link rel="icon" type="image/png" href="logo.png" />
<link rel="apple-touch-icon" href="logo.png" />
<link rel="manifest" href="site.webmanifest" />
<link rel="stylesheet" href="styles.css" /> <link rel="stylesheet" href="styles.css" />
</head> </head>
<body class="home-body"> <body class="home-body">

View File

@@ -2,13 +2,21 @@
<html lang="fr"> <html lang="fr">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
<meta name="theme-color" content="#140700" />
<meta name="application-name" content="ChessCubing Arena" />
<meta name="mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<meta name="apple-mobile-web-app-title" content="ChessCubing" />
<meta <meta
name="description" name="description"
content="Page règlement officielle du site ChessCubing Arena avec synthèse des formats Twice et Time." content="Page règlement officielle du site ChessCubing Arena avec synthèse des formats Twice et Time."
/> />
<title>ChessCubing Arena | Règlement officiel</title> <title>ChessCubing Arena | Règlement officiel</title>
<link rel="icon" type="image/png" href="logo.png" /> <link rel="icon" type="image/png" href="logo.png" />
<link rel="apple-touch-icon" href="logo.png" />
<link rel="manifest" href="site.webmanifest" />
<link rel="stylesheet" href="styles.css" /> <link rel="stylesheet" href="styles.css" />
</head> </head>
<body class="rules-body"> <body class="rules-body">

17
site.webmanifest Normal file
View File

@@ -0,0 +1,17 @@
{
"name": "ChessCubing Arena",
"short_name": "ChessCubing",
"description": "Application officielle de match ChessCubing pour chrono, cube et arbitrage.",
"start_url": "/application.html",
"scope": "/",
"display": "standalone",
"background_color": "#140700",
"theme_color": "#140700",
"icons": [
{
"src": "/logo.png",
"sizes": "2048x2048",
"type": "image/png"
}
]
}

View File

@@ -17,6 +17,10 @@
--success: #ffb13a; --success: #ffb13a;
--shadow: 0 18px 48px rgba(0, 0, 0, 0.38); --shadow: 0 18px 48px rgba(0, 0, 0, 0.38);
--radius: 28px; --radius: 28px;
--safe-top: env(safe-area-inset-top, 0px);
--safe-right: env(safe-area-inset-right, 0px);
--safe-bottom: env(safe-area-inset-bottom, 0px);
--safe-left: env(safe-area-inset-left, 0px);
} }
*, *,
@@ -31,7 +35,8 @@ html {
body { body {
margin: 0; margin: 0;
min-height: 100vh; min-height: 100dvh;
padding: var(--safe-top) var(--safe-right) var(--safe-bottom) var(--safe-left);
font-family: "Segoe UI", "Trebuchet MS", sans-serif; font-family: "Segoe UI", "Trebuchet MS", sans-serif;
color: var(--text); color: var(--text);
background: background: