Symfony Profiler

{% extends 'base.html.twig' %}
{% block title %}Hello DefaultController!{% endblock %}
{% block body %}
<style>
.select2-container--default .select2-selection--single {
background-color: #fff;
border: none !important;
border-radius: 4px;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
height: 26px;
position: absolute;
top: 1px;
right: 1px;
width: 20px;
display: none;
}
/* Google Fonts - Poppins */
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600&display=swap");
.wrapper {
position: fixed;
bottom: 50px;
right: -370px;
max-width: 345px;
width: 100%;
background: #fff;
border-radius: 8px;
padding: 15px 25px 22px;
transition: right 0.3s ease;
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
}
.wrapper.show {
right: 20px;
}
.tete {
display: flex !important;
align-items: center !important;
column-gap: 15px !important;
background-color: #090817 !important;
padding: 10px; /* Optional: to give some padding around the content */
border-radius: 5px; /* Optional: to give rounded corners */
/* box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); Optional: to give a slight shadow */
}
/* .wrapper header {
} */
.tete i {
color: #B0DB82;
/* color: #FF0000; */
/* color: #4070f4; */
font-size: 32px;
}
.tete h2 {
color: white !important;
font-weight: 500 !important;
margin: 0; /* Optional: to remove any default margin */
}
.wrapper .data {
margin-top: 16px;
}
.wrapper .data p {
color: #B0DB82;
/* color: #333; */
font-size: 16px;
}
.data p a {
color: #4070f4;
text-decoration: none;
}
.data p a:hover {
text-decoration: underline;
}
.wrapper .buttons {
margin-top: 16px;
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
}
.buttons .button {
border: none;
color: #fff;
padding: 8px 0;
border-radius: 4px;
background: #4070f4;
cursor: pointer;
width: calc(100% / 2 - 10px);
transition: all 0.2s ease;
}
.buttons #acceptBtn:hover {
background-color: #B0DB82;
}
#declineBtn #acceptBtn {
border: 2px solid #4070f4;
}
.btn {
color: white;
background-color:#2E3332;
}
#declineBtn:hover {
background-color: #B0DB82;
}
@keyframes fadeInSlideUp {
0% {
opacity: 0;
transform: translateY(20px);
}
100% {
opacity: 1;
transform: translateY(0);
}
}
.texte-anim {
animation: fadeInSlideUp 1s ease-out forwards;
}
</style>
<section class="landing-padding landing-pro">
<div class="container-fluid my-auto" style="height: 100vh;">
<div class="row spacing-particulier">
<div class="col-lg-8 col-md-12 col-sm-12 col-12 box1">
<h1>Trouvez des promotions près de soi</h1>
<h4 class="title-particulier pink" style="font-size:20px">Ne perdez pas de temps les annonces sont valables uniquement quelques heures !</h4>
<div class="search-box" style="border: none;">
<form class="search-box" action="{{ path('annonces') }}" method="get">
<img src="{{ asset('assets/images/particulier/epingle.png') }}" alt="">
<select class="input-search js-data-example-ajax" name="ville" style="width:100%"></select>
<button type="submit" class="bgreen" style="color: white; border-radius: 5px; padding: 10px;">Rechercher</button>
</form>
</div>
</div>
<div class="col-lg-4 col-md-12 col-sm-12 col-12 box2 section-title">
<br><br>
<img src="{{asset('assets/images/particulier/particulier-img.png')}}" alt="">
</div>
</div>
</div>
<div class="container-fluid" style="margin-top : -50px">
<div class="row" style="background: #B0DB82; text-align: right; color: white; height: 70px">
<h2 class="souts-title-particulier" style=" padding-right: 8% !important; margin-top: 15px"><i>Limiter le gaspillage tout en faisant plus de profit !</i></h2>
</div>
</div>
</section>
<section class="section-padding bg-light" id="propos">
<div class="container section3-particulier">
<div class="row py-5 ">
<div class="section-title text-center">
<h2 class="green">MODIXOM c'est quoi ?</h2>
</div>
</div>
<div class="row">
<div class="col-md-6 col-12 d-none d-md-flex justify-content-center align-items-center">
<img src="{{asset('assets/images/mockup.png')}}" style="height: 600px; width: 600px !important" alt="">
</div>
<div class="col-md-6 col-12 h-100 fs-5">
<ul>
<li class="py-4 py-md-3 mx-auto text-index"><b class="green">o</b> Accès à des promotions où que vous soyez grâce à notre
application mobile disponible sur Apple Store et Google Play</li>
<li class="py-4 py-md-3 mx-auto text-index"><b class="green">o</b> Profitez de produits et/ou prestations de services à bas prix</li>
<li class="py-4 py-md-3 mx-auto text-index"><b class="green">o</b> Chaque jour de nouvelles promotions !</li>
<li class="py-4 py-md-3 mx-auto text-index "><b class="green">o</b> Chaque promotion a une <strong>durée maximale de 24h</strong>, lorsqu’une offre vous intéresse il est donc important de s’y rendre le jour-même durant les horaires d’ouverture du commerce avant de passer à côté de belles réductions !</li>
<li class="py-4 py-md-3 mx-auto text-index "><b class="green">o</b> Sans oublier la possibilité de créer des alertes pour toujours être informé de la dernière offre ou promotion
en cours près de chez vous !</li>
</ul>
</div>
</div>
</div>
</section>
<section class="section-padding">
<div class="container section2-particulier pt-3">
<div class="row ">
<div class="section-title text-center">
<h2>Comment ça marche ?</h2><br><br>
</div>
</div>
<div class="row content-section2-particulier ">
<div class="col-12 col-md-4 d-flex flex-column align-items-center">
<img src="{{asset('assets/images/particulier/par1.png')}}" alt="">
<p class="theme-description pt-3 fs-4" style="font-size:1.25rem!important;">Indiquez votre position</p>
</div>
<div class="col-12 col-md-4 d-flex flex-column align-items-center">
<img src="{{asset('assets/images/particulier/par3.png')}}" alt="">
<p class="theme-description pt-3 fs-4" style="font-size:1.25rem!important;">Parcourez les promotions en fonction
des catégories ou des enseignes qui
vous intéressent</p>
</div>
<div class="col-12 col-md-4 d-flex flex-column align-items-center mb-sm-5">
<img src="{{asset('assets/images/particulier/par2.png')}}" alt="">
<p class="theme-description pt-3 fs-4 " style="font-size:1.25rem!important;">Rendez-vous chez l’annonceur
afin d'effectuer vos achats ou
faire appel à ses prestations
de services et ainsi bénéficier
de promotions</p>
</div>
</div>
</div>
</section>
<section class="section-padding bgreen">
<div class="container section3-particulier">
<div class="row py-5 ">
<div class="section-title text-center">
<h2 style="color: white">Avantages</h2>
</div>
</div>
<div class="row fs-5">
<div class="col-md-6 col-12 h-100 ">
<ul>
<li class="py-3 mx-auto txt">o Contribuer à limiter le gaspillage alimentaire et non alimentaire en limitant les invendus</li>
<li class="py-3 mx-auto txt">o Profiter de produits ou services de qualité à prix réduits près de chez soi</li>
<li class="py-3 mx-auto txt">o Favoriser le commerce de proximité</li>
<li class="py-3 mx-auto txt">o Réduire le gaspillage d’imprimés publicitaires grâce à la digitalisation des annonces</li><br>
</ul>
</div>
<div class="col-md-6 col-12 d-none d-md-flex justify-content-center">
<img src="{{asset('assets/images/particulier/particulier-environemental.png')}}" alt="">
</div>
</div>
</div>
</section>
<section class="section-padding">
<div class="container section3-particulier">
<div class="row py-5 ">
<div class="section-title text-center">
<h2 class="green">Combien ça coûte ?</h2>
<div class="py-4 py-md-3 mx-auto" style="font-size:1.25rem!important;">L’application est <strong>gratuite</strong> et téléchargeable sur Apple Store et Google Play
</div>
</div>
</div>
<div class="row fs-5">
<div class="col-md-6 col-12 d-none d-md-flex justify-content-center">
<img src="{{asset('assets/images/particulier/particulier-pricing.png')}}" alt="">
</div>
<div class="col-md-6 col-12 h-100 ">
<h3 class="py-4 py-md-3 mx-auto green" style="text-align: right"><strong>Une promotion vous intéresse ?</strong></h3>
<ul>
<li class="py-4 py-md-3 mx-auto">Si vous souhaitez acheter des produits il vous suffit de vous rendre directement chez le commerçant. Vous trouverez ses coordonnées dans le descriptif de l’annonce.</li>
<li class="py-4 py-md-3 mx-auto">Si vous souhaitez faire appel aux services d’un professionnel, vous pouvez directement le contacter via ses informations disponibles sur l'annonce.</li><br>
</ul>
</div>
</div>
</div>
</section>
<section class="section-padding telecharger-app bgreen">
<div class="container">
<div class="row g-3 pb-3 ">
<h2 class="fs-2 fw-bold text-center">Télécharger l’application</h2>
<h3 class="fs-3 text-center">Profitez de promotions où que vous soyez !</h3>
</div>
<div class="row py-5">

