13.5 Avertissement double authentification

Thème login et auth

core/module/config/view/connect/connect.php

@@ -38,10 +38,10 @@
 						]); ?>
 					</div>
 					<div class="col4">
-						<?php echo template::select('connectAuthMail', array_merge([''=>'Aucune'], self::$groupNews), [
-							'label' => 'Validation par messagerie',
+					<?php echo template::select('connectAuthMail', array_merge([''=>'Aucune'], self::$groupNews), [
+							'label' => 'Validation par messagerie ⚠️',
 							'selected' => $this->getData(['config', 'connect', 'mailAuth']),
-							'help' => 'La connexion est confirmée par une clé adressée par messagerie. Depuis le groupe sélectionnée et les groupes supérieurs.'
+							'help' => 'La connexion est confirmée par une clé transmise par messagerie. Depuis le groupe sélectionnée et les groupes supérieurs. Vérifiez le bon fonctionnement du serveur de messagerie AVANT d\'activer cette option!'
 						]); ?>
 					</div>
 					

core/module/user/view/auth/auth.css

@@ -32,5 +32,20 @@
 
 #userAuthKey {
     text-align: center;
-    font-size: 1.3rem;
-}
+    font-size: 2rem;
+    border: none; /* Supprime toutes les bordures */
+    border-bottom: 2px solid #000; /* Ajoute uniquement une bordure inférieure */
+    padding: 5px 0; /* Ajoute un peu d'espace au-dessus et en dessous */
+    margin-top: 10px; /* Ajoute un espacement au-dessus du champ */
+    outline: none; /* Supprime l'effet de focus par défaut */
+    letter-spacing: 6px; /* Ajoute un espacement de 2 pixels */
+}
+
+#userAuthKey:focus {
+    border-bottom-color: #007bff; /* Change la couleur du cadre bas lorsqu'on clique */
+    border-bottom-width: 3px; /* Accentue la bordure inférieure */
+}
+
+.container.light {
+    filter: drop-shadow(5px 5px 10px rgba(0, 0, 0, 0.2));
+}

core/module/user/view/auth/auth.php

@@ -1,6 +1,6 @@
 <?php echo template::formOpen('userAuthForm'); ?>
 <div class="row">
-    <div class="col6 offset3">
+    <div class="col4 offset4">
         <?php echo template::text('userAuthKey', [
             'label' => helper::translate('Clé reçue par couriel')
         ]); ?>
@@ -13,10 +13,10 @@
             'value' => template::ico('left')
         ]); ?>
     </div>
-    <div class="col3 offset7" id="loginContainer">
+    <div class="col2 offset8" id="loginContainer">
         <?php echo template::submit('userLoginSubmit', [
-            'value' => helper::translate('Authentification'),
-            'ico' => ''
+            'value' => template::ico('check'),
+            'ico' => '',
         ]); ?>
     </div>
 </div>

core/module/user/view/login/login.css

@@ -32,4 +32,24 @@
     #backContainer{
         order: 2;
     }
+}
+
+#userAuthKey {
+    text-align: center;
+    font-size: 2rem;
+    border: none; /* Supprime toutes les bordures */
+    border-bottom: 2px solid #000; /* Ajoute uniquement une bordure inférieure */
+    padding: 5px 0; /* Ajoute un peu d'espace au-dessus et en dessous */
+    margin-top: 10px; /* Ajoute un espacement au-dessus du champ */
+    outline: none; /* Supprime l'effet de focus par défaut */
+    letter-spacing: 6px; /* Ajoute un espacement de 2 pixels */
+}
+
+#userAuthKey:focus {
+    border-bottom-color: #007bff; /* Change la couleur du cadre bas lorsqu'on clique */
+    border-bottom-width: 3px; /* Accentue la bordure inférieure */
+}
+
+.container.light {
+    filter: drop-shadow(5px 5px 10px rgba(0, 0, 0, 0.2));
 }

core/module/user/view/login/login.js.php

@@ -8,4 +8,32 @@
  * @license CC Attribution-NonCommercial-NoDerivatives 4.0 International
  * @link http://zwiicms.fr/
  */
-$(document).ready((function(){$(".zwiico-eye").mouseenter((function(){$("#userLoginPassword").attr("type","text")})),$(".zwiico-eye").mouseleave((function(){$("#userLoginPassword").attr("type","password")}))}));
+ $(document).ready((function() {
+    $("#userLoginId").on("change keydown keyup", function (event) {
+		var userId = $(this).val();
+		if (
+			event.keyCode !== 8 // BACKSPACE
+			&& event.keyCode !== 37 // LEFT
+			&& event.keyCode !== 39 // RIGHT
+			&& event.keyCode !== 46 // DELETE
+			&& window.getSelection().toString() !== userId // Texte sélectionné
+		) {
+			var searchReplace = {
+				"á": "a", "à": "a", "â": "a", "ä": "a", "ã": "a", "å": "a", "ç": "c", "é": "e", "è": "e", "ê": "e", "ë": "e", "í": "i", "ì": "i", "î": "i", "ï": "i", "ñ": "n", "ó": "o", "ò": "o", "ô": "o", "ö": "o", "õ": "o", "ú": "u", "ù": "u", "û": "u", "ü": "u", "ý": "y", "ÿ": "y",
+				"Á": "A", "À": "A", "Â": "A", "Ä": "A", "Ã": "A", "Å": "A", "Ç": "C", "É": "E", "È": "E", "Ê": "E", "Ë": "E", "Í": "I", "Ì": "I", "Î": "I", "Ï": "I", "Ñ": "N", "Ó": "O", "Ò": "O", "Ô": "O", "Ö": "O", "Õ": "O", "Ú": "U", "Ù": "U", "Û": "U", "Ü": "U", "Ý": "Y", "Ÿ": "Y",
+				"'": "-", "\"": "-", " ": "-"
+			};
+			userId = userId.replace(/[áàâäãåçéèêëíìîïñóòôöõúùûüýÿ'" ]/ig, function (match) {
+				return searchReplace[match];
+			});
+			userId = userId.replace(/[^a-z0-9-]/ig, "");
+			$(this).val(userId);
+		}
+	});
+
+    $(".zwiico-eye").mouseenter((function() {
+        $("#userLoginPassword").attr("type", "text")
+    })), $(".zwiico-eye").mouseleave((function() {
+        $("#userLoginPassword").attr("type", "password")
+    }))
+}));

core/module/user/view/login/login.php

@@ -45,10 +45,10 @@
 			'value' => template::ico('left')
 		]); ?>
 	</div>
-	<div class="col3 offset7" id="loginContainer">
+	<div class="col2 offset8" id="loginContainer">
 		<?php echo template::submit('userLoginSubmit', [
-			'value' => 'Connexion',
-			'ico' => ''
+            'value' => template::ico('check'),
+            'ico' => '',
 		]); ?>
 	</div>
 </div>