Antux/JeuPistesSarreguemines
1
0
Fork 0
forked from antux18/ChasseTresorPange
Code Pull Requests Activity

Correction structure HTML + CSS.

Browse Source 
Ajout fichier manquant qr-scanner.
This commit is contained in:
antux18 2023-09-03 15:34:28 -04:00
parent 08d132d660
commit 03fb59404e
9 changed files with 46 additions and 180 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
article.php
View File

@ -72,25 +72,28 @@
<main> <main>
<header> <header>
<h1><?= $tr["page_title"]["article"] . $art_id . " : " . $article["title"] ?></h1> <h1><?= $tr["page_title"]["article"] . $art_id . " : " . $article["title"] ?></h1>
<p><?= $article["text"] ?></p> <h2><?= $article["text"] ?></h2>
</header> <section>
<article>
<div>
<a href="puzzles.php?team=<?= $team_id ?>"> <a href="puzzles.php?team=<?= $team_id ?>">
<button><?= $tr["article"]["back_but"] ?></button> <button><?= $tr["article"]["back_but"] ?></button>
</a> </a>
<a href="article.php?team=<?= $team_id ?>&id=<?= ($art_id % $max_art) + 1 ?>"> <a href="article.php?team=<?= $team_id ?>&id=<?= ($art_id % $max_art) + 1 ?>">
<button><?= $tr["article"]["next_but"] ?></button> <button><?= $tr["article"]["next_but"] ?></button>
</a> </a>
</div> </section>
<?php if ($solved) : ?> <?php if ($solved) : ?>
<p><?= $tr["article"]["success"] ?></p> <p><?= $tr["article"]["success"] ?></p>
<?php else : ?>
<p><?= $tr["article"]["message"] ?></p>
<?php endif; ?>
</header>
<article>
<?php if ($solved) : ?>
<p><?= $article["answer"] ?></p> <p><?= $article["answer"] ?></p>
<img src="images/map/puzzles/<?= $article["id"] ?>.png"/> <img src="images/map/puzzles/<?= $article["id"] ?>.png"/>
<?php else : ?> <?php else : ?>
<p><?= $tr["article"]["message"] ?></p>
<p></p> <!-- Emplacement du message d'erreur JS concernant la caméra. !-->
<button><?= $tr["article"]["qr_but"] ?></button> <button><?= $tr["article"]["qr_but"] ?></button>
<p></p> <!-- Emplacement du message d'erreur JS concernant la caméra. !-->
<video></video> <video></video>
<p><?= $tr["article"]["cam_sel"] ?></p> <p><?= $tr["article"]["cam_sel"] ?></p>
<select> <select>

4
index.php
View File

@ -44,10 +44,10 @@
<main> <main>
<header> <header>
<h1><?= $tr["page_title"]["home"]?></h1> <h1><?= $tr["page_title"]["home"]?></h1>
<p><?= $tr["home"]["subtitle"]?></p> <h2><?= $tr["home"]["subtitle"]?></h2>
<p><?= $tr["home"]["message"]?></p>
</header> </header>
<article> <article>
<p><?= $tr["home"]["message"]?></p>
<form action="team_confirm.php" method="get"> <form action="team_confirm.php" method="get">
<input type="number" name="team" placeholder="<?= $tr['home']['team'] ?>"> <input type="number" name="team" placeholder="<?= $tr['home']['team'] ?>">
<button type="submit"><?= $tr["home"]["button"] ?></button> <button type="submit"><?= $tr["home"]["button"] ?></button>

7
puzzles.php
View File

@ -74,15 +74,18 @@
<main> <main>
<header> <header>
<h1><?= $tr["page_title"]["puzzles"] . $team_id ?></h1> <h1><?= $tr["page_title"]["puzzles"] . $team_id ?></h1>
<p></p>
<p><?= $tr["puzzles"]["message"]?></p>
</header> </header>
<article> <article>
<p><?= $tr["puzzles"]["message"]?></p>
<ul> <ul>
<?php foreach ($puzzles as $puzzle) : ?> <?php foreach ($puzzles as $puzzle) : ?>
<li><a href="article.php?team=<?= $team_id ?>&id=<?= $puzzle["id"] ?>"><?= $tr["page_title"]["article"] . $puzzle["id"] . " : " . $puzzle["title"] ?></a></li> <li><a href="article.php?team=<?= $team_id ?>&id=<?= $puzzle["id"] ?>"><?= $tr["page_title"]["article"] . $puzzle["id"] . " : " . $puzzle["title"] ?></a></li>
<?php endforeach; ?> <?php endforeach; ?>
</ul> </ul>
<p><?= $tr["puzzles"]["map_desc"] ?></p>
<canvas width="2199px" height="2459px">
<img src="images/map/base_map.png" alt="Puzzles map">
</canvas>
</article> </article>
</main> </main>
<footer> <footer>