<div class="col-md-6 col-12 text-md-end text-center">
<a href="https://www.apple.com/fr/app-store/" target="_blank" class="market-btn apple-btn" role="button">
<span class="market-button-subtitle">Télécharger sur</span>
<span class="market-button-title">App Store</span>
</a>
</div>

<div class="col-md-6 col-12 text-md-start text-center">
<a href="https://play.google.com/store/games?gl=FR&utm_source=emea_Med&utm_medium=hasem&utm_content=Oct2020&utm_campaign=Evergreen&pcampaignid=MKT-EDR-emea-fr-1001280-Med-hasem-py-Evergreen-Oct2020-Text_Search_BKWS%7CONSEM_kwid_43700008792247580&gclid=CjwKCAiAl9efBhAkEiwA4Toril0SpGeAFHdzwhXUd_zX25ptzJLjDqUqg26pTEyl6Apf3UA1SsLrhhoCuAcQAvD_BwE&gclsrc=aw.ds&pli=1" target="_blank" class="market-btn google-btn" role="button">
<span class="market-button-subtitle">Télécharger sur</span>
<span class="market-button-title">Google Play</span>
</a>
</div>
</div>
</div>
</section>
<section class="section-padding">
<div class="container">
<div class="section-title row g-3 pb-3 ">
<h2 class="fs-2 fw-bold" style="color: #00B050">Rejoignez nous</h2>
</div>
<div class="row py-3">
<div class="col-md-1"></div>
<div class="col-md-1 col-12">
<img src="{{asset('assets/images/linkedin.png')}}">
</div>
<div class="col-md-1 col-12">
<img src="{{asset('assets/images/instagram.png')}}">
</div>
<div class="col-md-1 col-12">
<img src="{{asset('assets/images/facebook.png')}}">
</div>
</div><br>
</div>
</section>
<title>Popup Cookie Consent Box</title>
<link
rel="stylesheet" href="style.css"/>

