templates/layouts/base.html.twig line 1

Open in your IDE?
  1. <!DOCTYPE html>
  2. <html lang="{{ app.request.locale }}">
  3.     <head>
  4.         <meta charset="UTF-8">
  5.         <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">        
  6.         <link href="https://fonts.googleapis.com/css2?family=Montserrat&display=swap" rel="stylesheet">
  7.         <title>{% block title %}Mandèh{% endblock %}</title>
  8.         {% block stylesheets %}
  9.             <!-- CSS only -->
  10.             <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/css/bootstrap.min.css" rel="stylesheet" 
  11.             integrity="sha384-iYQeCzEYFbKjA/T2uDLTpkwGzCiq6soy8tYaI1GyVh/UjpbCx/TYkiZhlZB6+fzT" crossorigin="anonymous">
  12.             <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
  13.             <link  rel="stylesheet" href="{{ asset('css/app.css') }}">
  14.             <style>
  15.                 .vich-image .form-check{
  16.                     margin-top:20px;
  17.                 }
  18.                 .membre img{
  19.                     transition:transform 0.3s ease-out;
  20.                 }
  21.                 .membre img:hover{
  22.                     transform:scale(1.075);
  23.                 }
  24.                 .vich-image .form-check{
  25.                     margin-top:20px;
  26.                 }
  27.                 .vich-image img{
  28.                     margin-top:20px;
  29.                     margin-bottom:20px;
  30.                     box-shadow: 10px 10px 5px lightblue;
  31.                     border: 2px solid white;
  32.                     border-radius: 12px;
  33.                     padding: 5px;
  34.                 }
  35.                 .menuStyle{
  36.                     font-style:italic;
  37.                     font-size:700;
  38.                     font-family:Arial black;
  39.                     font-size:22px;
  40.                     color:orange;
  41.                 }
  42.                 .smenuStyle{
  43.                     font-style:italic;
  44.                     font-size:700;
  45.                     font-family:Arial black;
  46.                     text-decoration:none;
  47.                     color:gray;
  48.                     font-size:20px;
  49.                 }
  50.                 .divframe{
  51.                     border: 1px solid; 
  52.                     padding: 10px;  
  53.                     box-shadow: 5px 10px teal;
  54.                     /*width:40%px;
  55.                     height:100px;*/
  56.                 }
  57.                 .menuEntete{
  58.                     font-style:italic;
  59.                     font-size:700;
  60.                     font-family:Arial black;
  61.                     text-decoration:none;
  62.                     color:navy;
  63.                     font-size:22px;
  64.                 }
  65.                 
  66.                 .navbar .megamenu{ padding: 1rem; }
  67.                 /* ============ desktop view ============ */
  68.                 @media all and (min-width: 992px) {
  69.                     
  70.                     .navbar .has-megamenu{position:static!important;}
  71.                     .navbar .megamenu{left:0; right:0; width:70%; margin-top:-10; background-color:skyblue; }
  72.                     
  73.                 }    
  74.                 /* ============ desktop view .end// ============ */
  75.                 
  76.                 
  77.                 /* ============ mobile view ============ */
  78.                 @media(max-width: 991px){
  79.                     .navbar.fixed-top .navbar-collapse, .navbar.sticky-top .navbar-collapse{
  80.                         overflow-y: auto;
  81.                         max-height: 90vh;
  82.                         margin-top:10px;
  83.                     }
  84.                 }
  85.                 /* ============ mobile view .end// ============ */
  86.                 
  87.                 /* ============ only desktop view ============ */
  88.                 @media all and (min-width: 992px) {
  89.                     .navbar .dropdown-menu-end{ right:0; left: auto;  }
  90.                     .navbar .nav-item .dropdown-menu{  display:block; opacity: 0;  visibility: hidden; transition:.3s; margin-top:0;  }
  91.                     .navbar .nav-item:hover .nav-link{ color: #fff;  }
  92.                     .navbar .dropdown-menu.fade-down{ top:80%; transform: rotateX(-75deg); transform-origin: 0% 0%; }
  93.                     .navbar .dropdown-menu.fade-up{ top:180%;  }
  94.                     .navbar .nav-item:hover .dropdown-menu{ transition: .3s; opacity:1; visibility:visible; top:100%; transform: rotateX(0deg); }
  95.                 }    
  96.                 /* ============ desktop view .end// ============ */
  98.             </style>
  99.         {% endblock %}
  100.     </head>
  101.     <body style="background-color:turquoise;">
  102.         {{ include('partials/_flashMessage.html.twig') }}        
  103.         {{ include('partials/_navConnexion.html.twig') }}
  104.         
  105.         <main role="main" class="container">
  106.             {% block body %}{% endblock %}
  107.         </main>
  108.         {{ include('partials/_footer.html.twig') }}        
  109.         
  110.         {% block javascripts %}
  111.             <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.6/dist/umd/popper.min.js" integrity="sha384-oBqDVmMz9ATKxIep9tiCxS/Z9fNfEXiDAYTujMAeBAsjFuCZSmKbSSUnQlmh/jp3"
  112.                 crossorigin="anonymous"></script>
  113. <!-- JavaScript Bundle with Popper -->
  114.             <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/js/bootstrap.min.js" integrity="sha384-7VPbUDkoPSGFnVtYi0QogXtr74QeVeeIs99Qfg5YCF+TidwNdjvaKZX19NZ/e6oz" 
  115.                 crossorigin="anonymous"></script>       
  116.             <script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
  117.         {% endblock %}
  118.     </body>
  119. </html>