This commit is contained in:
KONE SOREL 2025-12-22 19:53:41 +00:00
parent 4a37458666
commit 382933529f

View File

@ -242,19 +242,27 @@ body {
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
border: 1px solid var(--office-border);
position: fixed; /* Fixe dans la fenêtre */
top: [hauteur-du-header]; /* À ajuster selon la hauteur de votre header */
left: 0;
right: 0;
top: var(--header-height); /* Positionné juste en dessous du header */
left: var(--sidebar-width); /* Aligné avec le début du contenu principal */
right: 0; /* Prend toute la largeur restante */
z-index: 1000;
max-width: 1400px;
max-width: calc(1400px + 24px * 2); /* Ajusté pour correspondre au contenu */
margin: 0 auto;
padding: 0 24px; /* Padding pour l'alignement */
overflow-x: auto; /* Permettre le défilement horizontal si nécessaire */
height: 56px; /* Hauteur fixe pour la barre */
display: flex;
align-items: center;
transition: left var(--transition-speed) ease; /* Animation avec la sidebar */
}
.nav-tabs {
display: flex;
gap: 8px;
overflow-x: auto;
padding-bottom: 4px;
padding: 8px 0; /* Ajouté pour l'espace vertical */
height: 100%; /* Prend toute la hauteur du nav-bar */
align-items: center; /* Centrer verticalement */
}
.nav-tab {
@ -289,18 +297,25 @@ body {
}
/* ============================================
CONTENT CARDS
CONTENT CARDS - AJUSTÉ POUR LA NAV-BAR FIXE
============================================ */
.content-card {
background-color: white;
border-radius: 8px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
border: 1px solid var(--office-border);
margin-top: 60px; /* Ajustez selon la hauteur de .nav-bar */
margin-top: 80px; /* Espace pour la nav-bar fixe (header-height + nav-bar height) */
margin-bottom: 24px;
overflow: hidden;
}
/* Ajustement pour responsive */
@media (max-width: 1200px) {
.content-card {
margin-top: calc(var(--header-height) + 56px);
}
}
.card-header {
background-color: #fafafa;
border-bottom: 1px solid var(--office-border);
@ -686,8 +701,14 @@ body {
width: 100%;
right: -100%;
}
/* Pour la version collapsed de la sidebar */
.nav-bar {
left: var(--sidebar-collapsed);
}
}
/* Pour mobile */
@media (max-width: 768px) {
.app-sidebar {
transform: translateX(-100%);
@ -720,6 +741,12 @@ body {
.nav-arrow {
display: block;
}
.nav-bar {
left: 0;
padding: 0 16px;
max-width: 100%;
}
}
/* ============================================