<link href="https://unpkg.com/boxicons@2.1.2/css/boxicons.min.css" rel="stylesheet"/>
<script src="script.js" defer></script>
<div style="background-color:#1C1B29; z-index:9999" class="wrapper">
<div class="tete">
<i class="bx bx-cookie"></i>
<h2>Gestion Cookies</h2>
</div>
<div style="background-color:#1C1B29" class="data">
<p style="color:white" id="texteCookie" class="texte-anim">Nous utilisons des cookies nécessaires au fonctionnement de ce site Web et également des cookies nous permettant d'analyser notre trafic.
<br><a href="{{path('app_cookie')}}">
En savoir plus</a>
</p>
</div>
<div class="buttons">
<button class="btn" id="acceptBtn">Accepter</button>
<button class="btn" id="declineBtn">Ajuster</button>
</div>
</div>
<script>
const cookieBox = document.querySelector(".wrapper"),
buttons = document.querySelectorAll(".btn");
const executeCodes = () => { // if cookie contains codinglab it will be returned and below of this code will not run
if (document.cookie.includes("codinglab"))
return;
cookieBox.classList.add("show");
buttons.forEach((button) => {
button.addEventListener("click", () => {
if (button.id == "declineBtn") {
var newText = document.createElement("p");
newText.id = "textInfo";
newText.classList.add('texte-anim', 'txt-gradient');
newText.innerHTML = "<br>Si vous refusez les cookies du site, cela peut affecter certaines fonctionnalités du site.<br><br>";
var checkbox1 = document.createElement('input');
checkbox1.type = "checkbox";
checkbox1.id = "check1Id"
checkbox1.disabled = true;
checkbox1.checked = true;
var checkbox2 = document.createElement('input');
checkbox2.type = "checkbox";
checkbox2.id = "check2Id"
var label = document.createElement('label')
label.htmlFor = "check1Id";
label.className = "txt-gradient";
label.innerHTML = "Cookies essentiels<br>"
var label2 = document.createElement('label')
label2.htmlFor = "check2Id";
label2.appendChild(document.createTextNode('Analytics'));
var lineBreak = document.createElement('br'); // Creating a line break
document.getElementById("texteCookie").appendChild(newText);
document.getElementById("textInfo").appendChild(checkbox1);
document.getElementById("textInfo").appendChild(label);
document.getElementById("textInfo").appendChild(lineBreak); // Appending the line break
document.getElementById("textInfo").appendChild(checkbox2);
document.getElementById("textInfo").appendChild(label2);
document.getElementById("declineBtn").style.display="none";
}
// if button has acceptBtn id
if (button.id == "acceptBtn") { // set cookies for 1 month. 60 = 1 min, 60 = 1 hours, 24 = 1 day, 30 = 30 days
document.cookie = "cookieBy= codinglab; max-age=" + 5;
cookieBox.classList.remove("show");
}
});
});
};
// executeCodes function will be called on webpage load
window.addEventListener("load", executeCodes);
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js" integrity="sha512-3gJwYpMe3QewGELv8k/BX9vcqhryRdzRMxVfq6ngyWXwo03GFEzjsUm8Q7RZcHPHksttq7/GFoxjCVUjkjvPdw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.8/js/select2.min.js" defer></script>
<script>
// Obtenez tous les éléments input de type texte
var inputs = document.querySelectorAll("input[type='text']");
// Pour chaque champ de saisie, ajouter un écouteur d'événement pour le focus
inputs.forEach(function(input) {
input.addEventListener("focus", () => {
// Supprime la bordure et l'outline lorsqu'un champ de saisie texte est en focus
this.style.border = "none";
this.style.outline = "none";
});
});
$(document).ready(function() {
$('.js-data-example-ajax').select2({
placeholder: 'Choisir une ville ou un code postal',
language: {
inputTooShort: function() {
return "Saisir minimum 3 caractères";
},
searching: function() {
return "Recherche en cours...";
},
noResults: function() {
return "Aucun résultat trouvé";
}
},
minimumInputLength: 3,
ajax: {
url: '/api/villes', // Utilisez l'URL de votre nouvelle API
dataType: 'json',
delay: 250,
data: function(params) {
return {
q: params.term // search term
};
},
processResults: function(data) {
return {
results: data.results
};
},
cache: true
},
templateResult: function(city) {
if (city.loading) return city.text;
return $('<span>' + city.text + '</span>');
},
templateSelection: function(city) {
return city.text || city.id;
}
});
});
</script>
{% endblock %}

templates/default/index.html.twig line 1