1
require/js/qr-scanner/qr-scanner.min.js.map Normal file
View File

File diff suppressed because one or more lines are too long

2
require/js/qrscan.js
View File

@ -63,7 +63,7 @@ camList.addEventListener("change", event => {
}); });
// Démarrage du scan : // Démarrage du scan :
document.querySelector("p + button").addEventListener("click", () => { document.querySelector("article button").addEventListener("click", () => {
scanner.start().then(() => { scanner.start().then(() => {
QrScanner.listCameras(true).then(cameras => cameras.forEach(camera => QrScanner.listCameras(true).then(cameras => cameras.forEach(camera =>
{ {

3
require/locales/en.php
View File

@ -34,7 +34,8 @@
"r_cam" => "Rear camera" "r_cam" => "Rear camera"
], ],
"puzzles" => [ "puzzles" => [
"message" => "Select a puzzle in the list below :" "message" => "Select a puzzle in the list below :",
"map_desc" => "Here is a map showing the location of the puzzles you already solved :"
], ],
"nav" => [ "nav" => [
"title" => "Code Hunt Pange", "title" => "Code Hunt Pange",

3
require/locales/fr.php
View File

@ -34,7 +34,8 @@
"r_cam" => "Caméra arrière" "r_cam" => "Caméra arrière"
], ],
"puzzles" => [ "puzzles" => [
"message" => "Choisissez une énigme dans la liste ci-dessous :" "message" => "Choisissez une énigme dans la liste ci-dessous :",
"map_desc" => "Voici la carte des emplacements des énigmes que vous avez résolues :"
], ],
"nav" => [ "nav" => [
"title" => "Chasse au code Pange", "title" => "Chasse au code Pange",

183
style.css
View File

@ -17,12 +17,14 @@ body {
h1, h2, h3, h4 { h1, h2, h3, h4 {
font-weight: lighter; font-weight: lighter;
border-left: solid; }
border-width: 5px;
padding-left: 5px; h1 {
padding-right: 5px; font-size: 36px;
display: inline-block; }
border-color: var(--hl);
h2 {
font-size: 20px;
} }
p { p {
@ -34,26 +36,12 @@ a {
color: var(--hl); color: var(--hl);
} }
dt {
font-weight: bold;
font-size: 90%;
border-bottom-style: solid;
border-bottom-width: 2px;
border-bottom-color: var(--bg-light);
padding: 10px;
}
form { form {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 15px; gap: 15px;
} }
form p {
text-align: center;
font-weight: bold;
}
input { input {
background: var(--bg-dark); background: var(--bg-dark);
} }
@ -66,31 +54,15 @@ input[type="submit"], button {
border-radius: 10px; border-radius: 10px;
transition: background 0.1s; transition: background 0.1s;
color: var(--fg); color: var(--fg);
text-decoration: none;
width: fit-content;
align-self: center; align-self: center;
} }
input[type="submit"]:hover, button:hover { input[type="submit"]:hover, button:hover {
background: var(--hl-light); background: var(--hl-light);
color: var(--fg);
} }
button a { article a {
color: var(--fg); align-self: center;
}
input[type="time"], input[type="date"] {
font-family: "Ubuntu", sans-serif;
background: var(--bg-dark);
border-style: solid;
border-width: 1px;
border-color: var(--bg);
padding: 20px;
border-radius: 10px;
transition: background 0.1s;
margin: 10px;
color: var(--fg);
} }
input[type="text"], input[type="email"], input[type="number"], textarea { input[type="text"], input[type="email"], input[type="number"], textarea {
@ -105,40 +77,7 @@ input[type="text"], input[type="email"], input[type="number"], textarea {
color: var(--fg); color: var(--fg);
} }
input[type="checkbox"] {
display: none;
width: 0px;
height: 0px;
}
input[type=checkbox]:checked ~ .remove-check {
display: none;
}
input[type="checkbox"] + label {
background: var(--bg-light);
transition: background 0.1s;
display: inline-block;
width: 200px;
height: 80px;
padding: 10px;
margin: 10px;
text-align: center;
border-radius: 15px;
box-shadow: 5px 5px black;
}
input[type="checkbox"]:hover + label {
background: var(--bg-dark);
}
input[type="checkbox"]:checked + label {
background: var(--hl);
}
header { header {
display: inline-block;
font-size: 150%;
width: 100%; width: 100%;
font-weight: lighter; font-weight: lighter;
text-align: center; text-align: center;
@ -173,17 +112,12 @@ header a {
} }
header a:hover { header a:hover {
color: var(--bg); color: var(--hl);
} }
header > h1 { header p:first-of-type {
font-size: 150%;
border: none;
}
header > p:first-of-type {
font-size: 20px !important;
text-align: center; text-align: center;
font-weight: bold;
} }
main { main {
@ -196,96 +130,26 @@ main {
gap: 20px; gap: 20px;
} }
main table {
border-style: solid;
border-width: 1px;
border-color: var(--bg-dark);
border-radius: 10px;
background-color: var(--bg-dark);
}
main table td {
padding: 10px;
padding-left: 20px;
padding-right: 20px;
border-bottom: 2px solid var(--bg);
}
main table tr:last-of-type td {
border: none;
}
main table td p:first-of-type {
font-weight: bold;
}
main p {
font-size: 16px;
}
main nav {
width: 100%;
display: flex;
flex-direction: column;
/* grid-template-columns: repeat(3, 1fr); */
gap: 15px;
}
main img { main img {
align-self: center; align-self: center;
} }
main article p { main article {
line-height: 2.2;
}
main > article {
/* display: flex;
flex-direction: row; */
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 15px; gap: 15px;
} }
main > article img { main article img {
max-width: 100%; max-width: 100%;
max-height: 600px; max-height: 600px;
} }
main > article div { main header section {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-self: center;
gap: 15px;
}
nav article {
background-color: var(--bg-dark);
border-style: solid;
border-width: 1px;
border-color: var(--bg-dark);
padding: 20px;
border-radius: 10px;
}
nav article img {
max-width: 100%;
max-height: 200px;
}
nav article footer {
border: none;
}
section article {
display: flex;
flex-wrap: wrap;
justify-content: center; justify-content: center;
} gap: 15px;
article p:first-of-type {
text-align: center;
font-weight: bold;
} }
footer { footer {
@ -296,7 +160,7 @@ footer {
text-align: center; text-align: center;
} }
footer > p { footer p {
text-align: center; text-align: center;
font-size: smaller; font-size: smaller;
} }
@ -315,20 +179,13 @@ video {
padding: 25px; padding: 25px;
} }
main nav { main article {
width: 100%;
display: grid;
grid-template-columns: auto;
gap: 15px;
}
main > article {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 15px; gap: 15px;
} }
main > article div { main header section {
flex-direction: row; flex-direction: row;
} }

6
team_confirm.php
View File

@ -46,7 +46,9 @@
<main> <main>
<header> <header>
<h1><?= $tr["page_title"]["team_confirm"] ?></h1> <h1><?= $tr["page_title"]["team_confirm"] ?></h1>
<p><?= $tr["team_confirm"]["subtitle"] ?></p> <h2><?= $tr["team_confirm"]["subtitle"] ?></h2>
</header>
<article>
<p> <p>
<?= $tr["team_confirm"]["message"] ?> <?= $tr["team_confirm"]["message"] ?>
<?php foreach ($members as $member) : ?> <?php foreach ($members as $member) : ?>
@ -56,8 +58,6 @@
<a href="puzzles.php?team=<?= $team_id ?>"> <a href="puzzles.php?team=<?= $team_id ?>">
<button><?= $tr["team_confirm"]["button"] ?></button> <button><?= $tr["team_confirm"]["button"] ?></button>
</a> </a>
</header>
<article>
</article> </article>
</main> </main>
<footer> <footer>