78 lines
No EOL
2.7 KiB
Twig
78 lines
No EOL
2.7 KiB
Twig
<style>
|
|
.suggestion-list {
|
|
position: absolute;
|
|
background: #fff;
|
|
border: 1px solid #ced4da;
|
|
border-radius: 0.5rem;
|
|
box-shadow: 0 4px 16px rgba(0,0,0,0.08);
|
|
max-height: 260px;
|
|
overflow-y: auto;
|
|
width: 100%;
|
|
z-index: 1050;
|
|
margin-top: 2px;
|
|
display: none;
|
|
padding: 0;
|
|
}
|
|
.suggestion-item {
|
|
padding: 0.75rem 1rem;
|
|
cursor: pointer;
|
|
border-bottom: 1px solid #f1f3f4;
|
|
background: #fff;
|
|
transition: background 0.15s;
|
|
font-size: 1rem;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
.suggestion-item:last-child {
|
|
border-bottom: none;
|
|
}
|
|
.suggestion-item:hover, .suggestion-item.active {
|
|
background: #e9ecef;
|
|
color: #212529;
|
|
}
|
|
.suggestion-name {
|
|
font-weight: 500;
|
|
color: #0d6efd;
|
|
margin-right: 0.5em;
|
|
}
|
|
.suggestion-details {
|
|
font-size: 0.95em;
|
|
color: #6c757d;
|
|
}
|
|
.suggestion-type {
|
|
margin-right: 8px;
|
|
color: #adb5bd;
|
|
font-size: 1.1em;
|
|
}
|
|
.search-container { position: relative; }
|
|
</style>
|
|
|
|
<div class="row mt-4 labourer-form-container" id="labourerFormContainer">
|
|
<div class="col-12">
|
|
<div class="card">
|
|
<div class="card-body">
|
|
<h3 class="card-title">Labourer une ville</h3>
|
|
<p class="card-text">
|
|
<i class="bi bi-info-circle"
|
|
data-bs-toggle="tooltip"
|
|
data-bs-placement="right"
|
|
data-bs-html="true"
|
|
title="<strong>Qu'est-ce que le labourage ?</strong><br><br>Le labourage consiste à rechercher automatiquement tous les commerces et lieux d'intérêt dans une ville sur OpenStreetMap. Cette action permet de :<br><br>- Découvrir les commerces existants<br>- Mesurer leur taux de complétion<br>- Identifier les informations manquantes<br>- Faciliter la mise à jour des données"></i>
|
|
Rechercher une ville pour labourer ses commerces
|
|
</p>
|
|
<form id="labourerForm">
|
|
<div class="search-container">
|
|
<input type="text"
|
|
id="citySearch"
|
|
class="form-control"
|
|
placeholder="Rechercher une ville..."
|
|
autocomplete="off">
|
|
<div id="citySuggestions" class="suggestion-list"></div>
|
|
</div>
|
|
<input type="hidden" name="zip_code" id="selectedZipCode">
|
|
<button type="submit" class="btn btn-primary mt-3 btn-labourer">Labourer cette ville</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div> |