Skip to content

Instantly share code, notes, and snippets.

@phpfiddle
Created June 9, 2018 13:31
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save phpfiddle/9bde204f0a804da965813cc9e75e8738 to your computer and use it in GitHub Desktop.
Save phpfiddle/9bde204f0a804da965813cc9e75e8738 to your computer and use it in GitHub Desktop.
[ Posted by Delanois Stephane ] khgigiv hvj jh vjv
<html>
<head>
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.13/css/all.css" integrity="sha384-DNOHZ68U8hZfKXOrtjWvjxusGo9WQnrNx2sqG0tfsghAvtVlRW3tvkXWZh58N9jp" crossorigin="anonymous">
<script defer src="https://use.fontawesome.com/releases/v5.0.13/js/all.js" integrity="sha384-xymdQtn1n3lH2wcu0qhcdaOpQwyoarkgLVxC/wZ5q7h9gHtxICrpcaSUfygqZGOe" crossorigin="anonymous"></script>
<style>
body{
background-color:black;
text-align:center;
color:white;
}
.title{
background-image:url('https://previews.123rf.com/images/darkink/darkink1301/darkink130100007/17258007-seamless-motif-robots-de-dessin-animé-sur-la-chaîne-de-montage.jpg');
vertical-align:middle;
background-size: 800px;
width:800;
height:500;
text-align:center;
display: inline-block;
margin:25px;
}
.title #title{
background-color: rgba(0,191,255,0.5);
margin:25px;
margin-left:105px;
margin-top:400px;
-webkit-border-radius: 15px;
border-radius: 15px;
}
.title #log{
padding-top:15px;
background-color: rgba(255,255,255,0.8);
text-shadow: 1px 1px #000;
position:absolute;
text-align:center;
color:tomato;
height:480px;
width:90px;
}
.title #log a{
color:tomato;
text-decoration:none;
}
.title #logForm{
position:absolute;
width:610px;
-webkit-border-radius: 15px;
border-radius: 15px;
margin:85px;
margin-left:300px;
}
.title #signupForm{
position:absolute;
width:610px;
-webkit-border-radius: 15px;
border-radius: 15px;
margin:30px;
margin-left:300px;
}
h1 {
text-shadow: 4px 4px #000;
font-family: 'Comic Sans MS', cursive, sans-serif;
font-size: 65px;
letter-spacing: 3.8px;
word-spacing: 3.4px;
color: coral;
font-weight: bold;
text-decoration: none;
font-style: normal;
font-variant: small-caps;
text-transform: capitalize;
}
.login{
background-color:tomato;
-webkit-border-radius: 15px;
border-radius: 15px;
padding:5px 20px;
color:#47E3FF;
box-shadow: 2px 2px black,-2px -2px black,-2px 2px black,2px -2px black;
}
.login td{
text-align:center;
padding:5px;
color:white;
}
.login input{
-webkit-border-radius: 5px;
border-radius: 5px;
text-align:center;
padding: 12px 20px;
margin: 8px 0;
}
.login input[type="text"],input[type="password"]{
width: 100%;
box-sizing: border-box;
}
.login input[type="submit"]{
background:#47E3FF;
border:0 none;
cursor:pointer;
color:white;
}
.login .fa{
color:tomato;
}
.login a{
color:white;
text-decoration:none;
}
</style>
</head>
<?php
//$_GET['connect']=1;
if(isset($_GET['page'])){
$page=$_GET['page'];
}else{
$page=1;
}
if(!isset($_SESSION)){
session_start();
$page=1;
}
if ($page==1){ //-----------------------------------------------------------------------------------PAGE D'ACCUEIL
?>
<body>
<div class='title'>
<?php
if (isset($_GET['signup'])){ //-----------------POP INSCRIPTION
?>
<div id='signupForm'>
<a href='allPage.php?page=1'>
<span class="fa-layers fa-fw" style="position:absolute;left:268px;top:0px;" >
<i class="fas fa-circle fa-2x" style="color:#47E3FF"></i>
<i class="fas fa-times-circle fa-2x" style="color:tomato" data-fa-transform="shrink-1"></i>
</span>
</a>
<table class='login'>
<tr>
<td><i class="fa fa-users fa-2x" title="login"></i></td>
<td><input type='text'></td>
</tr>
<tr>
<td><i class="fa fa-at fa-2x" title="email"></i></td>
<td><input type='text'></td>
</tr>
<tr>
<td><i class="fa fa-unlock-alt fa-2x" title="password"></i></td>
<td><input type='password' alt='password'></td>
</tr>
<tr>
<td>
<span class="fa-layers fa-fw" >
<i class="fa fa-unlock-alt fa-2x" title="confirm password" data-fa-transform="left-2"></i>
<i class="fa fa-check fa-2x" title="confirm password" data-fa-transform="shrink-5 up-4 right-5" style="color:grey;"></i>
</span>
</td>
<td><input type='password'></td>
</tr>
<tr>
<td colspan='2'>
<a href="javascript:;" onclick="parentNode.submit();">
<span class="fa-layers fa-fw fa-3x" >
<i class="fas fa-circle" style="color:black;" data-fa-transform="shrink-5"></i>
<i class="fas fa-circle" style="color:Tomato;" data-fa-transform="shrink-6"></i>
<i class="fas fa-chevron-circle-right" data-fa-transform="shrink-6"></i>
</span>
</a><br/>
</td>
</tr>
</table>
</div>
<?php
}else if (isset($_GET['connect'])){ //---------POPUP CONNECTION
?>
<div id='logForm'>
<a href='allPage.php?page=1'>
<span class="fa-layers fa-fw" style="position:absolute;left:268px;top:0px;" >
<i class="fas fa-circle fa-2x" style="color:#47E3FF"></i>
<i class="fas fa-times-circle fa-2x" style="color:tomato" data-fa-transform="shrink-1"></i>
</span>
</a>
<table class='login'>
<tr>
<td><i class="fa fa-users fa-2x" title="login"></i></td>
<td><input type='text'></td>
</tr>
<tr>
<td><i class="fa fa-unlock-alt fa-2x" title="password"></i></td>
<td><input type='password'></td>
</tr>
<tr>
<td colspan='2'>
<a href="javascript:;" onclick="parentNode.submit();">
<span class="fa-layers fa-fw fa-3x" >
<i class="fas fa-circle" style="color:black;" data-fa-transform="shrink-5"></i>
<i class="fas fa-circle" style="color:Tomato;" data-fa-transform="shrink-6"></i>
<i class="fas fa-chevron-circle-right" data-fa-transform="shrink-6"></i>
</span><br/>
</a><br/>
<a href='allPage.php?page=1&signup'>S'inscrire</a> -
<a href=''>Mot de passe oublié?</a><br/>
</td>
</tr>
</table>
</div>
<?php
} //--------------TITRE + MENU LOG/INSCRIPTION
?>
<div id='log' >
<a href='allPage.php?page=1&connect'>
<span class="fa-layers fa-fw fa-3x" >
<i class="fas fa-circle" style="color:black;"></i>
<i class="fas fa-circle" style="color:Tomato;" data-fa-transform="shrink-1"></i>
<i class="fa-inverse fas fa-sign-in-alt" data-fa-transform="shrink-6"></i>
</span><br/>
Connexion
</a><br/><br/>
<a href='allPage.php?page=1&signup'>
<span class="fa-layers fa-fw fa-3x" >
<i class="fas fa-circle" style="color:black;"></i>
<i class="fas fa-circle" style="color:Tomato;" data-fa-transform="shrink-1"></i>
<i class="fa-inverse fas fa-user-plus" data-fa-transform="shrink-8"></i>
</span><br/>
S'inscrire
</a><br/><br/>
<a href=''>
<span class="fa-layers fa-fw fa-3x" >
<i class="fas fa-circle" style="color:black;"></i>
<i class="fas fa-circle" style="color:Tomato;" data-fa-transform="shrink-1"></i>
<i class="fa-inverse fas fa-eye" data-fa-transform="shrink-6"></i>
</span><br/>
Plus d'info
</a><br/><br/>
</div>
<div id='title'>
<h1>RoboticWar</h1>
</div>
</div><br/>
<i class="far fa-copyright"></i>
All Copyright
</body>
</html>
<?php
}
?>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment