ebene/radiantrh
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Modification du style du login de connexion pour améliorer l’élégance, l’ergonomie, la responsivité.

Browse Source
This commit is contained in:
KONE SOREL 2025-12-10 12:53:32 +00:00
parent 45e4bdce66
commit ac197b7693
2 changed files with 113 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

60
Vue/Ajaxconnexioncookie/french.php
View File

@ -1,44 +1,42 @@
<?php <div class="login-card">
echo "sorel"
?>
<span class="login100-form-title" style="font-family: Play-Bold; color:#e5e5e5; margin-top: 5px; margin-bottom:10px;"> <div class="login-header">
RADIANT : Portail Souscripteur <h2>RADIANT : Portail Souscripteur</h2>
</span> </div>
<div class="wrap-input100"> <div class="form-group">
<label for="langue">Langue</label> <label for="langue" class="required">Langue</label>
<select class="form-select" id="langue" name="langue" required autocomplete="off" onchange="javascript:changer_langue_connexion();"> <select class="form-select custom-input" id="langue" name="langue" required autocomplete="off" onchange="changer_langue_connexion();">
<?php liste_options($langues, $_SESSION['lang'], true); ?> <?php liste_options($langues, $_SESSION['lang'], true); ?>
</select> </select>
</div>
<div class="sr-only">
<div class="wrap-input100 validate-input" data-validate="Enter Entity">
<label for="codeSociete">Entité</label>
<input class="input100" type="text" name="codeSociete" id="codeSociete" value="<?= $codeSociete ?>" >
</div> </div>
</div>
<div id="div_login_portail" class="wrap-input100"> <input class="sr-only" type="text" name="codeSociete" id="codeSociete" value="<?= $codeSociete ?>">
<div class="wrap-input100 validate-input" data-validate="Enter username">
<label for="login">Identifiant</label> <div class="form-group">
<input class="input100" type="text" name="login" id="login" value="<?= $codeUtilisateur ?>" placeholder="Identifiant" style="text-align:center;" required AUTOCOMPLETE="off"> <label for="login" class="required">Identifiant</label>
<div class="input-icon">
<i class="zmdi zmdi-account"></i>
<input type="text" class="custom-input" name="login" id="login"
placeholder="Identifiant" required autocomplete="off">
</div>
</div> </div>
</div>
<div class="wrap-input100 validate-input" data-validate="Enter password"> <div class="form-group">
<label for="mdp">Mot de passe</label> <label for="mdp" class="required">Mot de passe</label>
<input class="input100" type="password" name="mdp" id="mdp" placeholder="Mot de passe" style="text-align:center;" required AUTOCOMPLETE="off"> <div class="input-icon">
</div> <i class="zmdi zmdi-lock"></i>
<input type="password" class="custom-input" name="mdp" id="mdp"
placeholder="Mot de passe" required autocomplete="off">
</div>
</div>
<div class="container-login100-form-btn"> <button name="btn_connexion" id="btn_connexion" class="btn login-btn w-100 mt-3">
<button name="btn_connexion" id="btn_connexion" class="btn login-btn">
Connexion Connexion
</button> </button>
</div>
<div class="footer"> <div class="login-footer">
Tous droits réservés <a href="https://www.ebene.info/">&copy; EBENE SOLUTIONS INFORMATIQUES</a> Tous droits réservés
<a href="https://www.ebene.info/">&copy; EBENE SOLUTIONS INFORMATIQUES</a>
</div>
</div> </div>

79
Vue/portail.php
View File

@ -395,6 +395,85 @@
} }
.login-card {
max-width: 380px;
margin: auto;
padding: 35px 30px;
border-radius: 14px;
background: #ffffff;
box-shadow: 0 12px 35px rgba(0,0,0,0.10);
text-align: center;
}
.login-header h2 {
font-size: 24px;
color: #7D4FFE;
font-weight: 700;
margin-bottom: 25px;
}
.form-group {
text-align: left;
margin-bottom: 18px;
}
.custom-input {
width: 100%;
border: 2px solid #7D4FFE;
border-radius: 8px;
padding: 12px 36px 12px 12px;
font-size: 14px;
color: #7D4FFE;
background: transparent;
}
.custom-input:focus {
border-color: #5e36e0;
box-shadow: none;
}
.input-icon {
position: relative;
}
.input-icon i {
position: absolute;
right: 12px;
top: 50%;
transform: translateY(-50%);
font-size: 20px;
color: #7D4FFE;
}
.login-btn {
background: #7D4FFE;
color: #fff;
font-size: 18px;
font-weight: 700;
padding: 10px;
border-radius: 8px;
transition: .25s;
}
.login-btn:hover {
background: #fff;
color: #7D4FFE;
border: 2px solid #7D4FFE;
}
.login-footer {
margin-top: 18px;
font-size: 12px;
color: #7D4FFE;
}
@media (max-width: 768px) {
.login-card {
width: 90%;
padding: 25px 20px;
}
}
</style> </style>
</head> </head>