templates/navbar/header_accueil.html.twig line 1

Open in your IDE?
  2. <style>
  3.     .navbar {
  4.         position: fixed;
  5.         top: 0;
  6.         left: 0;
  7.         width: 100%;
  8.         z-index: 1000;  
  9.     }
  11.     /* Ajouter un espacement en haut du contenu pour compenser la navbar fixe */
  12.     .container.mb-5 {
  13.         margin-top: 70px; /* Ajuste cette valeur selon la hauteur de ta navbar */
  14.     }
  15.     html, body {
  16.         height: 100%;
  17.         margin: 0;
  18.         display: flex;
  19.         flex-direction: column;
  20.     }
  22.     .container-fluid {
  23.         flex: 1;
  24.     }
  26.     .center-horizontal {
  27.         display: flex;
  28.         justify-content: center; /* Centre horizontalement */
  29.     }
  31.     .navbar {
  32.         padding: 0px
  33.     }
  35.     .navbar-brand img {
  36.         height: 50px; /* Adjust the size of the logo */
  37.     }
  39.     .navbar-nav .nav-link, .navbar-nav .btn {
  40.         font-size: 1.3rem; /* Reduce the font size */
  41.     }
  43.     .navbar-nav .nav-item.dropdown .nav-link h5, .navbar-nav .dropdown-menu h6 {
  44.         font-size: 1rem; /* Adjust the font size of language options */
  45.     }
  47.     .navbar-nav .btn {
  48.         padding: 0.30rem 0.75rem; /* Adjust the padding of the button */
  49.         margin-top: 15px;
  50.         margin-left: 10px;
  51.         width: 130px;
  52.         height: 45px;
  53.     }
  55.     .footer {
  56.         padding: 5px 0;
  57.         text-align: center;
  58.         margin-top: auto;
  59.     }
  60. </style>
  62. <body>
  63.     {# barre de navigation #}
  64.     <nav class="navbar navbar-expand-lg bg-body-tertiary">
  65.         <div class="container-fluid">
  66.             <a class="navbar-brand text-info" href="{{path('app_home')}}"><img src="{{ asset('image_figma/Logo_Dima_transparent_mx.png') }}" alt="logo"></a>
  67.             <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
  68.                 <span class="navbar-toggler-icon"></span>
  69.             </button>
  70.             <div class="collapse navbar-collapse justify-content-end" id="navbarNavDropdown">
  71.                 <ul class="navbar-nav">
  72.                     <li class="nav-item">
  73.                        <a class="btn btn-info" href="{{path('app_login')}}" role="button" aria-disabled="true">Connexion</a>
  74.                     </li>
  75.                 </ul>
  76.             </div>
  77.         </div>
  78.     </nav>