diff --git a/Bootstrap_new/css/style_moderne.css b/Bootstrap_new/css/style_moderne.css index 13950466..787ea3fb 100644 --- a/Bootstrap_new/css/style_moderne.css +++ b/Bootstrap_new/css/style_moderne.css @@ -1,29 +1,230 @@ -:root { - --is-primary: #08C5D1; - --is-sidebar: #2c3e50; - --is-light-bg: #f8f9fa; -} -body { font-family: 'Inter', sans-serif; font-size: 0.88rem; color: #334155; } - -/* Sidebar moderne */ -.sidebar { width: 260px; background: var(--is-sidebar); transition: all 0.3s; z-index: 1000; border-right: 1px solid rgba(255,255,255,0.1); } -.sidebar .nav-link { color: rgba(255,255,255,0.7); font-weight: 500; border-radius: 8px; margin-bottom: 5px; } -.sidebar .nav-link:hover, .sidebar .nav-link.active-main { background: rgba(255,255,255,0.1); color: #fff; } -.sidebar .nav-link i { font-size: 1.1rem; margin-right: 12px; } - -/* Header épuré */ -.header { height: 60px; background: #fff; box-shadow: 0 1px 10px rgba(0,0,0,0.05); } - -/* Utilitaires de cartes */ -.card { border: none; border-radius: 12px; box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.04); } - -/* Transition douce pour AJAX */ -.transition { transition: all 0.3s ease; } - -@media (min-width: 1200px) { - body.toggle-sidebar .sidebar { left: -260px; } - body.toggle-sidebar .main, body.toggle-sidebar #header { margin-left: 0; } +:root { + --primary-color: #0088cf; + --bg-workspace: #f6f9ff; + --sidebar-width: 280px; + --card-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); + --sidebar-bg: #2c3e50; /* Couleur sombre pro pour trancher avec le contenu */ + --header-height: 60px; } -.cursor-pointer { cursor: pointer; } -.shadow-xs { box-shadow: 0 2px 4px rgba(0,0,0,0.02); } \ No newline at end of file +body { + background-color: var(--bg-workspace) !important; + font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; +} + +/* Modernisation des inputs */ +.form-control, .form-select { + border-radius: 8px; + border: 1px solid #dee2e6; + padding: 0.6rem 0.75rem; + transition: all 0.2s; +} + +.form-control:focus { + border-color: var(--primary-color); + box-shadow: 0 0 0 0.25rem rgba(0, 136, 207, 0.1); +} + +/* Suppression du look "Tableau de bord 2010" pour les fieldsets */ +fieldset { + background: #fff; + border-radius: 12px; + padding: 1.5rem; + box-shadow: var(--card-shadow); + border: none; + margin-bottom: 1.5rem; +} + +legend { + float: none; + width: auto; + font-size: 1.1rem; + font-weight: 700; + color: var(--primary-color); + padding: 0 10px; +} + +/* Style des cartes pour remplacer les fieldsets */ +.card-modern { + background: #ffffff; + border: none; + border-radius: 10px; + box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); + margin-bottom: 1.5rem; +} + +/* On épure le scrollbar pour le côté moderne */ +::-webkit-scrollbar { + width: 6px; +} +::-webkit-scrollbar-thumb { + background: #ccc; + border-radius: 10px; +} + +.sidebar { + background-color: #2c3e50 !important; /* Couleur pro */ + padding-top: 20px; +} +.sidebar-nav .nav-link { + background: transparent; + color: #ecf0f1; + font-weight: 500; + transition: 0.3s; +} +.sidebar-nav .nav-link:hover, .sidebar-nav .nav-link.active-main { + background: rgba(255, 255, 255, 0.1); + color: var(--primary-color); + border-left: 4px solid var(--primary-color); +} +.sidebar-nav .nav-content a { + padding-left: 45px; + font-size: 0.9rem; + color: #bdc3c7; +} + +.nav-scroller { + scrollbar-width: none; /* Cache la barre de scroll sur Firefox */ +} +.nav-scroller::-webkit-scrollbar { + display: none; /* Cache la barre de scroll sur Chrome/Safari */ +} + +/* Espacement du Main */ +#main { + margin-top: 60px; /* Hauteur du header */ + padding: 20px 0; + min-height: calc(100vh - 60px); + background-color: #f6f9ff; + transition: all 0.3s; +} + +/* Style du fil d'ariane */ +.breadcrumb-item + .breadcrumb-item::before { + content: "\f105" !important; /* Symbole FontAwesome > */ + font-family: "Font Awesome 5 Free"; + font-weight: 900; + padding-right: 12px; + color: #adb5bd; +} + +/* Onglets fluides */ +.nav-scroller { + white-space: nowrap; + -webkit-overflow-scrolling: touch; +} + +.sub-nav-link { + text-decoration: none; + color: #6c757d; + font-size: 0.85rem; + font-weight: 600; + border-bottom: 3px solid transparent; + transition: all 0.2s; +} + +.sub-nav-link:hover { + color: #0088cf; + background: rgba(0, 136, 207, 0.05); +} + +.active-tab { + color: #0088cf !important; + border-bottom: 3px solid #0088cf !important; + background: rgba(0, 136, 207, 0.08); +} + +/* Animation douce lors du changement de page */ +#contenu { + animation: fadeIn 0.4s ease-in-out; +} + +@keyframes fadeIn { + from { opacity: 0; transform: translateY(10px); } + to { opacity: 1; transform: translateY(0); } +} + +/* Bouton flottant Chatbot */ +.chatbot-trigger { + position: fixed; + bottom: 30px; + right: 30px; + width: 60px; + height: 60px; + border-radius: 50%; + background: #0088cf; + color: white; + border: none; + z-index: 1060; + display: flex; + align-items: center; + justify-content: center; + font-size: 24px; +} + +.badge-msg-count { + position: absolute; + top: -5px; + right: -5px; + font-size: 0.7rem; + border: 2px solid white; +} + +/* Sidebar Contextuelle */ +.context-sidebar { + position: fixed; + top: 60px; + right: -350px; + width: 320px; + height: calc(100vh - 60px); + background: #f8faff; + z-index: 1050; + transition: all 0.4s cubic-bezier(0.05, 0.74, 0.2, 0.99); + display: flex; + flex-direction: column; +} + +.context-sidebar.active { + right: 0; +} + +.context-header { + padding: 15px; + background: white; +} + +.section-label { + font-size: 10px; + font-weight: 800; + color: #8e9db5; + text-transform: uppercase; + letter-spacing: 0.5px; + margin-bottom: 5px; + display: block; +} + +.info-card { + transition: transform 0.2s; +} + +.info-card:hover { + transform: translateY(-2px); +} + +.stats-grid { + font-size: 9px; + letter-spacing: -0.2px; +} + +.btn-close-context { + border: none; + background: transparent; + color: #adb5bd; + font-size: 1.5rem; + transition: 0.2s; +} + +.btn-close-context:hover { + color: #0088cf; + transform: translateX(3px); +} diff --git a/Vue/Recherche/index.php b/Vue/Recherche/index.php index 61b363a1..cdd19e39 100755 --- a/Vue/Recherche/index.php +++ b/Vue/Recherche/index.php @@ -1,117 +1,107 @@ -titre = "INTER SANTE - "._("Rechercher assuré") ; -?> +
| = _("Bénéficiaire") ?> | += _("Identité") ?> | += _("Parenté") ?> | += _("Infos") ?> | += _("Souscripteur") ?> | += _("État") ?> | +
|---|---|---|---|---|---|
|
+ #= $beneficiaire['numeroBeneficiaire'] ?> + Fam: = $beneficiaire['numeroAdherent'] ?> + |
+
+ = strtoupper($beneficiaire['nomBeneficiaire']) ?>
+ = $beneficiaire['prenomsBeneficiaire'] ?>
+ |
+ = $beneficiaire['codeLienParente'] ?> | +
+ = $beneficiaire['sexe'] ?> | = dateLang($beneficiaire['dateNaissance']) ?> + = $beneficiaire['telephonePortable'] ?> + |
+ = $beneficiaire['nomClient'] ?> | ++ + = $beneficiaire['codeEtatBeneficiaire'] ?> + | +
| = _("N° Bénéficiaire") ?> | -= _("N° Famille") ?> | -= _("Nom") ?> | -= _("Prénoms") ?> | -= _("Lien") ?> | -= _("Naissance") ?> | -= _("Genre") ?> | -= _("Tél") ?> | -= _("Souscripteur") ?> | -= _("Etat") ?> | -
|---|---|---|---|---|---|---|---|---|---|
| - - | -= $this->nettoyer($beneficiaire['numeroAdherent']) ?> | -= $this->nettoyer($beneficiaire['nomBeneficiaire']) ?> | -= $this->nettoyer($beneficiaire['prenomsBeneficiaire']) ?> | -= $this->nettoyer($beneficiaire['codeLienParente']) ?> | -= dateLang($this->nettoyer($beneficiaire['dateNaissance'])) ?> | -= $this->nettoyer($beneficiaire['sexe']) ?> | -= $this->nettoyer($beneficiaire['telephonePortable']) ?> | -= $this->nettoyer($beneficiaire['nomClient']) ?> | -- nettoyer($beneficiaire['codeEtatBeneficiaire']); - $badgeClass = ($etat == 'ACTIF') ? 'bg-success' : 'bg-secondary'; - ?> - - = $etat ?> - - | -