mode sombre/clair signin

remotes/origin/master
kevin.modejar 7 months ago
parent 11fb04b4c2
commit 02b747db2c

@ -0,0 +1,7 @@
{
"files.associations": {
"stdio.h": "c",
"stdbool.h": "c",
"tp2.h": "c"
}
}

@ -7,15 +7,15 @@
<title>Wiki Fantasy : inscription</title>
<link id="favicon" rel="icon" href="../images/iconeSombre.ico"> <!-- Par défaut sombre -->
<link href="https://fonts.googleapis.com/css2?family=Lemon&display=swap" rel="stylesheet">
<script defer src="../script/theme-toggle.js"></script>
</head>
<body>
<div class="container">
<div class="header">
<div class="nav">
<img src="../images/coeur.svg" alt="coeur" width="67px" height="67px" onmousedown="return false">
<img src="../images/dark.svg" alt="dark" width="72px" height="37px" onmousedown="return false">
<img src="../images/quizz.svg" alt="quizz" width="51px" height="82px" onmousedown="return false">
<a href="favorite.html"><img src="../images/coeur.svg" alt="coeur" width="67px" height="67px" onmousedown="return false"></a>
<img id="theme-icon" src="../images/light.svg" alt="toggle theme" width="72px" height="37px" onmousedown="return false" onclick="toggleTheme()">
<a href="quiz.html"><img src="../images/quizz.svg" alt="quizz" width="51px" height="82px" onmousedown="return false"></a>
</div>
<div class="logo">
<img src="../images/WIKIFANTASY.png" alt="Logo" width="227px" height="106px" onmousedown="return false">
@ -26,7 +26,7 @@
</div>
</div>
<h1>▶ S'inscrire ◀</h1>
<form action="../script/signin.php" method="post">
<div class="signin">
<div class="DivId">
<p>Identifiant *</p>
@ -57,5 +57,6 @@
<input type="submit" class="btn" value="Inscription" />
</div>
</div>
</form>
</body>
</html>

@ -0,0 +1,3 @@
<?php
?>

@ -2,13 +2,10 @@
h1{
margin-top: 10%;
color : white;
text-align: center;
}
.signin{
background-color: #000000;
border-radius: 25px;
display: grid;
grid-template-columns: 2fr 1fr;
@ -20,7 +17,6 @@ h1{
}
p{
color :white;
font-size: 20px;
margin-top: 7%;
margin-bottom: 2%;
@ -60,21 +56,65 @@ p{
margin-left: 1%;
padding-left: 3%;
margin-top: -1%;
border: none;
font-size: 15px;
}
.btn{
background: linear-gradient(90deg, #6100ff 0%, #1b0048 100%);
margin-top: 10%;
width:75%;
font-size: 20px;
padding: 2%;
border-radius: 25px;
color : white;
border: none;
font-family: "Lemon", serif;
}
/*Dark mode*/
body.dark-mode .signin{
background-color: #000000;
border: 2px solid transparent;
}
body.dark-mode .h1{
color : white;
}
body.dark-mode .p{
color : white;
}
body.dark-mode .btn{
background: linear-gradient(90deg, #6100ff 0%, #1b0048 100%);
color : white;
}
body.dark-mode .champ{
background-color: #ffffff;
border: 2px solid #ffffff;
}
/*Light*/
body.light-mode .signin{
background-color: #ffffff;
border: 2px solid #000000;
}
body.light-mode .h1{
color : #000000;
}
body.light-mode .p{
color : #000000;
}
body.light-mode .btn{
background: linear-gradient(90deg, #caffde 0%, #b7c8ff 100%);
color : #000000;
}
body.light-mode .champ{
background-color: #fff1f1;
border: 1px solid #000000;
}
Loading…
Cancel
Save