templates/base.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, shrink-to-fit=no">
  6.     <meta name="description" content="de bons ingrédients 100% français">
  7.     <meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
  8.     <meta name="generator" content="Jekyll v4.1.1">
  9.     <title>{% block title %} Sur Le Pouce {% endblock %}</title>
  11.     <!-- Bootstrap core CSS -->
  12.         <link href="{{ asset('assets/css/bootstrap.min.css') }}" rel="stylesheet">
  13.     <link rel="stylesheet" href="{{ asset('assets/css/styles.css') }}">
  14.     {% block javascript %}
  15.     {% endblock %}
  17.     <style>
  18.         .bd-placeholder-img {
  19.             font-size: 1.125rem;
  20.             text-anchor: middle;
  21.             -webkit-user-select: none;
  22.             -moz-user-select: none;
  23.             -ms-user-select: none;
  24.             user-select: none;
  25.         }
  27.         @media (min-width: 768px) {
  28.             .bd-placeholder-img-lg {
  29.                 font-size: 3.5rem;
  30.             }
  31.         }
  32.     </style>
  33.     <!-- Custom styles for this template -->
  34.     <link href="{{ asset('assets/css/carousel.css') }}" rel="stylesheet">
  35. </head>
  36. <body>
  37. <header>
  38.     <nav class="navbar navbar-expand-md navbar-dark fixed-top bg-dark">
  39.         <a class="navbar-brand" href="{{ path('home') }}">Sur Le Pouce</a>
  40.         <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
  41.             <span class="navbar-toggler-icon"></span>
  42.         </button>
  43.         <div class="collapse navbar-collapse" id="navbarCollapse">
  44.             <ul class="navbar-nav mr-auto">
  45.                 <li class="nav-item active">
  46.                     <a class="nav-link" href="{{ path('app_produit') }}">Nos produits</a>
  47.                 </li>
  48.                 <li class="nav-item active">
  49.                     <a class="nav-link" href="{{ path('app_somme_nous') }}">Qui sommes nous</a>
  50.                 </li>
  51.                 <li class="nav-item active">
  52.                     <a class="nav-link" href="{{ path('app_contact') }}">Contact</a>
  53.                 </li>
  54.                 
  55.             </ul>
  56.             <div class="navbar-item-custom">
  58.                 {% if app.user %}
  59.                 <a href="{{path('account') }}"> Mon compte  <small>({{ app.user.firstname }})</small> </a>   
  60.                 <a href="{{path('app_logout') }}"> Déconnexion </a>
  61.                 {% else %}
  62.                 <a href="{{path('app_login')}}"> connexion </a> | <a href="{{path('register')}}"> Inscription </a>
  63.                 {% endif %}
  64.             </div>
  65.                 <a href="{{path('cart')}}">
  66.                  {% set cartLength = app.session.get('cart')|length %}
  68.                   <img src="{{asset('assets/img/shopping-cart.png')}}" class="cart-icon" alt = "Mon panier">
  69.                 <span><span class="text-left">{{ app.session.get('cartLength') }}</span></span>
  71.                 {% if cartLength is defined and cartLength > 0 %}
  72.                   <span>{{ cartLength }}</span>
  73.                     {% endif %}
  74.                 </a>
  75.         </div>
  76.     </nav>
  77. </header>
  79. <main role="main">
  81. {% if block('carousel')  is defined %}
  83.     <div id="myCarousel" class="carousel slide" data-ride="carousel">
  84.         <ol class="carousel-indicators">
  85.         {% for key,header in headers %}
  87.             <li data-target="#myCarousel" data-slide-to="{{ key }}" {% if key == 0 %}class="active"{% endif %}></li>
  89.             {% endfor %}
  90.             
  91.         </ol>
  92.         <div class="carousel-inner">
  93.         {% for key,header in headers %}
  94.             
  95.             <div class="carousel-item {% if key == 0 %} active {% endif %}" style="background: url('/uploads/{{ header.illustration }}');background-size:cover; background-position:center;">
  96.                 <div class="container">
  97.                     <div class="carousel-caption text-left">
  98.                         <h1>{{ header.title }}</h1>
  99.                         <p>{{ header.content }}</p>
  100.                     </div>
  101.                 </div>
  102.             </div>
  103.         
  104.         {% endfor %}
  105.         </div>
  106.         <a class="carousel-control-prev" href="#myCarousel" role="button" data-slide="prev">
  107.             <span class="carousel-control-prev-icon" aria-hidden="true"></span>
  108.             <span class="sr-only">Previous</span>
  109.         </a>
  110.         <a class="carousel-control-next" href="#myCarousel" role="button" data-slide="next">
  111.             <span class="carousel-control-next-icon" aria-hidden="true"></span>
  112.             <span class="sr-only">Next</span>
  113.         </a>
  114.     </div>
  116. {% endif %}
  117.     <!-- Marketing messaging and featurettes
  118.     ================================================== -->
  119.     <!-- Wrap the rest of the page in another container to center all the content. -->
  121.     <div class="container marketing {% if block('carousel')  is not defined %}mt-5{% endif %}">
  123.         {% block content %}
  124.             
  125.         {% endblock %}
  126.         <!-- /END THE FEATURETTES -->
  128.     </div><!-- /.container -->
  130.         <!-- FOOTER -->
  131.         <footer  md-6 class="footer-custom">
  132.         
  133.             <p>
  134.             &copy; 2020-2023 Sur Le Pouce
  135.             <small>Les sandwichs made in france<br/> 
  136.             
  137.             </p>
  138.         </footer>
  139. </main>
  140.     <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
  141.     <script src="{{asset('assets/js/bootstrap.bundle.js')}}"></script>
  142.     <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js" integrity="sha384-IQsoLXl5PILFhosVNubq5LC7Qb9DXgDA9i+tQ8Zj3iwWAwPtgFTxbJ8NT4GN1R8p" crossorigin="anonymous"></script>
  143.     <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.min.js" integrity="sha384-cVKIPhGWiC2Al4u+LWgxfKTRIcfu0JTxR+EQDz/bgldoEyl4H0zUF0QKbrJ0EcQF" crossorigin="anonymous"></script>
  145.     <script type="text/javascript">
  147.     function placeFooter() {
  148.         if( $(document.body).height() < $(window).height() ) {
  149.             $("footer").css({position: "fixed", bottom:"0px"});
  150.         } else {
  151.             $("footer").css({position: ""});
  152.         }
  153.     }
  155.     placeFooter();
  157. </script>
  159. </body>
  160. {% block script %}
  161. {% endblock %}
  162. </html>