dert
This commit is contained in:
parent
c0a4411058
commit
c099b60daf
|
|
@ -2,36 +2,44 @@
|
|||
INTER SANTÉ — LOGIN UI (ONLY)
|
||||
============================================================ */
|
||||
|
||||
/* RESET */
|
||||
html, body { height: 100%; margin: 0; overflow: hidden; background: #000; color: #fff; font-family: 'Segoe UI', sans-serif; }
|
||||
/* RESET & LAYOUT */
|
||||
html, body { height: 100%; margin: 0; overflow: hidden; background: #0b0e11; color: #fff; font-family: 'Segoe UI', sans-serif; }
|
||||
|
||||
.portal-container { position: relative; width: 100vw; height: 100vh; }
|
||||
.portal-wrapper { display: flex; height: 100vh; width: 100vw; }
|
||||
|
||||
/* SLIDE AREA (Full Background) */
|
||||
.slide-container { position: absolute; width: 100%; height: 100%; z-index: 1; overflow: hidden; }
|
||||
.slides img { width: 100%; height: 100%; object-fit: cover; position: absolute; }
|
||||
.slides img:not(.active) { top: 0; left: -100%; } /* Position de départ pour ton JS */
|
||||
/* SECTION GAUCHE : SLIDE (40vw) */
|
||||
.slide-container { width: 40vw; height: 100%; position: relative; overflow: hidden; background: #000; border-right: 1px solid rgba(255,255,255,0.1); }
|
||||
.slides { width: 100%; height: 100%; position: relative; }
|
||||
.slides img { width: 100%; height: 100%; position: absolute; object-fit: cover; }
|
||||
.slides img:not(.active) { left: -100%; }
|
||||
|
||||
/* LOGIN AREA (Centered) */
|
||||
.login-wrapper { position: absolute; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; z-index: 10; background: rgba(0,0,0,0.6); }
|
||||
.login-box { width: 400px; padding: 40px; background: rgba(255, 255, 255, 0.05); backdrop-filter: blur(15px); border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 20px; }
|
||||
/* SECTION DROITE : CONTENT */
|
||||
.content-side { flex: 1; display: flex; align-items: center; justify-content: center; background: radial-gradient(circle, #1a1f24 0%, #0b0e11 100%); }
|
||||
.login-box { width: 100%; max-width: 400px; padding: 2rem; background: rgba(255, 255, 255, 0.03); backdrop-filter: blur(10px); border-radius: 15px; border: 1px solid rgba(255, 255, 255, 0.05); }
|
||||
.logo-area img { max-height: 80px; display: block; margin: 0 auto; }
|
||||
|
||||
/* TYPO & FORMS */
|
||||
.portal-title { color: #e5e5e5; text-transform: uppercase; letter-spacing: 2px; font-weight: bold; }
|
||||
.lbl-erp { font-size: 11px; text-transform: uppercase; color: #bbb; font-weight: 600; }
|
||||
.input-dark, .select-dark { background: rgba(0,0,0,0.3) !important; border: 1px solid rgba(255,255,255,0.1) !important; color: #fff !important; padding: 12px !important; }
|
||||
.btn-login { background: rgba(255,255,255,0.1); color: #fff; border: 1px solid rgba(255,255,255,0.2); border-radius: 10px; }
|
||||
.btn-login:hover { background: #fff; color: #000; }
|
||||
.forgot-link { font-size: 11px; color: #888; text-decoration: none; }
|
||||
.portal-footer { font-size: 11px; color: #666; }
|
||||
/* TYPOGRAPHIE & FORMS */
|
||||
.portal-title { color: #fff; font-weight: 700; text-transform: uppercase; letter-spacing: 2px; font-size: 1.25rem; }
|
||||
.lbl-saas { font-size: 11px; text-transform: uppercase; font-weight: 600; color: #848d9a; margin-bottom: 5px; display: block; }
|
||||
|
||||
/* TES ANIMATIONS ORIGINALES (Indispensables pour ton JS) */
|
||||
.input-dark, .select-dark { background: rgba(0, 0, 0, 0.2) !important; border: 1px solid #2d343c !important; color: #fff !important; border-radius: 8px !important; padding: 12px !important; }
|
||||
.input-dark:focus { border-color: #0088cf !important; box-shadow: none; background: rgba(0,0,0,0.4) !important; }
|
||||
|
||||
.btn-login-saas { background: #0088cf; border: none; color: #fff; border-radius: 8px; transition: 0.3s; }
|
||||
.btn-login-saas:hover { background: #0077b5; transform: translateY(-2px); box-shadow: 0 5px 15px rgba(0,136,207,0.3); }
|
||||
|
||||
.forgot-link { font-size: 11px; color: #848d9a; text-decoration: none; }
|
||||
.portal-footer { font-size: 11px; color: #4e555d; }
|
||||
|
||||
/* ANIMATIONS ORIGINALES RESTAURÉES */
|
||||
@keyframes next1 { from { left: 0% } to { left: -100% } }
|
||||
@keyframes next2 { from { left: 100% } to { left: 0% } }
|
||||
@keyframes prev1 { from { left: 0% } to { left: 100% } }
|
||||
@keyframes prev2 { from { left: -100% } to { left: 0% } }
|
||||
|
||||
/* INDICATORS */
|
||||
.dotsContainer { position: absolute; bottom: 30px; left: 50%; transform: translateX(-50%); display: flex; gap: 10px; z-index: 15; }
|
||||
/* NAVIGATION SLIDE */
|
||||
span.next, span.prev { position: absolute; top: 50%; padding: 10px; background: rgba(0,136,207,0.5); color: #fff; cursor: pointer; z-index: 10; border-radius: 5px; }
|
||||
.next { right: 15px; } .prev { left: 15px; }
|
||||
.dotsContainer { position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); display: flex; gap: 8px; }
|
||||
.dot { width: 10px; height: 10px; border-radius: 50%; background: rgba(255,255,255,0.2); cursor: pointer; }
|
||||
.dot.active { background: #fff; }
|
||||
.dot.active { background: #0088cf; }
|
||||
|
|
@ -1,44 +1,45 @@
|
|||
<?php
|
||||
$maintenance = $societeusersaas['maintenance'];
|
||||
$codeUtilisateur = (isset($_COOKIE['codeUtilisateur'])) ? $_COOKIE['codeUtilisateur'] : "";
|
||||
$codeSociete = (isset($_COOKIE['codeSociete'])) ? $_COOKIE['codeSociete'] : "";
|
||||
if($maintenance == '1') { $msgErreur = 'Site en maintenance, veuillez vous reconnecter plus tard!'; }
|
||||
?>
|
||||
|
||||
<h2 class="portal-title text-center mb-4">Portail Gestionnaire</h2>
|
||||
|
||||
<?php if (isset($msgErreur) && $msgErreur > ""): ?>
|
||||
<?php if (isset($msgErreur) && $msgErreur > " "): ?>
|
||||
<div class="alert alert-danger border-0 small text-center mb-3"><?= $msgErreur ?></div>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if($maintenance != '1'): ?>
|
||||
<div class="mb-3">
|
||||
<label class="lbl-erp">Langue</label>
|
||||
<label class="lbl-saas">Langue</label>
|
||||
<select class="form-select select-dark" id="langue" name="langue" onchange="changer_langue_connexion();">
|
||||
<?php liste_options($langues, $_SESSION['lang'], true); ?>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label class="lbl-erp">Entité</label>
|
||||
<label class="lbl-saas">Entité</label>
|
||||
<input class="form-control input-dark" type="text" name="codeSociete" id="codeSociete" value="<?= $codeSociete ?>" required onchange="changer_entite_portail();">
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label class="lbl-erp">Identifiant</label>
|
||||
<label class="lbl-saas">Identifiant</label>
|
||||
<input class="form-control input-dark" type="text" name="login" id="login" value="<?= $codeUtilisateur ?>" required>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<div class="d-flex justify-content-between">
|
||||
<label class="lbl-erp">Mot de passe</label>
|
||||
<a href="MotDePasseOublie" class="forgot-link">Oublié ?</a>
|
||||
<div class="d-flex justify-content-between align-items-center">
|
||||
<label class="lbl-saas">Mot de passe</label>
|
||||
<a href="javascript:motdepasse_oublie();" class="forgot-link">Mot de passe oublié ?</a>
|
||||
</div>
|
||||
<input class="form-control input-dark" type="password" name="mdp" id="mdp" required>
|
||||
</div>
|
||||
|
||||
<button name="btn_connexion" id="btn_connexion" class="btn btn-login w-100 fw-bold py-3">Connexion</button>
|
||||
<?php endif; ?>
|
||||
<button name="btn_connexion" id="btn_connexion" class="btn btn-login-saas w-100 fw-bold py-3 text-uppercase">
|
||||
Connexion
|
||||
</button>
|
||||
|
||||
<footer class="portal-footer text-center mt-5">
|
||||
<p>© <?= date('Y') ?> <strong>INTER SANTE</strong>. Tous droits réservés.</p>
|
||||
</footer>
|
||||
<footer class="portal-footer text-center mt-5">
|
||||
<p>Tous droits réservés © <strong>EBENE SOLUTIONS INFORMATIQUES</strong></p>
|
||||
</footer>
|
||||
<?php endif; ?>
|
||||
|
|
@ -1,18 +1,13 @@
|
|||
<div id="div_detail_connexion">
|
||||
<?php
|
||||
// RÉCUPÉRATION DES COOKIES (IDENTIFIANTS MÉMORISÉS)
|
||||
$codeUtilisateur = isset($_COOKIE['codeUtilisateur']) ? $_COOKIE['codeUtilisateur'] : "";
|
||||
$codeSociete = isset($_COOKIE['codeSociete']) ? $_COOKIE['codeSociete'] : "";
|
||||
$codeUtilisateur = (isset($_COOKIE['codeUtilisateur']) && isset($_COOKIE['codeSociete'])) ? $_COOKIE['codeUtilisateur'] : "";
|
||||
$codeSociete = (isset($_COOKIE['codeUtilisateur']) && isset($_COOKIE['codeSociete'])) ? $_COOKIE['codeSociete'] : "";
|
||||
$societeExiste = true;
|
||||
?>
|
||||
|
||||
<form class="login-form validate-form" action="Connexion/connecter" method="post">
|
||||
<form class="auth-form" action="Connexion/connecter" method="post">
|
||||
<?php
|
||||
if($_SESSION['lang'] == "en_US") {
|
||||
require('english.php');
|
||||
} else {
|
||||
require('french.php');
|
||||
}
|
||||
if($_SESSION['lang'] == "en_US") { require('english.php'); }
|
||||
else { require('french.php'); }
|
||||
?>
|
||||
</form>
|
||||
</div>
|
||||
|
|
@ -5,14 +5,15 @@
|
|||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<base href="<?= $racineWeb ?>">
|
||||
<title>INTER SANTE - Portail</title>
|
||||
<title><?= $titre ?></title>
|
||||
|
||||
<link rel="icon" href="Bootstrap_new/images/favicon.ico"/>
|
||||
<link href="Bootstrap_new/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
|
||||
<link href="Bootstrap_new/css/style-portail.css?ver=<?= APP_VERSION ?>" rel="stylesheet">
|
||||
</head>
|
||||
<body>
|
||||
<div class="portal-container">
|
||||
<div class="container-fluid portal-wrapper p-0">
|
||||
<div class="slide-container">
|
||||
<div class="slides">
|
||||
<img src="assets/img/slides/image01.jpg" class="active" attr="0">
|
||||
|
|
@ -26,18 +27,21 @@
|
|||
<img src="assets/img/slides/image09.jpeg" attr="8">
|
||||
</div>
|
||||
<div class="buttons">
|
||||
<span class="next"></span>
|
||||
<span class="prev"></span>
|
||||
<span class="next">❯</span>
|
||||
<span class="prev">❮</span>
|
||||
</div>
|
||||
<div class="dotsContainer">
|
||||
<?php for($i=0; $i<9; $i++): ?>
|
||||
<div class="dot <?= ($i==0)?'active':'' ?>" attr='<?= $i ?>'></div>
|
||||
<div class="dot <?= ($i==0)?'active':'' ?>" attr='<?= $i ?>' onclick="switchImage(this)"></div>
|
||||
<?php endfor; ?>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="login-wrapper">
|
||||
<div class="login-box shadow-lg">
|
||||
<div class="content-side">
|
||||
<div class="login-box animate-in">
|
||||
<div class="logo-area mb-4">
|
||||
<img src="assets/img/logo_portail_gestionnaire.png" alt="logo intersante">
|
||||
</div>
|
||||
<div id="div_contenu_portail">
|
||||
<?= $contenu ?>
|
||||
</div>
|
||||
|
|
@ -46,8 +50,7 @@
|
|||
</div>
|
||||
|
||||
<script src="Bootstrap_new/js/jquery.min.js"></script>
|
||||
<script src="Bootstrap_new/js/bootstrap.bundle.min.js"></script>
|
||||
<script>
|
||||
<script type="text/javascript">
|
||||
let slideImages = document.querySelectorAll('.slides img');
|
||||
let next = document.querySelector('.next');
|
||||
let prev = document.querySelector('.prev');
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user