hfer
This commit is contained in:
parent
45699dd039
commit
1c22e0f758
|
|
@ -1006,4 +1006,143 @@ body {
|
|||
.icon-wrapper i {
|
||||
font-size: 1rem;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
HEADER BREADCRUMB
|
||||
========================================================================== */
|
||||
|
||||
.header-breadcrumb {
|
||||
max-width: 500px;
|
||||
}
|
||||
|
||||
.header-breadcrumb .breadcrumb {
|
||||
background: transparent;
|
||||
margin-bottom: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.header-breadcrumb .breadcrumb-item + .breadcrumb-item::before {
|
||||
display: none !important;
|
||||
content: none !important;
|
||||
}
|
||||
|
||||
.header-breadcrumb .breadcrumb-item a {
|
||||
color: #6c757d;
|
||||
transition: var(--transition);
|
||||
padding: 0.25rem 0.5rem;
|
||||
border-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
.header-breadcrumb .breadcrumb-item a:hover {
|
||||
color: var(--primary-color);
|
||||
background-color: rgba(0, 136, 207, 0.1);
|
||||
}
|
||||
|
||||
.header-breadcrumb .breadcrumb-item.active {
|
||||
color: var(--primary-color);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
SECONDARY NAV FIXED
|
||||
========================================================================== */
|
||||
|
||||
.secondary-nav-fixed-container {
|
||||
position: fixed;
|
||||
top: 60px;
|
||||
left: 260px;
|
||||
right: 0;
|
||||
z-index: 1010;
|
||||
background: white;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
transition: var(--transition);
|
||||
}
|
||||
|
||||
.secondary-nav-fixed {
|
||||
background: white;
|
||||
padding: 0 1.5rem;
|
||||
}
|
||||
|
||||
.secondary-nav-item {
|
||||
min-width: 140px;
|
||||
white-space: nowrap;
|
||||
border-right: 1px solid var(--border-color);
|
||||
padding: 1rem 1.5rem;
|
||||
text-decoration: none;
|
||||
color: var(--dark-color);
|
||||
text-align: center;
|
||||
transition: all 0.3s ease;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.secondary-nav-item:hover {
|
||||
background-color: rgba(0, 136, 207, 0.05);
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
.secondary-nav-item.active {
|
||||
background: linear-gradient(135deg, var(--primary-color), var(--primary-dark));
|
||||
color: white !important;
|
||||
font-weight: 600;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.secondary-nav-item.active::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: -1px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 3px;
|
||||
background: white;
|
||||
}
|
||||
|
||||
.secondary-nav-item:last-child {
|
||||
border-right: none;
|
||||
}
|
||||
|
||||
/* Responsive adjustments */
|
||||
@media (max-width: 1199px) {
|
||||
.secondary-nav-fixed-container {
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.toggle-sidebar .secondary-nav-fixed-container {
|
||||
left: 260px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.header-breadcrumb {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.secondary-nav-item {
|
||||
min-width: 120px;
|
||||
padding: 0.75rem 1rem;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
|
||||
.secondary-nav-fixed {
|
||||
padding: 0 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 576px) {
|
||||
.secondary-nav-item {
|
||||
min-width: 100px;
|
||||
padding: 0.5rem 0.75rem;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.secondary-nav-item i {
|
||||
margin-right: 0.25rem !important;
|
||||
}
|
||||
|
||||
.secondary-nav-item span:not(.badge) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
|
@ -7,7 +7,7 @@
|
|||
<div class="context-header bg-primary text-white py-3 px-4 d-flex justify-content-between align-items-center">
|
||||
<div class="d-flex align-items-center">
|
||||
<i class="fas fa-cog fa-spin me-2"></i>
|
||||
<h6 class="mb-0 fw-bold"><?= _("Contexte d'utilisation") ?></h6>
|
||||
<h6 class="mb-0 fw-bold"><?= _("Panneau contexte") ?></h6>
|
||||
</div>
|
||||
<button class="btn btn-sm btn-light" id="hideSideNav" title="<?= _("Cacher le contexte") ?>">
|
||||
<i class="fas fa-times"></i>
|
||||
|
|
|
|||
|
|
@ -26,9 +26,9 @@ $imgData = $_SESSION['photoAssureCrypte'];
|
|||
|
||||
// Get breadcrumb info
|
||||
$infovue = $gabary->getInfosVue($_SESSION['vue']);
|
||||
$descriptionVue = est_anglophone() ? $infovue['DescriptionEng'] : $infovue['Description'];
|
||||
$titreRetour = est_anglophone() ? $infovue['titreRetourEng'] : $infovue['titreRetour'];
|
||||
$retourVue = $infovue['lienRetour'];
|
||||
$_SESSION['descriptionVue'] = est_anglophone() ? $infovue['DescriptionEng'] : $infovue['Description'];
|
||||
$_SESSION['titreRetour'] = est_anglophone() ? $infovue['titreRetourEng'] : $infovue['titreRetour'];
|
||||
$_SESSION['retourVue'] = $infovue['lienRetour'];
|
||||
?>
|
||||
|
||||
<!DOCTYPE html>
|
||||
|
|
@ -57,52 +57,34 @@ $retourVue = $infovue['lienRetour'];
|
|||
<input type="hidden" id="nomSociete" value="<?= htmlspecialchars($_SESSION['nomSociete']) ?>">
|
||||
<input type="hidden" id="modeDev" value="<?= $modeDev ?>">
|
||||
|
||||
<div class="container-fluid p-3 animate__animated animate__fadeIn">
|
||||
|
||||
<!-- Breadcrumb -->
|
||||
<nav aria-label="breadcrumb" class="mb-4 px-2">
|
||||
<ol class="breadcrumb bg-white shadow-sm rounded-pill py-2 px-4 border-0">
|
||||
<li class="breadcrumb-item">
|
||||
<a href="<?= $retourVue; ?>"
|
||||
class="text-decoration-none text-muted small d-flex align-items-center text-uppercase">
|
||||
<?= $titreRetour ?>
|
||||
</a>
|
||||
</li>
|
||||
<li class="breadcrumb-item active text-primary fw-bold small text-uppercase"
|
||||
aria-current="page">
|
||||
<i class="fas fa-angle-right me-2 text-muted"></i>
|
||||
<?= $descriptionVue ?>
|
||||
</li>
|
||||
</ol>
|
||||
</nav>
|
||||
|
||||
<!-- Secondary Navigation -->
|
||||
<?php if (isset($menusvue) && sizeof($menusvue) > 0): ?>
|
||||
<div class="tabs-container mb-4 px-2">
|
||||
<div class="card border-0 shadow-sm rounded-3 overflow-hidden">
|
||||
<div class="d-flex overflow-auto secondary-nav-container">
|
||||
<?php foreach ($menusvue as $menu):
|
||||
$isActive = (basename($_SERVER['REQUEST_URI']) == basename($menu['lienMenu']));
|
||||
$activeClass = $isActive ? 'active' : '';
|
||||
?>
|
||||
<a class="nav-link-sub p-3 <?= $activeClass ?>"
|
||||
href="<?= $menu['lienMenu']; ?>">
|
||||
<?php if (!empty($menu['icone'])): ?>
|
||||
<i class="<?= $menu['icone'] ?> me-2"></i>
|
||||
<?php endif; ?>
|
||||
<?= $menu['libeleMenu'] ?>
|
||||
<?php if ($isActive): ?>
|
||||
<span class="badge bg-white text-primary ms-2 rounded-pill">
|
||||
<i class="fas fa-check"></i>
|
||||
</span>
|
||||
<?php endif; ?>
|
||||
</a>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<!-- Secondary Navigation Fixe -->
|
||||
<?php if (isset($menusvue) && sizeof($menusvue) > 0): ?>
|
||||
<div class="secondary-nav-fixed-container">
|
||||
<div class="secondary-nav-fixed shadow-sm">
|
||||
<div class="d-flex overflow-auto">
|
||||
<?php foreach ($menusvue as $menu):
|
||||
$isActive = (basename($_SERVER['REQUEST_URI']) == basename($menu['lienMenu']));
|
||||
$activeClass = $isActive ? 'active' : '';
|
||||
?>
|
||||
<a class="secondary-nav-item p-3 <?= $activeClass ?>"
|
||||
href="<?= $menu['lienMenu']; ?>">
|
||||
<?php if (!empty($menu['icone'])): ?>
|
||||
<i class="<?= $menu['icone'] ?> me-2"></i>
|
||||
<?php endif; ?>
|
||||
<?= $menu['libeleMenu'] ?>
|
||||
<?php if ($isActive): ?>
|
||||
<span class="badge bg-white text-primary ms-2 rounded-pill">
|
||||
<i class="fas fa-check"></i>
|
||||
</span>
|
||||
<?php endif; ?>
|
||||
</a>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<div class="container-fluid p-3 animate__animated animate__fadeIn" style="margin-top: <?= isset($menusvue) && sizeof($menusvue) > 0 ? '70px' : '0' ?>;">
|
||||
<!-- Main Content Area -->
|
||||
<section class="section main-dashboard px-2">
|
||||
<div id="contenu" class="animate__animated animate__fadeIn">
|
||||
|
|
|
|||
|
|
@ -28,6 +28,25 @@
|
|||
|
||||
<i class="fas fa-bars toggle-sidebar-btn" onclick="toggleSidebar()" style="cursor: pointer;"></i>
|
||||
</div>
|
||||
|
||||
<!-- Breadcrumb intégré dans le header -->
|
||||
<div class="header-breadcrumb mx-4 flex-grow-1 d-none d-lg-block">
|
||||
<nav aria-label="breadcrumb" class="mb-0">
|
||||
<ol class="breadcrumb mb-0 bg-transparent p-0">
|
||||
<li class="breadcrumb-item">
|
||||
<a href="<?= $_SESSION['retourVue'] ?? '#' ?>"
|
||||
class="text-decoration-none text-muted small d-flex align-items-center text-uppercase">
|
||||
<?= $_SESSION['titreRetour'] ?? '' ?>
|
||||
</a>
|
||||
</li>
|
||||
<li class="breadcrumb-item active text-primary fw-bold small text-uppercase"
|
||||
aria-current="page">
|
||||
<i class="fas fa-chevron-right mx-2 text-muted"></i>
|
||||
<?= $_SESSION['descriptionVue'] ?? '' ?>
|
||||
</li>
|
||||
</ol>
|
||||
</nav>
|
||||
</div>
|
||||
|
||||
<!-- Navigation droite -->
|
||||
<nav class="header-nav ms-auto">
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user