Pauline/NDI-2020
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

modif des formulaires connexion et inscriptions

Browse Source
This commit is contained in:
Alcaraz Yannick 2020-12-04 01:35:28 +01:00
parent cbc35000e7
commit 6d0e6b6570
6 changed files with 118 additions and 95 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
.idea/workspace.xml generated
View File

@ -1,7 +1,14 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="ChangeListManager">
<list default="true" id="5db01d37-ed98-4df0-8a3f-85093d5456ef" name="Default Changelist" comment="" />
<list default="true" id="5db01d37-ed98-4df0-8a3f-85093d5456ef" name="Default Changelist" comment="">
<change afterPath="$PROJECT_DIR$/inscription.html" afterDir="false" />
<change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
<change beforePath="$PROJECT_DIR$/connexion.html" beforeDir="false" afterPath="$PROJECT_DIR$/connexion.html" afterDir="false" />
<change beforePath="$PROJECT_DIR$/css/connexion.css" beforeDir="false" afterPath="$PROJECT_DIR$/css/connexion.css" afterDir="false" />
<change beforePath="$PROJECT_DIR$/css/creation.css" beforeDir="false" afterPath="$PROJECT_DIR$/css/inscription.css" afterDir="false" />
<change beforePath="$PROJECT_DIR$/css/creation.html" beforeDir="false" />
</list>
<option name="SHOW_DIALOG" value="false" />
<option name="HIGHLIGHT_CONFLICTS" value="true" />
<option name="HIGHLIGHT_NON_ACTIVE_CHANGELIST" value="false" />
@ -41,6 +48,11 @@
<property name="node.js.selected.package.tslint" value="(autodetect)" />
<property name="vue.rearranger.settings.migration" value="true" />
</component>
<component name="RecentsManager">
<key name="MoveFile.RECENT_KEYS">
<recent name="D:\Nuit-De-L-Info-2020" />
</key>
</component>
<component name="SpellCheckerSettings" RuntimeDictionaries="0" Folders="0" CustomDictionaries="0" DefaultDictionary="application-level" UseSingleDictionary="true" transferred="true" />
<component name="TaskManager">
<task active="true" id="Default" summary="Default task">
@ -49,11 +61,22 @@
<option name="number" value="Default" />
<option name="presentableId" value="Default" />
<updated>1607026953826</updated>
<workItem from="1607026956145" duration="5065000" />
<workItem from="1607026956145" duration="9483000" />
</task>
<servers />
</component>
<component name="TypeScriptGeneratedFilesManager">
<option name="version" value="3" />
</component>
<component name="Vcs.Log.Tabs.Properties">
<option name="TAB_STATES">
<map>
<entry key="MAIN">
<value>
<State />
</value>
</entry>
</map>
</option>
</component>
</project>

16
connexion.html
View File

@ -10,23 +10,23 @@
<body>
<!--form action="" name"" method="POST"-->
<div class="wrapper fadeInDown">
<div id="formContent">
<div class="wrapper fonduBas">
<div id="contenu">
<!-- Tabs Titles -->
<h2 class="active"> Se connecter</h2>
<h2 class="inactive underlineHover"><a href="creation.html">Créer un compte </a></h2>
<h2 class="inactive souligne"><a href="inscription.html">Créer un compte </a></h2>
<!-- Login Form -->
<form>
<input type="text" id="login" class="fadeIn second" name="login" placeholder="Nom d'utilisateur">
<input type="text" id="password" class="fadeIn third" name="login" placeholder="Mot de passe">
<input type="submit" class="fadeIn fourth" value="Se connecter">
<input type="text" id="login" class="fondu second" name="login" placeholder="Nom d'utilisateur">
<input type="text" id="password" class="fondu third" name="login" placeholder="Mot de passe">
<input type="submit" class="fondu fourth" value="Se connecter">
</form>
<!-- Remind Passowrd -->
<div id="formFooter">
<a class="underlineHover" href="#">Mot de passe oublié ?</a>
<div id="pied">
<a class="souligne" href="#">Mot de passe oublié ?</a>
</div>
</div>

44
css/connexion.css
View File

