templates/base.html.twig line 1

Open in your IDE?
  1. <!DOCTYPE html>
  2. <html lang="es">
  3. <head>
  4.     <meta charset="utf-8">
  5.     <meta name="viewport" content="width=device-width, initial-scale=1">
  6.     <title>SIGMEC{% block title %}{% endblock %}</title>
  7.     <link rel="icon" type="image/x-icon" href="{{ asset('img/sistema/favicon.ico') }}">
  8.     <!-- Google Font: Source Sans Pro -->
  9.     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
  10.     <!-- Font Awesome -->
  11.     <link rel="stylesheet" href="{{ asset('plugins/fontawesome-free/css/all.min.css') }}">
  12.     <!-- Theme style -->
  13.     <link rel="stylesheet" href="{{ asset('css/adminlte.min.css') }}">
  14.     {% block stylesheets %}{% endblock %}
  15.     {% if app.request.query.get('embedded') == '1' %}
  16.     <style>
  17.         /* ðŸ”¹ Estilos para modo embebido */
  18.         body {
  19.             background-color: #f8f9fa;
  20.         }
  21.         .main-header,
  22.         .main-sidebar,
  23.         .main-footer {
  24.             display: none !important;
  25.         }
  26.         .content-wrapper {
  27.             margin-left: 0 !important; /* evita desplazamiento lateral por sidebar oculto */
  28.             padding: 15px 25px;
  29.             background: white;
  30.             box-shadow: none; 
  31.         }
  32.         .wrapper {
  33.             background-color: #fff;
  34.         }
  35.     </style>
  36.     {% endif %}
  37. <!-- Google tag (gtag.js) -->
  38. <script async src="https://www.googletagmanager.com/gtag/js?id=G-7EVJ0XBQ4Y"></script>
  39. <script>
  40.   window.dataLayer = window.dataLayer || [];
  41.   function gtag(){dataLayer.push(arguments);}
  42.   gtag('js', new Date());
  43.   gtag('config', 'G-7EVJ0XBQ4Y');
  44. </script>
  45. <body class="hold-transition sidebar-mini">
  46. <div class="wrapper">
  47.     {# ðŸ”¹ Mostrar Navbar solo si NO está en modo embebido #}
  48.     {% if app.request.query.get('embedded') != '1' %}
  49.     <!-- Navbar -->
  50.     <nav class="main-header navbar navbar-expand navbar-white navbar-light" style="background-color: #01746d">
  51.         <!-- Left navbar links -->
  52.         <ul class="navbar-nav">
  53.             <li class="nav-item">
  54.                 <a class="nav-link d-lg-none" data-widget="pushmenu" href="#" role="button"><i class="fas fa-bars"></i></a>
  55.             </li>
  56.         </ul>
  57.         <!-- Right navbar links -->
  58.         <ul class="navbar-nav ml-auto">
  59.             <li class="nav-item">
  60.                 <a class="nav-link" data-widget="fullscreen" href="#" role="button">
  61.                     <i class="fas fa-expand-arrows-alt"></i>
  62.                 </a>
  63.             </li>
  64.             {% if app.session.get('periodo').nombre is defined %}
  65.             <li class="nav-item p-0">
  66.                 <span class="nav-link pl-0 pr-0">
  67.                     {{ app.session.get('periodo').nombre }}
  68.                 </span>
  69.             </li>
  70.             {% endif %}
  71.             <li class="nav-item dropdown user user-menu">
  72.                 <a href="#" class="nav-link" data-toggle="dropdown">
  73.                     <img src="{{ asset('img/sistema/user-generic.png') }}" class="user-image" alt="User Image">
  74.                     <span class="hidden-xs">{{ app.user.nombre }} {{ app.user.papellido }}</span>
  75.                 </a>
  76.                 <div class="dropdown-menu dropdown-menu-lg dropdown-menu-right">
  77.                     <div class="user-header text-center">
  78.                         <img src="{{ asset('img/sistema/user-generic.png') }}" class="img-circle img-size-64 pt-2" alt="User Image">
  79.                         <p class="p-4">
  80.                             {{ app.user.nombre }} {{ app.user.papellido }}
  81.                             <br>
  82.                             <small>{{ app.user.unidad }}</small>
  83.                             <br>
  84.                             <small>{{ app.user.rol }}</small>
  85.                         </p>
  86.                     </div>
  87.                     <div class="dropdown-divider"></div>
  88.                     <a href="#" class="dropdown-item dropdown-footer">Configuraciones</a>
  89.                     <a href="{{ path('app_logout') }}" class="dropdown-item dropdown-footer">Cerrar sesión</a>
  90.                 </div>
  91.             </li>
  92.         </ul>
  93.     </nav>
  94.     <!-- Sidebar -->
  95.     <aside class="main-sidebar elevation-2 sidebar-light-teal">
  96.         <!-- Brand Logo -->
  97.         <a href="{{ path('homepage') }}" class="brand-link text-center">
  98.             <img src="{{ asset('img/sistema/logo.png') }}" alt="SIGMEC" class="brand-image elevation-2" style="opacity: .8; float: none">
  99.         </a>
  100.         <!-- Sidebar -->
  101.         <div class="sidebar">
  102.             <div class="user-panel mb-1 d-flex">
  103.                 <div class="info w-100">
  104.                     <p class="text-center mb-0" style="font-size: 14px">
  105.                         {{ app.user.nombre }} {{ app.user.papellido }}<br>
  106.                         {{ app.user.unidad}} <br>
  107.                         {{ app.user.rol }}
  108.                     </p>
  109.                 </div>
  110.             </div>
  111.             {% include 'menu.html.twig' %}
  112.         </div>
  113.     </aside>
  114.     {% endif %}
  115.     <!-- Message alert -->
  116.     <div id="content-message" style="position: fixed; top: 0; left: 0; width: 100%; z-index: 5000;" class="modal">
  117.         <div class="row">
  118.             <div class="col-lg-5 col-md-12 ml-auto">
  119.                 <div class="alert alert-dismissible" style="margin: 20px">
  120.                     <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
  121.                     <h5><i class="icon"></i> <span class="title-alert"></span></h5>
  122.                     <p><span class="body-alert"></span></p>
  123.                 </div>
  124.             </div>
  125.         </div>
  126.     </div>
  127.     <!-- Main Content -->
  128.     {% block body %}{% endblock %}
  129.     {% if app.request.query.get('embedded') != '1' %}
  130.     <!-- Footer -->
  131.     <footer class="main-footer">
  132.         <div class="float-right d-none d-sm-block">
  133.             <b>Version</b> {{ app.request.server.get('VERSION') }}
  134.         </div>
  135.         <strong>CONALEP Estado de México &copy; {{ "now"|date('Y') }}</strong> Derechos reservados
  136.     </footer>
  137.     {% endif %}
  138. </div>
  139. <!-- Scripts -->
  140. <script src="{{ asset('plugins/jquery/jquery.min.js') }}"></script>
  141. <script src="{{ asset('plugins/bootstrap/js/bootstrap.bundle.min.js') }}"></script>
  142. <script src="{{ asset('js/adminlte.min.js') }}"></script>
  143. <script>
  144.     $(function(){
  145.         $('#content-message').hide().css("display", "none");
  146.     });
  147.     function alertMessage(type, body){
  148.         let mensaje = $('#content-message');
  149.         
  150.         // Clear previous animation/timeout
  151.         mensaje.stop(true, true);
  152.         clearTimeout(mensaje.data('alertTimeout'));
  153.         
  154.         // Debounce: if already visible and same type, skip
  155.         if (mensaje.is(':visible') && mensaje.find('.title-alert').text() === (type === 0 ? '¡Éxito!' : '¡Error!')) {
  156.             return;
  157.         }
  158.         
  159.         // Reset classes
  160.         mensaje.find('.alert').removeClass('alert-success alert-danger');
  161.         mensaje.find('.icon').removeClass('icon fas fa-check fa fa-ban');
  162.         
  163.         mensaje.find('.body-alert').text(body);
  164.         if (type === 0){
  165.             mensaje.find('.alert').addClass('alert-success');
  166.             mensaje.find('.icon').addClass('icon fas fa-check');
  167.             mensaje.find('.title-alert').text('¡Éxito!');
  168.         } else {
  169.             mensaje.find('.alert').addClass('alert-danger');
  170.             mensaje.find('.icon').addClass('fa fa-ban');
  171.             mensaje.find('.title-alert').text('¡Error!');
  172.         }
  173.         
  174.         mensaje.css("display", "block").fadeIn(400); // Smooth show
  175.         
  176.         // Short timeout + instant hide (no pause)
  177.         let timeoutId = setTimeout(function(){ 
  178.             mensaje.stop(true, true).hide(); 
  179.         }, 2500);
  180.         mensaje.data('alertTimeout', timeoutId);
  181.     }
  182.     function closeModal(id){
  183.         let modal = $(`#${id}`);
  184.         modal.removeClass('show').fadeOut();
  185.         $('body').removeClass('modal-open');
  186.         $('.modal-backdrop').remove();
  187.         modal.modal('hide');
  188.     }
  189. </script>
  190. {% block javascripts %}{% endblock %}
  191. </body>
  192. </html>