diff --git a/Bootstrap_new/css/style_office.css b/Bootstrap_new/css/style_office.css
index 7c1c6bf..ae1628e 100644
--- a/Bootstrap_new/css/style_office.css
+++ b/Bootstrap_new/css/style_office.css
@@ -245,52 +245,50 @@ content-area {
NAVIGATION TABS
============================================ */
.nav-bar {
- background-color: #ffffff;
+ background-color: white;
border-radius: 8px;
- box-shadow: 0 2px 8px rgba(183, 71, 42, 0.08);
- border: 1px solid rgba(183, 71, 42, 0.15);
+ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+ border: 1px solid var(--office-border);
position: fixed;
- top: var(--header-height);
- left: 0;
+ top: var(--header-height); /* Directement sous le header */
+ left: var(--sidebar-width); /* Commence après la sidebar */
right: 0;
z-index: 1000;
- width: calc(100% - var(--sidebar-width)); /* Largeur totale moins sidebar */
- max-width: 1400px; /* Largeur max identique à content-area */
- margin: 0 auto 0 calc(var(--sidebar-width) + 24px); /* Marge gauche = sidebar + padding */
- padding: 0;
- overflow-x: auto;
height: 56px;
display: flex;
align-items: center;
- transition: all var(--transition-speed) ease;
- background: linear-gradient(135deg, #ffffff 0%, #fef8f7 100%);
+ padding: 0;
+ margin: 0;
+ transition: left var(--transition-speed) ease;
}
-/* Conteneur interne pour le padding */
-.nav-tabs {
+/* Conteneur pour centrer le contenu */
+.nav-bar > .nav-tabs {
+ width: 100%;
+ max-width: 1400px; /* Même largeur max que le contenu */
+ margin: 0 auto;
+ padding: 0 24px;
+ height: 100%;
display: flex;
+ align-items: center;
gap: 4px;
overflow-x: auto;
- padding: 0 24px; /* Padding ici au lieu de sur nav-bar */
- height: 100%;
- align-items: center;
- flex-wrap: nowrap;
- width: 100%;
}
.nav-tab {
display: inline-flex;
align-items: center;
- padding: 8px 16px;
+ padding: 10px 18px;
background-color: transparent;
color: var(--office-dark);
text-decoration: none;
- border-radius: 4px;
+ border-radius: 6px;
font-size: 14px;
font-weight: 500;
white-space: nowrap;
transition: all 0.2s ease;
border: 1px solid transparent;
+ height: 40px;
}
.nav-tab:hover {
@@ -310,47 +308,41 @@ content-area {
}
/* ============================================
- CONTENT AREA - AJUSTÉ POUR LA NAV-BAR FIXE
+ CONTENT AREA - SIMPLIFIÉ
============================================ */
.content-area {
- padding: calc(var(--header-height) + 56px + 20px) 24px 24px 24px;
+ padding-top: calc(var(--header-height) + 56px + 16px); /* Header + nav-bar + espace */
+ padding-left: 24px;
+ padding-right: 24px;
+ padding-bottom: 24px;
max-width: 1400px;
margin: 0 auto;
- position: relative;
width: 100%;
}
/* ============================================
- CONTENT CARDS - LARGEUR IDENTIQUE À NAV-BAR
+ CONTENT CARD - SIMPLE ET PROPRE
============================================ */
.content-card {
background-color: white;
- border-radius: 12px;
- box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
- border: 1px solid rgba(183, 71, 42, 0.12);
+ border-radius: 8px;
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
+ border: 1px solid var(--office-border);
margin-bottom: 24px;
overflow: hidden;
- width: calc(100% - var(--sidebar-width) - 48px); /* Largeur identique à nav-bar */
- max-width: 1400px;
- margin-left: calc(var(--sidebar-width) + 24px); /* Alignement avec nav-bar */
- margin-right: 24px;
+ width: 100%;
}
+
/* Ajustement pour responsive */
@media (max-width: 1200px) {
.nav-bar {
- width: calc(100% - var(--sidebar-collapsed));
- margin-left: calc(var(--sidebar-collapsed) + 24px);
- max-width: calc(1400px - var(--sidebar-collapsed));
- }
-
- .content-card {
- width: calc(100% - var(--sidebar-collapsed) - 48px);
- margin-left: calc(var(--sidebar-collapsed) + 24px);
+ left: var(--sidebar-collapsed);
}
.content-area {
- padding-left: calc(var(--sidebar-collapsed) + 24px);
+ padding-left: 24px;
+ padding-right: 24px;
}
}
@@ -367,9 +359,8 @@ content-area {
}
.card-body {
- padding: 28px;
- background-color: #fefcfb;
- min-height: 400px;
+ padding: 24px;
+ background-color: #fafafa; /* Couleur légère harmonieuse */
}
/* Bordure subtile en haut pour lier visuellement avec nav-bar */
@@ -791,16 +782,11 @@ content-area {
.nav-bar {
left: 0;
- width: 100%;
- margin: 0;
- padding: 0;
border-radius: 0;
top: var(--header-height);
- box-shadow: 0 2px 12px rgba(183, 71, 42, 0.1);
- max-width: 100%;
}
- .nav-tabs {
+ .nav-bar > .nav-tabs {
padding: 0 16px;
}
@@ -809,9 +795,8 @@ content-area {
}
.content-card {
- width: 100%;
- margin: 0 0 16px 0;
border-radius: 8px;
+ margin: 0 0 16px 0;
}
.card-body {
@@ -819,16 +804,16 @@ content-area {
}
}
-/* Pour les très grands écrans (au-delà de 1400px) */
+/* Correction pour les écrans larges */
@media (min-width: 1400px) {
- .nav-bar {
- margin-left: calc((100vw - 1400px) / 2 + var(--sidebar-width) + 24px);
- width: calc(1400px - var(--sidebar-width) - 48px);
+ .nav-bar > .nav-tabs {
+ padding-left: calc((100vw - 1400px) / 2);
+ padding-right: calc((100vw - 1400px) / 2);
}
- .content-card {
- margin-left: calc((100vw - 1400px) / 2 + var(--sidebar-width) + 24px);
- width: calc(1400px - var(--sidebar-width) - 48px);
+ .content-area {
+ padding-left: calc((100vw - 1400px) / 2);
+ padding-right: calc((100vw - 1400px) / 2);
}
}
@@ -865,15 +850,15 @@ content-area {
}
.nav-tabs::-webkit-scrollbar-track {
- background: rgba(183, 71, 42, 0.05);
+ background: rgba(0, 0, 0, 0.05);
border-radius: 2px;
}
.nav-tabs::-webkit-scrollbar-thumb {
- background: rgba(183, 71, 42, 0.2);
+ background: rgba(0, 0, 0, 0.2);
border-radius: 2px;
}
.nav-tabs::-webkit-scrollbar-thumb:hover {
- background: rgba(183, 71, 42, 0.3);
+ background: rgba(0, 0, 0, 0.3);
}
\ No newline at end of file
diff --git a/Vue/gabarit.php b/Vue/gabarit.php
index 2228633..d0a4ef8 100755
--- a/Vue/gabarit.php
+++ b/Vue/gabarit.php
@@ -145,7 +145,7 @@ console.groupEnd();
-
+