From fcc5b01d1665472b5756cc698213cd308e23f723 Mon Sep 17 00:00:00 2001 From: KONE SOREL Date: Mon, 23 Feb 2026 12:34:55 +0000 Subject: [PATCH] FF --- Bootstrap_new/css/theme-modern.css | 105 +++++++++++++++-------------- Vue/includes/barre-contexte.php | 63 ++++++++--------- Vue/includes/head-meta.php | 18 +++-- Vue/includes/header.php | 40 ++++++++--- 4 files changed, 122 insertions(+), 104 deletions(-) diff --git a/Bootstrap_new/css/theme-modern.css b/Bootstrap_new/css/theme-modern.css index ced779eb..8353dfba 100644 --- a/Bootstrap_new/css/theme-modern.css +++ b/Bootstrap_new/css/theme-modern.css @@ -1,66 +1,67 @@ +/* --- BASE --- */ :root { - --primary: #1e293b; + --primary: #2C3E50; --accent: #08C5D1; - --bg-body: #edf2f7; /* Gris bleuté pour le fond */ - --shadow-wahoo: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); + --bg-body: #F4F7FB; } -body { - background-color: var(--bg-body) !important; - font-family: 'Plus Jakarta Sans', sans-serif !important; +body { background: var(--bg-body); color: #444; } + +/* --- HEADER FLOATING --- */ +#header { + background: rgba(255, 255, 255, 0.9); + backdrop-filter: blur(10px); + margin: 10px 15px; + width: calc(100% - 30px); + border-radius: 12px; + box-shadow: 0 4px 20px rgba(0,0,0,0.04); } -/* LE SECRET : On ne touche pas au bord de l'écran */ +/* --- LE "WAHOO" : MAIN CARD --- */ #main { - margin: 85px 25px 25px 285px !important; /* Sidebar large + marge */ - background: #ffffff !important; - border-radius: 30px !important; /* Arrondi très fort */ - box-shadow: var(--shadow-wahoo) !important; - border: none !important; - min-height: calc(100vh - 110px); - padding: 40px !important; + margin: 95px 20px 20px 320px; /* Espace pour la sidebar */ + background: white; + border-radius: 20px; + min-height: 80vh; + padding: 30px; + border: 1px solid #edf2f7; + /* On évite les ombres lourdes, on mise sur la netteté */ } -/* SIDEBAR : Elle doit être détachée ou très sombre */ -.sidebar { - background: var(--primary) !important; - width: 260px !important; - border: none !important; +/* --- SIDEBAR : UNITÉ VISUELLE --- */ +#sidebar { + background: var(--primary); + border-right: none; + margin: 10px 0 10px 15px; + height: calc(100vh - 20px); + border-radius: 15px; } -/* HEADER : On le rend invisible ou très léger */ -.header { - background: rgba(248, 250, 252, 0.8) !important; - backdrop-filter: blur(8px); - border: none !important; - box-shadow: none !important; +/* --- CONTEXTE (Sidenav) --- */ +.sidenav-context { + position: fixed; + right: -340px; + top: 10px; + height: calc(100vh - 20px); + width: 320px; + background: white; + border-radius: 20px 0 0 20px; + box-shadow: -10px 0 40px rgba(0,0,0,0.05); + z-index: 1060; + transition: 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275); + padding: 25px; } +.sidenav-context.active { right: 0; } -/* --- LES TABLEAUX "WAHOO" (Effet Liste de Cartes) --- */ -.table { - border-collapse: separate !important; - border-spacing: 0 12px !important; /* Espace entre les lignes */ - background: transparent !important; -} +/* --- WIDGETS DE DONNÉES --- */ +.context-label { font-size: 0.65rem; font-weight: 800; text-transform: uppercase; color: #94a3b8; letter-spacing: 1px; } +.context-value-box { padding: 12px; background: #f8fafc; border-radius: 10px; border: 1px solid #eef2f7; display: flex; align-items: center; } +.assured-card { cursor: pointer; transition: 0.3s; padding: 10px; border-radius: 12px; } +.assured-card:hover { background: #f0f9fa; transform: translateY(-2px); } -.table tbody tr { - background: white !important; - border-radius: 15px !important; - box-shadow: 0 2px 10px rgba(0,0,0,0.03) !important; - transition: all 0.3s ease !important; -} - -.table tbody tr:hover { - transform: translateY(-4px) scale(1.01); - box-shadow: 0 15px 30px rgba(8, 197, 209, 0.15) !important; -} - -.table td { - padding: 20px !important; - border: none !important; - vertical-align: middle; -} - -/* Arrondis pour chaque ligne */ -.table td:first-child { border-radius: 15px 0 0 15px !important; } -.table td:last-child { border-radius: 0 15px 15px 0 !important; } \ No newline at end of file +/* Avatar initials */ +.initials-circle { + width: 40px; height: 40px; background: var(--accent); color: white; + display: flex; align-items: center; justify-content: center; + border-radius: 50%; font-weight: bold; +} \ No newline at end of file diff --git a/Vue/includes/barre-contexte.php b/Vue/includes/barre-contexte.php index d894f7b0..f5b67049 100644 --- a/Vue/includes/barre-contexte.php +++ b/Vue/includes/barre-contexte.php @@ -1,40 +1,41 @@ -
-
- - -
- -
- -
-
nettoyer($_SESSION['nomGcAssureur_C']) ?>
-
nettoyer($_SESSION['codeGcAssureur_C']) ?>
+
+
+
+
+
-
- -
- -
-
- -
-
-
nettoyer($_SESSION['nomClient_C']) ?>
-
+
+ +
+ + nettoyer($_SESSION['nomGcAssureur_C']) ?>
-
- - -
- -
-
- nettoyer($_SESSION['numeroPolice_C']) ?> + +
+ +
+
+ +
+
+
nettoyer($_SESSION['nomClient_C']) ?>
+
+
+ + + +
+ +
+ + nettoyer($_SESSION['numeroPolice_C']) ?> +
+
+
-
\ No newline at end of file diff --git a/Vue/includes/head-meta.php b/Vue/includes/head-meta.php index 6eec687a..6ffcc39b 100644 --- a/Vue/includes/head-meta.php +++ b/Vue/includes/head-meta.php @@ -3,16 +3,14 @@ <?= $companyDisplayName ?> - + - - - - - - - - + + + + + + - \ No newline at end of file + \ No newline at end of file diff --git a/Vue/includes/header.php b/Vue/includes/header.php index 0ae169f4..e1fd4fa3 100644 --- a/Vue/includes/header.php +++ b/Vue/includes/header.php @@ -1,17 +1,35 @@ \ No newline at end of file