diff --git a/.idea/workspace.xml b/.idea/workspace.xml new file mode 100644 index 0000000..f497dd6 --- /dev/null +++ b/.idea/workspace.xml @@ -0,0 +1,82 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 1607026953826 + + + + + + + + + \ No newline at end of file diff --git a/connexion.html b/connexion.html index e4cc6ee..976f7d0 100644 --- a/connexion.html +++ b/connexion.html @@ -4,8 +4,9 @@ - Accueil + Connexion +
@@ -26,7 +27,7 @@
- Mot de passe oublié ? + Mot de passe oublié ?
diff --git a/css/connexion.css b/css/connexion.css index c42c508..e85249e 100644 --- a/css/connexion.css +++ b/css/connexion.css @@ -1,13 +1,5 @@ /* BASIC */ -html { - background-color: #56baed; -} - -body { - font-family: "Poppins", sans-serif; - height: 100vh; -} a { color: #92badd; @@ -215,11 +207,6 @@ input[type=text]::placeholder { animation-delay: 0.8s; } -.fondu.quatrieme { - -webkit-animation-delay: 1s; - -moz-animation-delay: 1s; - animation-delay: 1s; -} /* Simple CSS3 Fade-in Animation */ .souligne:after { diff --git a/css/inscription.css b/css/inscription.css index 91a48ad..0192756 100644 --- a/css/inscription.css +++ b/css/inscription.css @@ -1,14 +1,5 @@ /* BASIC */ -html { - background-color: #56baed; -} - -body { - font-family: "Poppins", sans-serif; - height: 100vh; -} - a { color: #92badd; display:inline-block; @@ -220,6 +211,18 @@ input[type=text]::placeholder { animation-delay: 1s; } +.fondu.cinquieme { + -webkit-animation-delay: 1.2s; + -moz-animation-delay: 1.2s; + animation-delay: 1.2s; +} +.fondu.sixieme { + -webkit-animation-delay: 1.4s; + -moz-animation-delay: 1.4s; + animation-delay: 1.4s; +} + + /* Simple CSS3 Fade-in Animation */ .souligne:after { display: block; diff --git a/css/recupMDP.css b/css/recupMDP.css new file mode 100644 index 0000000..e85249e --- /dev/null +++ b/css/recupMDP.css @@ -0,0 +1,245 @@ +/* BASIC */ + + +a { + color: #92badd; + display:inline-block; + text-decoration: none; + font-weight: 400; +} + +h2 { + text-align: center; + font-size: 16px; + font-weight: 600; + text-transform: uppercase; + display:inline-block; + margin: 40px 8px 10px 8px; + color: #cccccc; +} + + + +/* STRUCTURE */ + +.wrapper { + display: flex; + align-items: center; + flex-direction: column; + justify-content: center; + width: 100%; + min-height: 100%; + padding: 20px; +} + +#contenu { + + background: #fff; + padding: 30px; + width: 90%; + max-width: 450px; + position: relative; + padding: 0px; + -webkit-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.3); + box-shadow: 0 30px 60px 0 rgba(0,0,0,0.3); + text-align: center; +} + +#pied { + background-color: #f6f6f6; + border-top: 1px solid #dce8f1; + padding: 25px; + text-align: center; +} + + + +/* TABS */ + +h2.inactive { + color: #cccccc; +} + +h2.active { + color: #0d0d0d; + border-bottom: 2px solid #5fbae9; +} + + + +/* FORM TYPOGRAPHY*/ + +input[type=button], input[type=submit], input[type=reset] { + background-color: #56baed; + border: none; + color: white; + padding: 15px 80px; + text-align: center; + text-decoration: none; + display: inline-block; + text-transform: uppercase; + font-size: 13px; + -webkit-box-shadow: 0 10px 30px 0 rgba(95,186,233,0.4); + box-shadow: 0 10px 30px 0 rgba(95,186,233,0.4); + margin: 5px 20px 40px 20px; + -webkit-transition: all 0.3s ease-in-out; + -moz-transition: all 0.3s ease-in-out; + -ms-transition: all 0.3s ease-in-out; + -o-transition: all 0.3s ease-in-out; + transition: all 0.3s ease-in-out; +} + +input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover { + background-color: #39ace7; +} + +input[type=button]:active, input[type=submit]:active, input[type=reset]:active { + -moz-transform: scale(0.95); + -webkit-transform: scale(0.95); + -o-transform: scale(0.95); + -ms-transform: scale(0.95); + transform: scale(0.95); +} + +input[type=text] { + background-color: #f6f6f6; + border: none; + color: #0d0d0d; + padding: 15px 32px; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 16px; + margin: 5px; + width: 85%; + border: 2px solid #f6f6f6; + -webkit-transition: all 0.5s ease-in-out; + -moz-transition: all 0.5s ease-in-out; + -ms-transition: all 0.5s ease-in-out; + -o-transition: all 0.5s ease-in-out; + transition: all 0.5s ease-in-out; +} + +input[type=text]:focus { + background-color: #fff; + border-bottom: 2px solid #5fbae9; +} + +input[type=text]::placeholder { + color: #cccccc; +} + + + +/* ANIMATIONS */ + +/* Simple CSS3 Fade-in-down Animation */ +.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 fonduBas { + 0% { + opacity: 0; + -webkit-transform: translate3d(0, -100%, 0); + transform: translate3d(0, -100%, 0); + } + 100% { + opacity: 1; + -webkit-transform: none; + transform: none; + } +} + +@keyframes fonduBas { + 0% { + opacity: 0; + -webkit-transform: translate3d(0, -100%, 0); + transform: translate3d(0, -100%, 0); + } + 100% { + opacity: 1; + -webkit-transform: none; + transform: none; + } +} + +/* Simple CSS3 Fade-in Animation */ +@-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; } } + +.fondu { + opacity:0; + -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; + animation-fill-mode:forwards; + + -webkit-animation-duration:1s; + -moz-animation-duration:1s; + animation-duration:1s; +} + +.fondu.premier { + -webkit-animation-delay: 0.4s; + -moz-animation-delay: 0.4s; + animation-delay: 0.4s; +} + +.fondu.deuxieme { + -webkit-animation-delay: 0.6s; + -moz-animation-delay: 0.6s; + animation-delay: 0.6s; +} + +.fondu.troisieme { + -webkit-animation-delay: 0.8s; + -moz-animation-delay: 0.8s; + animation-delay: 0.8s; +} + + +/* Simple CSS3 Fade-in Animation */ +.souligne:after { + display: block; + left: 0; + bottom: -10px; + width: 0; + height: 2px; + background-color: #56baed; + content: ""; + transition: width 0.2s; +} + +.souligne:hover { + color: #0d0d0d; +} + +.souligne:hover:after{ + width: 100%; +} + + + +/* OTHERS */ + +*:focus { + outline: none; +} + +#icon { + width:60%; +} + +* { + box-sizing: border-box; +} \ No newline at end of file diff --git a/inscription.html b/inscription.html index 868311a..e0f12b1 100644 --- a/inscription.html +++ b/inscription.html @@ -4,8 +4,9 @@ - Accueil + Inscription + @@ -18,9 +19,18 @@ +<<<<<<< HEAD +======= + + + + + + +>>>>>>> b9bf5b2edb8e213d4bd18f03395ccc8c4d5450d2
diff --git a/recupMDP.html b/recupMDP.html new file mode 100644 index 0000000..7df8d3b --- /dev/null +++ b/recupMDP.html @@ -0,0 +1,38 @@ + + + + + + + Recuperation + + + + +
+ +
+
+ +

Mot de passe oublié

+ + + + + + + + + + + +
+
+ + + + + + \ No newline at end of file