integration

VolkenoMakers · Mar 29, 2021 · c7252f2 · c7252f2
1 parent 186679c
commit c7252f2
Show file tree

Hide file tree

Showing 5 changed files with 148 additions and 166 deletions.
diff --git a/src/Components/Login.js b/src/Components/Login.js
diff --git a/src/components/Login/Login.js b/src/components/Login/Login.js
@@ -1,9 +1,58 @@
 import React from 'react'
+import styles from '../styles.module.css'
+import FeatherIcon from 'feather-icons-react'
 
 const Login = () => {
-    return(
-        'Login'
-    )
-}
+  return (
+    <div className={'container ' + styles.formContainer}>
+      <div className={'row ' + styles.w_full}>
+        <div className='col-xl-5 col-lg-6 col-md-8 col-sm-10 m-auto'>
+          <div className={'p-sm-5 py-5 px-4 ' + styles.formLoginRegister}>
+            <span className={'mb-sm-5 mb-3 ' + styles.formLoginRegisterTitle}>
+              Connectez-vous
+            </span>
+            <div className='form-group position-relative'>
+              <span className={styles.formLoginRegisterPrepend}>
+                <FeatherIcon icon='mail' />
+              </span>
+              <input
+                type='email'
+                className={'form-control ' + styles.formLoginRegisterInput}
+                placeholder='Adresse mail'
+              />
+            </div>
+            <div className='form-group position-relative'>
+              <span className={styles.formLoginRegisterPrepend}>
+                <FeatherIcon icon='lock' />
+              </span>
+              <input
+                type='password'
+                className={'form-control ' + styles.formLoginRegisterInput}
+                placeholder='Mot de passe'
+              />
+            </div>
+            <a className={styles.formLoginRegisterForgotPasswordLink} href='#'>
+              Mot de passe oublié ?
+            </a>
 
-export default Login;
+            <button
+              className={'mt-5 mb-4 ' + styles.formLoginRegisterbtnPrimary}
+            >
+              Connexion
+            </button>
+            <p className={' ' + styles.formLoginRegisterFooter}>
+              Pas encore de compte ?
+              <a
+                href='#'
+                className={'ml-1 ' + styles.formLoginRegisterFooterLink}
+              >
+                s’inscrire
+              </a>
+            </p>
+          </div>
+        </div>
+      </div>
+    </div>
+  )
+}
+export default Login
diff --git a/src/components/Register.js b/src/components/Register.js
diff --git a/src/components/Register/Register.js b/src/components/Register/Register.js
@@ -1,9 +1,96 @@
 import React from 'react'
+import styles from '../styles.module.css'
+import FeatherIcon from 'feather-icons-react'
 
 const Register = () => {
-    return(
-        'Register'
-    )
-}
+  return (
+    <div className={'container ' + styles.formContainer}>
+      <div className={'row py-5 ' + styles.w_full}>
+        <div className='col-xl-5 col-lg-6 col-md-8 col-sm-10 m-auto'>
+          <div className={'p-sm-5 py-5 px-4 ' + styles.formLoginRegister}>
+            <span className={'mb-sm-5 mb-3 ' + styles.formLoginRegisterTitle}>
+              Inscrivez-vous
+            </span>
+            <div className='form-group position-relative'>
+              <span className={styles.formLoginRegisterPrepend}>
+                <FeatherIcon icon='user' />
+              </span>
+              <input
+                type='text'
+                className={'form-control ' + styles.formLoginRegisterInput}
+                placeholder='Prénom'
+              />
+            </div>
+            <div className='form-group position-relative'>
+              <span className={styles.formLoginRegisterPrepend}>
+                <FeatherIcon icon='user' />
+              </span>
+              <input
+                type='text'
+                className={'form-control ' + styles.formLoginRegisterInput}
+                placeholder='Nom'
+              />
+            </div>
+            <div className='form-group position-relative'>
+              <span className={styles.formLoginRegisterPrepend}>
+                <FeatherIcon icon='user' />
+              </span>
+              <input
+                type='text'
+                className={'form-control ' + styles.formLoginRegisterInput}
+                placeholder='Prénom & Nom'
+              />
+            </div>
+            <div className='form-group position-relative'>
+              <span className={styles.formLoginRegisterPrepend}>
+                <FeatherIcon icon='mail' />
+              </span>
+              <input
+                type='email'
+                className={'form-control ' + styles.formLoginRegisterInput}
+                placeholder='Adresse mail'
+              />
+            </div>
+            <div className='form-group position-relative'>
+              <span className={styles.formLoginRegisterPrepend}>
+                <FeatherIcon icon='lock' />
+              </span>
+              <input
+                type='password'
+                className={'form-control ' + styles.formLoginRegisterInput}
+                placeholder='Mot de passe'
+              />
+            </div>
+            <div className='form-group position-relative'>
+              <span className={styles.formLoginRegisterPrepend}>
+                <FeatherIcon icon='lock' />
+              </span>
+              <input
+                type='password'
+                className={'form-control ' + styles.formLoginRegisterInput}
+                placeholder='Confirmer mot de passe'
+              />
+            </div>
+
 
-export default Register;
+            <button
+              className={'mt-5 mb-4 ' + styles.formLoginRegisterbtnPrimary}
+            >
+              Inscription
+            </button>
+            <p className={' ' + styles.formLoginRegisterFooter}>
+              Déja inscrit?
+              <a
+                href='#'
+                className={'ml-1 ' + styles.formLoginRegisterFooterLink}
+              >
+                se connecter
+              </a>
+            </p>
+          </div>
+        </div>
+      </div>
+    </div>
+  )
+}
+export default Register
diff --git a/src/index.js b/src/index.js
@@ -5,15 +5,15 @@ import Register from './components/Register/Register'
 
 export const AuthLogin = () => {
   return (
-    <div className="hhh">
+    <div className="">
       <Login />
     </div>
   )
 }
 
 export const AuthRegister = () => {
   return (
-    <div className="hhh">
+    <div className="">
       <Register />
     </div>
   )