templates/base_baux_agent.html.twig line 1

Open in your IDE?
  1. <!DOCTYPE html>
  2. <html lang="fr">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6.     <title>Gestion des BAUX</title>
  7.     {% block stylesheet %}
  8.         {{ encore_entry_script_tags('app') }}
  9.         <link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.3/dist/leaflet.css" crossorigin=""/>
  10.     {% endblock %}
  11.     
  12.     <linkrel="shortcut icon" href="{{ asset('assets/img/logo-MUAT.png') }}">
  13.     <link rel="icon" href="{{ asset('assets/img/logo-MUAT-2.png') }}" type="image/x-icon">
  14.     <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
  15.     <style>
  16.         body {
  17.             background-color: #f8f9fa; /* Background de l'écran global */
  18.         }
  19.         .form-container {
  20.             background-color: #ffffff; /* Background du formulaire */
  21.             padding: 20px;
  22.             border-radius: 10px;
  23.             box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
  24.             width: 100%; /* Prend toute la largeur disponible */
  25.             max-width: 900px; /* Limite la largeur à 900px ou moins */
  26.             margin: 0 auto; /* Centre le conteneur horizontalement */
  27.             border: 1px solid #e0e0e0; /* Bordure légère pour délimiter le conteneur */
  28.         }
  29.         
  30.         .block-title {
  31.             color: #28a745; /* Couleur verte pour les titres des blocs */
  32.             font-weight: bold;
  33.             margin-bottom: 10px;
  34.         }
  35.         .header {
  36.             text-align: center;
  37.             margin-bottom: 30px;
  38.         }
  39.         .header img.logo {
  40.             margin-bottom: 10px;
  41.         }
  42.         h5{
  43.             color : green;
  44.         }
  45.         .footer {
  46.             background-color: green;
  47.             color: white;
  48.             text-align: center;
  49.             padding: 10px;
  50.             margin-top: 30px;
  51.             border-radius: 10px;
  52.         }
  53.         .footer .logout-btn {
  54.             margin-top: 10px;
  55.         }
  56.         /* Limiter la taille maximale du logo pour différentes tailles d'écran */
  57.         @media (max-width: 2576px) {
  58.             .header img.logo {
  59.                 max-width: 10%; /* 50% de la largeur de l'écran sur les petits écrans */
  60.             }
  61.         }
  62.         @media (min-width: 577px) and (max-width: 768px) {
  63.             .header img.logo {
  64.                 max-width: 10%; /* 30% de la largeur de l'écran sur les écrans moyens */
  65.             }
  66.         }
  67.         @media (min-width: 769px) {
  68.             .header img.logo {
  69.                 max-width: 1%; /* 20% de la largeur de l'écran sur les grands écrans */
  70.             }
  71.         }
  72.     </style>
  73.     <link href="https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.11.3/css/lightbox.min.css" rel="stylesheet">
  74.     {% block javascript %}
  75.     {{ encore_entry_script_tags('app') }}
  76.         <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
  77.         <script src="https://unpkg.com/leaflet@1.9.3/dist/leaflet.js"  crossorigin=""></script>
  78.         
  79.     {% endblock %}
  80.     
  81. </head>
  82. <body>
  83. <div class="container mt-5">
  84.     <!-- Header avec logo centré et email en dessous -->
  85.     <div class="header">
  86.         <img class="navbar-brand-logo" src="{{ asset('assets/img/logo-MUAT-2.png') }}" alt="Logo" data-hs-theme-appearance="dark" width=400>
  87.         <hr>
  88.         {% if app.user %}
  89.         <div class="email">
  90.             <p class="text-muted"><strong>Utilisateur connecté :</strong> {{ app.user.email }} </p>
  91.         </div>
  92.         {% endif %}
  93.     </div>
  94.     <!-- Formulaire principal -->
  95.     <div class="form-container">
  96.         {% block body %} {% endblock %}
  97.     </div>
  98. </div>
  99. <!-- Footer avec bouton de déconnexion -->
  100. <div class="footer mt-5">
  101.     <p>&copy; 2024 Votre Société. Tous droits réservés.</p>
  102.     <a href="{{path('app_logout')}}" class="btn btn-danger logout-btn">Déconnexion</a>
  103. </div>
  104. </body>
  105.     <script src="https://cdn.jsdelivr.net/npm/signature_pad@2.3.2/dist/signature_pad.min.js"></script>
  106.     <script src=" {{asset('assets/js/sign.js')}}"></script>
  107.     
  108. </html>