@ -40,7 +40,7 @@ h2 {
padding: 20px;
}
#formContent {
#contenu {
background: #fff;
padding: 30px;
@ -53,7 +53,7 @@ h2 {
text-align: center;
}
#formFooter {
#pied {
background-color: #f6f6f6;
border-top: 1px solid #dce8f1;
padding: 25px;
@ -133,7 +133,7 @@ input[type=text]:focus {
border-bottom: 2px solid #5fbae9;
}
input[type=text]:placeholder {
input[type=text]::placeholder {
color: #cccccc;
}
@ -142,16 +142,16 @@ input[type=text]:placeholder {
/* ANIMATIONS */
/* Simple CSS3 Fade-in-down Animation */
.fadeInDown {
-webkit-animation-name: fadeInDown;
animation-name: fadeInDown;
.fonduBas {
-webkit-animation-name: fonduBas;
animation-name: fonduBas;
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}
@-webkit-keyframes fadeInDown {
@-webkit-keyframes fonduBas {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
@ -164,7 +164,7 @@ input[type=text]:placeholder {
}
}
@keyframes fadeInDown {
@keyframes fonduBas {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
@ -178,15 +178,15 @@ input[type=text]:placeholder {
}
/* Simple CSS3 Fade-in Animation */
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-webkit-keyframes fondu { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fondu { from { opacity:0; } to { opacity:1; } }
@keyframes fondu { from { opacity:0; } to { opacity:1; } }
.fadeIn {
.fondu {
opacity:0;
-webkit-animation:fadeIn ease-in 1;
-moz-animation:fadeIn ease-in 1;
animation:fadeIn ease-in 1;
-webkit-animation:fondu ease-in 1;
-moz-animation:fondu ease-in 1;
animation:fondu ease-in 1;
-webkit-animation-fill-mode:forwards;
-moz-animation-fill-mode:forwards;
@ -197,32 +197,32 @@ input[type=text]:placeholder {
animation-duration:1s;
}
.fadeIn.first {
.fondu.premier {
-webkit-animation-delay: 0.4s;
-moz-animation-delay: 0.4s;
animation-delay: 0.4s;
}
.fadeIn.second {
.fondu.deuxieme {
-webkit-animation-delay: 0.6s;
-moz-animation-delay: 0.6s;
animation-delay: 0.6s;
}
.fadeIn.third {
.fondu.troisieme {
-webkit-animation-delay: 0.8s;
-moz-animation-delay: 0.8s;
animation-delay: 0.8s;
}
.fadeIn.fourth {
.fondu.quatrieme {
-webkit-animation-delay: 1s;
-moz-animation-delay: 1s;
animation-delay: 1s;
}
/* Simple CSS3 Fade-in Animation */
.underlineHover:after {
.souligne:after {
display: block;
left: 0;
bottom: -10px;
@ -233,11 +233,11 @@ input[type=text]:placeholder {
transition: width 0.2s;
}
.underlineHover:hover {
.souligne:hover {
color: #0d0d0d;
}
.underlineHover:hover:after{
.souligne:hover:after{
width: 100%;
}

39
css/creation.html
View File

@ -1,39 +0,0 @@
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8" />
<!--link rel="icon" href="IconeLogo.ico"/-->
<title>Accueil</title>
<link rel="stylesheet" href="css/creation.css" />
</head>
<body>
<! --form action="" name"" method="POST"-->
<div class="wrapper fadeInDown">
<div id="formContent">
<!-- Tabs Titles -->
<h2 class="inactive underlineHover">Se connecter</h2>
<h2 class="active">Créer un compte </a></h2>
<!-- Login Form -->
<form>
<input type="text" id="login" class="fadeIn second" name="login" placeholder="Nom d'utilisateur">
<input type="text" id="password" class="fadeIn third" name="login" placeholder="Mot de passe">
<input type="submit" class="fadeIn fourth" value="Se connecter">
</form>
<!-- Remind Passowrd -->
<div id="formFooter">
<a class="underlineHover" href="#">Mot de passe oublié ?</a>
</div>
</div>
</div>
<! --/form-->
</body>
</html>

45
css/creation.css → css/inscription.css
View File

@ -40,8 +40,7 @@ h2 {
padding: 20px;
}
#formContent {
#contenu {
background: #fff;
padding: 30px;
width: 90%;
@ -53,7 +52,7 @@ h2 {
text-align: center;
}
#formFooter {
#pied {
background-color: #f6f6f6;
border-top: 1px solid #dce8f1;
padding: 25px;
@ -133,7 +132,7 @@ input[type=text]:focus {
border-bottom: 2px solid #5fbae9;
}
input[type=text]:placeholder {
input[type=text]::placeholder {
color: #cccccc;
}
@ -142,16 +141,16 @@ input[type=text]:placeholder {
/* ANIMATIONS */
/* Simple CSS3 Fade-in-down Animation */
.fadeInDown {
-webkit-animation-name: fadeInDown;
animation-name: fadeInDown;
.fonduBas {
-webkit-animation-name: fonduBas;
animation-name: fonduBas;
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}
@-webkit-keyframes fadeInDown {
@-webkit-keyframes fonduBas {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
@ -164,7 +163,7 @@ input[type=text]:placeholder {
}
}
@keyframes fadeInDown {
@keyframes fonduBas {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
@ -178,15 +177,15 @@ input[type=text]:placeholder {
}
/* Simple CSS3 Fade-in Animation */
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-webkit-keyframes fondu { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fondu { from { opacity:0; } to { opacity:1; } }
@keyframes fondu { from { opacity:0; } to { opacity:1; } }
.fadeIn {
.fondu {
opacity:0;
-webkit-animation:fadeIn ease-in 1;
-moz-animation:fadeIn ease-in 1;
animation:fadeIn ease-in 1;
-webkit-animation:fondu ease-in 1;
-moz-animation:fondu ease-in 1;
animation:fondu ease-in 1;
-webkit-animation-fill-mode:forwards;
-moz-animation-fill-mode:forwards;
@ -197,32 +196,32 @@ input[type=text]:placeholder {
animation-duration:1s;
}
.fadeIn.first {
.fondu.premier {
-webkit-animation-delay: 0.4s;
-moz-animation-delay: 0.4s;
animation-delay: 0.4s;
}
.fadeIn.second {
.fondu.deuxieme {
-webkit-animation-delay: 0.6s;
-moz-animation-delay: 0.6s;
animation-delay: 0.6s;
}
.fadeIn.third {
.fondu.troisieme {
-webkit-animation-delay: 0.8s;
-moz-animation-delay: 0.8s;
animation-delay: 0.8s;
}
.fadeIn.fourth {
.fondu.quatrieme {
-webkit-animation-delay: 1s;
-moz-animation-delay: 1s;
animation-delay: 1s;
}
/* Simple CSS3 Fade-in Animation */
.underlineHover:after {
.souligne:after {
display: block;
left: 0;
bottom: -10px;
@ -233,11 +232,11 @@ input[type=text]:placeholder {
transition: width 0.2s;
}
.underlineHover:hover {
.souligne:hover {
color: #0d0d0d;
}
.underlineHover:hover:after{
.souligne:hover:after{
width: 100%;
}

40
inscription.html Normal file
View File

@ -0,0 +1,40 @@
<html lang="fr" dir="ltr">
<head>
<meta charset="utf-8" />
<!--link rel="icon" href="IconeLogo.ico"/-->
<title>Accueil</title>
<link rel="stylesheet" href="css/inscription.css" />
</head>
<body>
<div class="wrapper fonduBas">
<div id="contenu">
<!-- Tabs Titles -->
<h2 class="inactive souligne"><a href="connexion.html"> Se connecter</a></h2>
<h2 class="active">Créer un compte</h2>
<!-- Login Form -->
<form>
<input type="text" id="login" class="fondu second" name="login" placeholder="Nom d'utilisateur">
<input type="text" id="password" class="fondu third" name="login" placeholder="Mot de passe">
<input type="submit" class="fondu fourth" value="S'inscrire">
</form>
<!-- Remind Passowrd -->
<div id="pied">
<a class="souligne" href="connexion.html">Déjà inscrit ?</a>
</div>
</div>
</div>
</body>
</html>