272 lines
8.3 KiB
PHP
272 lines
8.3 KiB
PHP
{{--
|
|
========================================
|
|
LAYOUT UNIVERSALE NETGESCON - VERSIONE PULITA
|
|
========================================
|
|
Layout grid semplificato per NetGesCon con header fisso, sidebar fissa,
|
|
contenuto scrollabile e footer fisso.
|
|
|
|
Autore: NetGesCon Development Team
|
|
Data: 2025
|
|
========================================
|
|
--}}
|
|
|
|
<!DOCTYPE html>
|
|
<html lang="it" data-theme="light">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<meta name="csrf-token" content="{{ csrf_token() }}">
|
|
|
|
<title>{{ $pageTitle ?? 'NetGesCon' }} - Sistema Gestione Condominiale</title>
|
|
|
|
{{-- Favicon e Icons --}}
|
|
<link rel="icon" type="image/x-icon" href="{{ asset('favicon.ico') }}">
|
|
<link rel="apple-touch-icon" sizes="180x180" href="{{ asset('icons/apple-touch-icon.png') }}">
|
|
|
|
{{-- CSS Framework --}}
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
|
|
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet">
|
|
|
|
{{-- Layout CSS Pulito --}}
|
|
<style>
|
|
/* Reset Base */
|
|
* {
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
body {
|
|
margin: 0;
|
|
padding: 0;
|
|
overflow: hidden;
|
|
height: 100vh;
|
|
width: 100vw;
|
|
}
|
|
|
|
/* Layout Grid Container */
|
|
.netgescon-container {
|
|
display: grid;
|
|
grid-template-areas:
|
|
"header header"
|
|
"sidebar content"
|
|
"footer footer";
|
|
grid-template-rows: 70px 1fr 50px;
|
|
grid-template-columns: 280px 1fr;
|
|
height: 100vh;
|
|
width: 100vw;
|
|
overflow: hidden;
|
|
}
|
|
|
|
/* Grid Components */
|
|
.netgescon-header {
|
|
grid-area: header;
|
|
background-color: #ffffff;
|
|
border-bottom: 1px solid #e9ecef;
|
|
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
|
|
z-index: 1050;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.sidebar-container {
|
|
grid-area: sidebar;
|
|
background-color: #f8f9fa;
|
|
border-right: 1px solid #dee2e6;
|
|
overflow-y: auto;
|
|
overflow-x: hidden;
|
|
}
|
|
|
|
.netgescon-content {
|
|
grid-area: content;
|
|
background-color: #f8f9fa;
|
|
overflow-y: auto;
|
|
overflow-x: hidden;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.app-footer {
|
|
grid-area: footer;
|
|
background-color: #ffffff;
|
|
border-top: 1px solid #dee2e6;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
padding: 0 1rem;
|
|
z-index: 1040;
|
|
}
|
|
|
|
/* Content Wrapper */
|
|
.content-wrapper {
|
|
flex: 1;
|
|
padding: 1rem;
|
|
width: 100%;
|
|
}
|
|
|
|
/* Utility Classes */
|
|
.card {
|
|
border: 1px solid #dee2e6;
|
|
border-radius: 0.5rem;
|
|
box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
|
|
margin-bottom: 1rem;
|
|
}
|
|
|
|
/* Responsive */
|
|
@media (max-width: 768px) {
|
|
.netgescon-container {
|
|
grid-template-areas:
|
|
"header"
|
|
"content"
|
|
"footer";
|
|
grid-template-columns: 1fr;
|
|
}
|
|
|
|
.sidebar-container {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
/* Scrollbar personalizzata */
|
|
.sidebar-container::-webkit-scrollbar,
|
|
.netgescon-content::-webkit-scrollbar {
|
|
width: 6px;
|
|
}
|
|
|
|
.sidebar-container::-webkit-scrollbar-track,
|
|
.netgescon-content::-webkit-scrollbar-track {
|
|
background: #f1f1f1;
|
|
}
|
|
|
|
.sidebar-container::-webkit-scrollbar-thumb,
|
|
.netgescon-content::-webkit-scrollbar-thumb {
|
|
background: #c1c1c1;
|
|
border-radius: 3px;
|
|
}
|
|
|
|
.sidebar-container::-webkit-scrollbar-thumb:hover,
|
|
.netgescon-content::-webkit-scrollbar-thumb:hover {
|
|
background: #a8a8a8;
|
|
}
|
|
</style>
|
|
|
|
{{-- CSS Specifico per Pagina --}}
|
|
@stack('styles')
|
|
|
|
{{-- Variabili CSS Dinamiche --}}
|
|
<style>
|
|
:root {
|
|
--netgescon-primary: #007bff;
|
|
--netgescon-secondary: #6c757d;
|
|
--netgescon-sidebar-bg: #f8f9fa;
|
|
--netgescon-content-bg: #ffffff;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body class="netgescon-app {{ $bodyClass ?? '' }}" data-user-role="{{ auth()->user()->role ?? 'guest' }}">
|
|
|
|
{{-- Container principale --}}
|
|
<div class="netgescon-container">
|
|
|
|
{{-- Header Modulare --}}
|
|
@include('components.layout.header.main', [
|
|
'showSearch' => $showSearch ?? true,
|
|
'showNotifications' => $showNotifications ?? true,
|
|
'showUserMenu' => $showUserMenu ?? true
|
|
])
|
|
|
|
{{-- Sidebar Modulare (solo se necessaria) --}}
|
|
@if(($showSidebar ?? true) && auth()->check())
|
|
<div class="sidebar-container">
|
|
@include('components.menu.sidebar', [
|
|
'collapsible' => $sidebarCollapsible ?? true,
|
|
'autoHide' => $sidebarAutoHide ?? false
|
|
])
|
|
</div>
|
|
@endif
|
|
|
|
{{-- Area Content Principale --}}
|
|
<main class="netgescon-content" role="main">
|
|
|
|
{{-- Breadcrumb Modulare --}}
|
|
@if($showBreadcrumb ?? true)
|
|
@include('components.layout.breadcrumb')
|
|
@endif
|
|
|
|
{{-- Alert e Messaggi --}}
|
|
@include('components.layout.alerts')
|
|
|
|
{{-- Contenuto Specifico della Pagina --}}
|
|
<div class="content-wrapper">
|
|
{{ $slot }}
|
|
</div>
|
|
|
|
</main>
|
|
|
|
{{-- Footer Modulare --}}
|
|
@include('components.layout.footer.main', [
|
|
'showVersion' => $showVersion ?? true,
|
|
'showLinks' => $showLinks ?? true,
|
|
'showStats' => $showStats ?? false
|
|
])
|
|
|
|
</div>
|
|
|
|
{{-- JavaScript Framework --}}
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
|
|
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
|
|
|
|
{{-- JavaScript Specifico per Pagina --}}
|
|
@stack('scripts')
|
|
|
|
{{-- Toggle sidebar function --}}
|
|
<script>
|
|
/* Toggle sidebar function */
|
|
function toggleSidebar() {
|
|
const sidebar = document.querySelector('.sidebar-container');
|
|
const content = document.querySelector('.netgescon-content');
|
|
const container = document.querySelector('.netgescon-container');
|
|
|
|
if (sidebar && content && container) {
|
|
if (sidebar.style.display === 'none') {
|
|
sidebar.style.display = 'block';
|
|
container.style.gridTemplateColumns = '280px 1fr';
|
|
} else {
|
|
sidebar.style.display = 'none';
|
|
container.style.gridTemplateColumns = '1fr';
|
|
}
|
|
}
|
|
}
|
|
|
|
/* Dark mode toggle */
|
|
function toggleDarkMode() {
|
|
const body = document.body;
|
|
const themeIcon = document.getElementById('theme-icon');
|
|
|
|
body.classList.toggle('dark');
|
|
|
|
if (body.classList.contains('dark')) {
|
|
themeIcon.className = 'fas fa-sun';
|
|
localStorage.setItem('netgescon-theme', 'dark');
|
|
} else {
|
|
themeIcon.className = 'fas fa-moon';
|
|
localStorage.setItem('netgescon-theme', 'light');
|
|
}
|
|
}
|
|
|
|
// Ripristina tema al caricamento
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
const savedTheme = localStorage.getItem('netgescon-theme');
|
|
const themeIcon = document.getElementById('theme-icon');
|
|
|
|
if (savedTheme === 'dark') {
|
|
document.body.classList.add('dark');
|
|
if (themeIcon) themeIcon.className = 'fas fa-sun';
|
|
}
|
|
|
|
console.log('NetGesCon Layout Clean inizializzato');
|
|
});
|
|
</script>
|
|
|
|
</body>
|
|
</html>
|