Commit c8937986 authored by Johann Bournazel's avatar Johann Bournazel
Browse files

Fusion des fichiers css, modifications visuelles et corrections sur la page du jeu.

parent d1ed8882
......@@ -10,16 +10,16 @@ class VueJeu {
<head>
<meta charset="UTF-8">
<title>Jeu du Bridges</title>
<link href="./master.css" rel="stylesheet" type="text/css">
<link href="vues/css/master.css" rel="stylesheet" type="text/css">
</head>
<body>
<nav>
<ul>
<ul class="bg-blue">
<li><a href="index.php">Accueil</a></li>
<li><a href="index.php?page=profil">Mon profil</a></li>
<li><a href="index.php?page=leaderboard">Leaderboard</a></li>
<li style="float:right"><a href="index.php?deco">Déconnection</a></li>
<li style="float:right"><a href="index.php?deco">Déconnexion</a></li>
</ul>
</nav>
......@@ -29,12 +29,20 @@ class VueJeu {
<?php
echo "<a href='index.php?annulerCoup'> Annuler le dernier coup</a><br>";
echo "<a href='index.php?replay'> Relancer la partie</a><br>";
echo "Vous êtes connecté en tant que: ".'<b>'.$_SESSION['pseudo'].'</b>';
echo '</br>';
echo "<div class='flex-container actions-container'>";
echo "<a href='index.php?annulerCoup' class='link-button mg-top-10'><img src='vues/css/back.png' alt='BackImage' class='icon'> Annuler le dernier coup</a>";
echo "<a href='index.php?replay' class='link-button mg-top-10'><img src='vues/css/restart.png' alt='BackImage' class='icon'> Reprendre cette partie</a>";
echo "</div>";
echo "<div class='flex-container actions-container'>";
echo "<a href='index.php?annulerCoup' class='link-button mg-top-10'><img src='vues/css/tick.png' alt='BackImage' class='icon'> Résoudre le jeu</a>";
echo "<a href='index.php?replay' class='link-button mg-top-10'><img src='vues/css/restart.png' alt='BackImage' class='icon'> Relancer une partie</a>";
echo "</div>"
?>
<br>
<div class="conteneur">
<div class="flex-container">
<div class="jeu">
......@@ -43,9 +51,9 @@ class VueJeu {
if (!$villes->estFini()) {
$pontSimpleHorizontal = "<td><p>----------------</p></td>";
$pontSimpleHorizontal = "<td><p>--------------</p></td>";
$pontDoubleHorizontal = "<td><p>=====</p></td>";
$pontSimpleVertical = "<td><p>|</p><p>|</p></td>";
$pontSimpleVertical = "<td><p>|</p></td>";
$pontDoubleVertical = "<td><p>| |</p><p>| |</p></td>";
......@@ -152,8 +160,8 @@ class VueJeu {
} else {
echo "<h1>tu as gagné !</h1><br>";
echo "<a href='index.php?replay'> Refaire une partie</a>";
echo "<h1>Partie gagnée</h1><br>";
echo "<a href='index.php?replay'> Rejouer</a>";
}
......@@ -176,7 +184,7 @@ class VueJeu {
<footer>
<p>Créé par Johann Bourzanel et Étienne LÉCRIVAIN</p>
<p>Créé par Johann BOURNAZEL et Étienne LÉVICRAIN</p>
</footer>
......
......@@ -18,6 +18,7 @@ html, body, *{
html{
background-color:#b0b0b033;
//font-family: Roboto;
}
.flex-container{
display: flex;
......@@ -156,4 +157,148 @@ input[type='submit']:hover{
font-family: Roboto;
font-size: 13px;
color:grey;
}
\ No newline at end of file
}
.jeu {
width: 500px;
height: 500px;
margin: 0 auto;
background: darkgray;
border: 1px solid #111111;
}
footer {
height: 50px;
width: 100%;
background: lightslategrey;
position: fixed;
bottom:0;
padding-top: 15px;
}
table {
width: 100%;
height: 100%;
}
tr {
height: auto;
width: auto;
}
td {
height: 50px;
width: 50px;
max-width:50px;
box-sizing: border-box;
margin: 5px 5px;
padding: 0 0;
display: table-cell;
vertical-align: inherit;
border-radius: 100%;
text-align: center;
}
td > a {
display: flex;
vertical-align: auto;
box-sizing: border-box;
margin: auto auto;
justify-content: center;
align-items: center;
max-width: 50px;
max-height: 50px;
text-decoration: none;
font-size: large;
font-weight: bold;
color: black;
}
td > p {
max-width: 50px;
max-height: 50px;
}
td.show {
border: 1px solid black;
background-color: #f5ffbf;
}
td.active {
border: 1px solid black;
background-color: #ffe385;
}
td.activeMauvais {
border: 1px solid black;
background-color: #ff2742;
}
td.tropPonts {
border: 1px solid black;
background-color: #ff9b35;
}
td.ok {
border: 1px solid black;
background-color: #39ff53;
}
li {
float: left;
}
li a {
display: block;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
/* Change the link color to #111 (black) on hover */
li a:hover {
background-color: #636cdd;
}
ul {
font-family: Roboto;
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #333;
}
body {
font-family: Roboto;
padding: 0;
margin: 0;
box-sizing: border-box;
}
.link-button{
text-align: center;
padding:10px;
text-decoration: none;
cursor: pointer;
height: 40px;
width: 150px;
background-color: #727cf5;
color: #fff;
border-radius: 2px;
border: 1px;
border-color: #727cf5;
box-shadow: 0 2px 6px 0 rgba(114,124,245,.5);
}
.icon{
height: 13px;
color:#fff;
}
.actions-container{
width: 500px;
margin-left: auto;
margin-right: auto;
justify-content: space-between;
}
.actions-container > a{
width: 48%;
}
\ No newline at end of file
......@@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<title>Jeu du Bridges - Connexion </title>
<link href="vues/css/authentification.css" rel="stylesheet" type="text/css">
<link href="vues/css/master.css" rel="stylesheet" type="text/css">
</head>
<body>
......
......@@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<title>Jeu du Bridges - Connexion </title>
<link href="vues/css/authentification.css" rel="stylesheet" type="text/css">
<link href="vues/css/master.css" rel="stylesheet" type="text/css">
</head>
<body>
......
......@@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<title>Jeu du Bridges - Inscription </title>
<link href="vues/css/authentification.css" rel="stylesheet" type="text/css">
<link href="vues/css/master.css" rel="stylesheet" type="text/css">
</head>
<body>
......
......@@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<title>Jeu du Bridges - Inscription </title>
<link href="vues/css/authentification.css" rel="stylesheet" type="text/css">
<link href="vues/css/master.css" rel="stylesheet" type="text/css">
</head>
<body>
......
......@@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<title>Jeu du Bridges</title>
<link href="./master.css" rel="stylesheet" type="text/css">
<link href="css/master.css" rel="stylesheet" type="text/css">
</head>
<body>
......
ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #333;
}
body {
padding: 0;
margin: 0;
box-sizing: border-box;
}
li {
float: left;
}
li a {
display: block;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
/* Change the link color to #111 (black) on hover */
li a:hover {
background-color: #111;
}
.conteneur {
}
.jeu {
width: 500px;
height: 500px;
margin: 0 auto;
background: darkgray;
border: 1px solid #111111;
}
footer {
height: 100px;
padding: 10px;
background: lightslategrey;
}
table {
width: 100%;
height: 100%;
}
tr {
height: auto;
width: auto;
}
td {
height: 50px;
width: 50px;
box-sizing: border-box;
margin: 5px 5px;
padding: 0 0;
display: table-cell;
vertical-align: inherit;
border-radius: 100%;
}
td > a {
display: flex;
vertical-align: auto;
box-sizing: border-box;
margin: auto auto;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
text-decoration: none;
font-size: large;
font-weight: bold;
color: black;
}
td.show {
border: 1px solid black;
background-color: #f5ffbf;
}
td.active {
border: 1px solid black;
background-color: #00ff02;
}
td.activeMauvais {
border: 1px solid black;
background-color: #ff2742;
}
\ No newline at end of file
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment