Layouts

Layouts disponibles

Layout	Fichier	Usage
layouts.app	resources/views/layouts/app.blade.php	Pages génériques simples
layouts.admin	resources/views/layouts/admin.blade.php	Module Admin (sidebar + topbar)
layouts.dashboard	resources/views/layouts/dashboard.blade.php	Widgets intranet uniquement
layouts.metier	resources/views/layouts/metier.blade.php	Toutes les applications métier
layouts.fullpage	resources/views/layouts/fullpage.blade.php	Pages plein écran
elevage::layouts.app	Modules/Elevage/…/layouts/app.blade.php	Élevage (étend layouts.metier)

---

Règle de choix du layout

Contexte	Layout
Widgets intranet (Dashboard, Alert, Actualité)	layouts.dashboard
Applications métier (Elevage, ChrConnector, EdiEngine…)	layouts.metier
Module Admin	layouts.admin
Pages simples sans structure spécifique	layouts.app

---

Layout métier (layouts.metier)

C'est le layout commun de toutes les applications métier.

Fournit :

• La navbar partagée (bleue, 44px)
• La zone de contenu (#metier-main, flex 1)
• Le footer avec pastille notice

Paramètres attendus :

Paramètre	Description	Obligatoire
$appCode	Code dans core_applications (ex. 'elevage_huitres')	Oui
$navbarTitle	Titre affiché dans la navbar	Non
$notice	URL de la notice de page	Non

Usage :

@extends('layouts.metier', ['appCode' => 'mon_app_code'])

---

Navbar

Fichier : resources/views/layouts/partials/navbar.blade.php

• Hauteur fixe : 44px
• Background : #0d6efd
• Structure : logo SVG (gauche) · titre centré · actions (droite)
• Actions droite : Accueil · Admin (si autorisé) · dropdown utilisateur

Bouton Admin :

• Layouts standard : visible si is_admin ou admin_srv
• Layout métier : visible si isAdminOfApp($app) (inclut is_admin)
• URL Admin → paramètres de l'application (/admin/applications/{id}/settings)

Paramètres du partial :

Paramètre	Description
$navbarDefaultTitle	Titre centre de la navbar
$navbarAdminUrl	URL du bouton Admin (override)
$navbarCanAdmin	Bool override de la visibilité du bouton Admin

---

Sidebar

Présente dans layouts.admin et elevage::layouts.app.

Propriété	Admin	Élevage
Background	#212529	#212529
Largeur	240px	210px
Lien actif	color: #fff; background: #343a40	border-left: 3px solid #0d6efd
Texte inactif	#adb5bd	#adb5bd
Labels section	.7rem, font-weight: 600, uppercase	idem

---

Footer

• Hauteur : 31px (--footer-h)
• Background : #f0f2f5, bordure top #dee2e6
• Pastille d'aide bas-gauche : quart de cercle #0d6efd, icône bi-info-lg
  • Lien actif : cliquable, icône grossit au hover (transition .18s ease)
  • Inactif : opacity: .45, cursor: default

---

En-tête de page standard

<div class="d-flex justify-content-between align-items-center mb-4">
    <h4 class="mb-0">Titre de la page</h4>
    @can('create', App\Models\MonModele::class)
    <button type="button" class="btn btn-primary btn-sm" data-bs-toggle="modal" data-bs-target="#modal-add">
        <i class="bi bi-plus-lg me-1"></i>Ajouter
    </button>
    @endcan
</div>

Breadcrumb

@section('breadcrumb', 'Parent › Enfant')

Affiché dans la topbar Admin, text-muted small.

Titre d'onglet

@section('title', 'Libellé')

Rendu : Libellé — {{ config('app.name') }}

---

Formulaires

• Centrés dans col-lg-6 avec row.justify-content-center
• Bouton retour + h4 en haut : d-flex align-items-center gap-3 mb-4
• Card shadow-sm autour du formulaire
• Boutons en bas à droite :

<div class="d-flex justify-content-end gap-2 mt-4">
    <a href="{{ url()->previous() }}" class="btn btn-outline-secondary">Annuler</a>
    <button type="submit" class="btn btn-primary">Enregistrer</button>
</div>

---

Sections repliables

<div class="card-header" data-bs-toggle="collapse" data-bs-target="#section-id" style="cursor:pointer">
    <div class="d-flex align-items-center justify-content-between">
        <h5 class="mb-0"><i class="bi bi-list me-2"></i>Titre section</h5>
        <div class="d-flex align-items-center gap-2">
            <span class="badge bg-dark">{{ $count }}</span>
            <i class="bi bi-chevron-down"></i>
        </div>
    </div>
</div>
<div class="collapse" id="section-id">
    <div class="card-body">...</div>
</div>