diff --git a/views/_partial/header.tpl b/views/_partial/header.tpl
index 326bcfb..6f60a4d 100644
--- a/views/_partial/header.tpl
+++ b/views/_partial/header.tpl
@@ -91,7 +91,7 @@
         </div>
     </nav>
 
-    <main id="main-content" class="container my-4">
+    <main id="main-content" class="container my-4" {block name="display"}{/block}>
         <section class="p-4 mb-4 text-center txt_title" aria-labelledby="page-title">
             <div class="col-lg-8 mx-auto">
                 <h2 id="page-title" class="display-5 fw-semibold mb-3">
@@ -107,5 +107,4 @@
         </section>
     </main>
 
-</body>
     {include file="views/_partial/messages.tpl"}
diff --git a/views/home.tpl b/views/home.tpl
index d14bbf9..df0bdcb 100644
--- a/views/home.tpl
+++ b/views/home.tpl
@@ -1,5 +1,5 @@
 {extends file="views/layout.tpl"}
-
+{block name="display" }style="display:none;"{/block}
 {block name="content"}
 	<section class="container mt-5 p-5 d-flex flex-column align-items-center text-center">
 		<h1 class="logo">Folliow</h1>
diff --git a/views/inscription.tpl b/views/inscription.tpl
deleted file mode 100644
index 6cd1474..0000000
--- a/views/inscription.tpl
+++ /dev/null
@@ -1,184 +0,0 @@
-{extends file="views/layout.tpl"}
-
-{block name="content"}
-<main class="container py-5">
-    <div class="row justify-content-center position-relative">
-        <div class="col-12 col-md-10 col-lg-6">
-            <div class="card shadow-sm border-0 rounded-4 p-4 p-lg-5">
-                <h1 class="h3 fw-bold mb-1">Inscription</h1>
-                <p class="text-secondary mb-4">Créez votre compte utilisateur.</p>
-                {if (isset($arrError) && count($arrError) > 0) }
-	            	<div class="alert alert-danger">
-	            	{foreach $arrError as $strError}
-	            		<p>{$strError}</p>
-	            	{/foreach}
-	            	</div>
-	            {/if}
-
-                <form method="POST">
-                    <div class="row g-3">
-                        <div class="col-md-6">
-                            <label class="form-label" for="user_firstname">
-                                                    Prénom *
-                            </label>
-                            <input
-                                                    class="form-control"
-                                                    type="text"
-                                                    id="user_firstname"
-                                                    name="user_firstname"
-                                                    required >
-                        </div>
-                        <div class="col-md-6">
-                            <label class="form-label" for="user_name">
-                                                    Nom *
-                            </label>
-                            <input
-                                                    class="form-control"
-                                                    type="text"
-                                                    id="user_name"
-                                                    name="user_name"
-                                                    required>
-                        </div>
-                        <div class="col-12">
-                            <label class="form-label" for="user_pseudo">
-                                                    Pseudo *
-                            </label>
-                            <div class="input-group">
-                            <span class="input-group-text">@</span>
-                            <input
-                                                        class="form-control"
-                                                        type="text"
-                                                        id="user_pseudo"
-                                                        name="user_pseudo"
-                                                        required
-                            >
-                        </div>
-                    </div>
-
-                                    <!-- Champ : adresse e-mail -->
-                    <div class="col-12">
-                        <label class="form-label" for="user_mail">
-                                                Adresse e-mail *
-                        </label>
-                        <input
-                                                class="form-control"
-                                                type="email"
-                                                id="user_mail"
-                                                name="user_mail"
-                                                required
-                        >
-                    </div>
-
-                                    <!-- Champ : mot de passe -->
-                    <div class="col-12">
-                        <label class="form-label" for="user_password">
-                                                Mot de passe *
-                        </label>
-                        <input
-                                                class="form-control"
-                                                type="password"
-                                                id="user_password"
-                                                name="user_password"
-                                                required
-                        >
-                        <div class="mt-2 small text-muted">
-                            <p class="mb-1">Le mot de passe doit contenir :</p>
-                            <ul class="mb-0 ps-3">
-                                <li>Au moins <strong>15 caractères</strong></li>
-                                <li>Au moins <strong>une lettre majuscule</strong></li>
-                                <li>Au moins <strong>une lettre minuscule</strong></li>
-                                <li>Au moins <strong>un chiffre</strong></li>
-                                <li>Au moins <strong>un caractère spécial</strong> (# ? ! @ $ % ^ & * -)</li>
-                            </ul>
-                        </div>
-                    </div>
-                                <!-- Champ : confirmer le mot de passe -->
-                    <div class="col-12">
-                        <label class="form-label" for="pwd_confirm">
-                                                Confirmer le Mot de passe *
-                        </label>
-                        <input
-                                                class="form-control"
-                                                type="password"
-                                                id="pwd_confirm"
-                                                name="pwd_confirm"
-                                                required
-                        >
-                    </div>
-
-                                    <!-- Champ optionnel : numéro de téléphone -->
-                    <div class="col-12">
-                        <label class="form-label" for="user_phone">
-                                                Téléphone
-                        </label>
-                        <input
-                                                class="form-control"
-                                                type="text"
-                                                id="user_phone"
-                                                name="user_phone"
-                        >
-                    </div>
-
-                                    <!-- Champ optionnel : profession de l'utilisateur -->
-                    <div class="col-12">
-                        <label class="form-label" for="user_work">
-                                                Profession
-                        </label>
-                        <input
-                                                class="form-control"
-                                                type="text"
-                                                id="user_work"
-                                                name="user_work"
-                        >
-                    </div>
-
-                                    <!-- Champ optionnel : localisation de l'utilisateur -->
-                    <div class="col-12">
-                        <label class="form-label" for="user_location">
-                                                Localisation
-                        </label>
-                        <input
-                                                class="form-control"
-                                                type="text"
-                                                id="user_location"
-                                                name="user_location"
-                        >
-                    </div>
-
-                                    <!-- Champ optionnel : phrase d'accroche  -->
-                    <div class="col-12">
-                        <label class="form-label" for="user_description">
-                                                Phrase d'accroche
-                        </label>
-                        <textarea
-                                                class="form-control"
-                                                id="user_description"
-                                                name="user_description"
-                                                rows="3"
-                        ></textarea>
-                    </div>
-
-                                    <!-- Bouton de soumission du formulaire -->
-                    <div class="col-12 d-grid mt-2">
-                        <button type="submit" class="btn btn-primary btn-lg rounded-3">
-                                                Créer mon compte
-                        </button>
-                        </div>
-
-                                        <!-- Lien vers la page de connexion -->
-                        <div class="col-12 text-center">
-                        <small class="text-secondary">
-                                                Déjà un compte ?
-                        <a href="{$smarty.env.BASE_URL}/user/login">Se connecter</a>
-                        </small>
-                    </div>
-                </form>
-
-            </div>
-                
-
-        </div>
-
-    </div>
-</main>
-{/block}
\ No newline at end of file
diff --git a/views/layout.tpl b/views/layout.tpl
index 40775b2..6f8d4b6 100644
--- a/views/layout.tpl
+++ b/views/layout.tpl
@@ -1,6 +1,6 @@
 {include file="views/_partial/header.tpl"}
 
-<main class="container mb-4 mt-1">
+<main class="container mb-4 mt-1 flex-grow-1 d-flex flex-column align-items-center justify-content-center">
     {block name="content"}
     {/block}
 </main>
diff --git a/views/login.tpl b/views/login.tpl
index c0345e2..3847034 100644
--- a/views/login.tpl
+++ b/views/login.tpl
@@ -1,6 +1,7 @@
 {extends file="views/layout.tpl"}
 {block name="title" append} - Connexion{/block}
 
+{block name="display" }style="display:none;"{/block}
 {block name="content"}
 <section aria-label="Se connecter">
 
diff --git a/views/signup.tpl b/views/signup.tpl
index 6839662..21d9d9c 100644
--- a/views/signup.tpl
+++ b/views/signup.tpl
@@ -1,6 +1,7 @@
 {extends file="views/layout.tpl"}
 {block name="title" append} - Inscription{/block}
 
+{block name="display" }style="display:none;"{/block}
 {block name="content"}
 <!-- Page : Inscription -->
 <div class="py-5">
@@ -93,13 +94,33 @@
 							<label class="form-label" for="user_password">
 								Mot de passe *
 							</label>
-							<input
-								class="form-control"
-								type="password"
-								id="user_password"
-								name="user_password"
-								required
-							>
+							<div class="position-relative">
+    						    <input
+    						        class="form-control pe-5" 
+    						        type="password"
+    						        id="user_password"
+    						        name="user_password"
+    						        required
+    						    >
+    						    <button
+    						        class="btn position-absolute top-50 end-0 translate-middle-y me-2 p-0 border-0 bg-transparent text-muted"
+    						        type="button"
+    						        onclick="togglePassword('user_password', this)"
+    						        style="z-index: 10;"
+    						    >
+    						        <i class="fa-regular fa-eye"></i>
+    						    </button>
+    						</div>
+							<div class="mt-2 small text-muted">
+                            <p class="mb-1">Le mot de passe doit contenir :</p>
+                            <ul class="mb-0 ps-3">
+                                <li>Au moins <strong>15 caractères</strong></li>
+                                <li>Au moins <strong>une lettre majuscule</strong></li>
+                                <li>Au moins <strong>une lettre minuscule</strong></li>
+                                <li>Au moins <strong>un chiffre</strong></li>
+                                <li>Au moins <strong>un caractère spécial</strong> (# ? ! @ $ % ^ & * -)</li>
+                            </ul>
+                        </div>
 						</div>
 
 						<!-- Champ : confirmer le mot de passe -->
@@ -107,13 +128,22 @@
 							<label class="form-label" for="pwd_confirm">
 								Confirmer le mot de passe *
 							</label>
+							<div class="position-relative">
 							<input
 								class="form-control"
 								type="password"
 								id="pwd_confirm"
 								name="pwd_confirm"
 								required
-							>
+							><button
+    						        class="btn position-absolute top-50 end-0 translate-middle-y me-2 p-0 border-0 bg-transparent text-muted"
+    						        type="button"
+    						        onclick="togglePassword('pwd_confirm', this)"
+    						        style="z-index: 10;"
+    						    >
+    						        <i class="fa-regular fa-eye"></i>
+    						    </button>
+    						</div>
 						</div>
 
 						<!-- Champ optionnel : numéro de téléphone -->
@@ -207,5 +237,42 @@
 	</div>
 
 </div>
+<script>
+    const pwd = document.getElementById('user_password');
+
+    const rules = {
+        length:  { el: null, test: v => v.length >= 15 },
+        upper:   { el: null, test: v => /[A-Z]/.test(v) },
+        lower:   { el: null, test: v => /[a-z]/.test(v) },
+        digit:   { el: null, test: v => /[0-9]/.test(v) },
+        special: { el: null, test: v => /[#?!@$%^&*\-]/.test(v) }
+    };
+
+    // Associe chaque règle à son <li> dans l'ordre du DOM
+    const items = pwd.closest('.col-12').querySelectorAll('ul li');
+    const keys = Object.keys(rules);
+    items.forEach((li, i) => rules[keys[i]].el = li);
+
+    pwd.addEventListener('input', () => {
+        const v = pwd.value;
+        keys.forEach(key => {
+            const { el, test } = rules[key];
+            el.classList.toggle('text-success', test(v));
+            el.classList.toggle('text-danger',   !test(v));
+        });
+    });
+
+	function togglePassword(fieldId, btn) {
+	    const input = document.getElementById(fieldId);
+	    const icon = btn.querySelector('svg');
+	    if (input.type === 'password') {
+	        input.type = 'text';
+	        icon.classList.replace('fa-eye', 'fa-eye-slash');
+	    } else {
+	        input.type = 'password';
+	        icon.classList.replace('fa-eye-slash', 'fa-eye');
+	    }
+	}
+</script>
 {include file="views/_partial/apigeo.tpl"}
 {/block}
\ No newline at end of file