mirror of
https://forge.chapril.org/tykayn/libre-charge-map
synced 2025-06-20 01:34:43 +02:00
filtrer une puissance minimale
This commit is contained in:
Tykayn
tykayn
parent
d9488e7151
commit
07c0385972
17 changed files with 230 additions and 162 deletions
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
137
index.html
137
index.html
|
|
@ -30,7 +30,17 @@
|
|||
<img class="icon-img" src="img/prise-de-courant.png" alt="prise"> Libre Charge Map
|
||||
</h1>
|
||||
</header>
|
||||
<div class="research_display">
|
||||
<div id='spinning_icon'>
|
||||
<svg id='star' width='4cm' height='4cm' viewBox='0 0 700 400' xmlns='http://www.w3.org/2000/svg'
|
||||
version='1.1'>
|
||||
<polygon fill='red' stroke='red' stroke-width='10' points='350,75 379,161 469,161 397,215
|
||||
423,301 350,250 277,301 303,215
|
||||
231,161 321,161' />
|
||||
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<main>
|
||||
|
|
@ -42,17 +52,7 @@
|
|||
<div id="zoomMessage">
|
||||
Zoomez pour voir les stations de recharge
|
||||
</div>
|
||||
<div class="research_display">
|
||||
<div id='spinning_icon'>
|
||||
<svg id='star' width='4cm' height='4cm' viewBox='0 0 700 400' xmlns='http://www.w3.org/2000/svg'
|
||||
version='1.1'>
|
||||
<polygon fill='red' stroke='red' stroke-width='10' points='350,75 379,161 469,161 397,215
|
||||
423,301 350,250 277,301 303,215
|
||||
231,161 321,161' />
|
||||
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
<div id='count_features_fond'>
|
||||
</div>
|
||||
<div id='map'>
|
||||
|
|
@ -109,66 +109,83 @@
|
|||
|
||||
|
||||
<div id="current_station_infos"></div>
|
||||
<div id="infos_carte"></div>
|
||||
<!-- <div id="infos_carte"></div> -->
|
||||
|
||||
<div id="filters">
|
||||
<!-- <h2>
|
||||
<h2>
|
||||
⚙️ Filtres:
|
||||
</h2> -->
|
||||
</h2>
|
||||
<div class="filter-group">
|
||||
<!-- TODO ajouter des filtres selon la puissance et le type de socket -->
|
||||
<p>
|
||||
<!-- <input type="checkbox" id="filter_unknown_output" checked>
|
||||
<label for="filter_unknown_output">
|
||||
Afficher les stations avec une puissance inconnue
|
||||
</label>
|
||||
<br> -->
|
||||
<!-- <input type="checkbox" id="filter_max_output" checked> -->
|
||||
<label for="filter_max_output">
|
||||
Afficher les stations avec une puissance supérieure à:
|
||||
</label>
|
||||
|
||||
<span id="filter_max_output_display">
|
||||
3 kW
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
<br>
|
||||
<!-- TODO filtrer les bornes selon la puissance -->
|
||||
|
||||
|
||||
</div>
|
||||
<div id="statsChargingStation">
|
||||
|
||||
<h2 id="toggle-stats" style="cursor: pointer;">
|
||||
🚀 Puissances des stations: 🔽
|
||||
</h2>
|
||||
|
||||
<div id="found_charging_stations">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<hr>
|
||||
<h2 class="title">
|
||||
À propos de ce plan</h2>
|
||||
<p>
|
||||
La carte thématique proposant des points de charge pour véhicule électrique, basée sur les données
|
||||
d'OpenStreetMap. Voir la documentation OSM concernant <a
|
||||
href="https://wiki.openstreetmap.org/wiki/Key:socket:*">les sockets</a> et les
|
||||
<a href="https://wiki.openstreetmap.org/wiki/FR:Tag:amenity%3Dcharging_station">
|
||||
stations de recharge pour véhicules électriques
|
||||
</a>.
|
||||
<br>
|
||||
Les analyses Osmose proposent l'intégration de stations de recharges issues de l'open data sur les IRVE de
|
||||
Data Gouv. Vous pouvez les désactiver dans les filtres de calques. Quand les stations existantes sont
|
||||
activées, seules les analyses osmoses avec un minimum de distance sont affichées.
|
||||
</p>
|
||||
<p>
|
||||
|
||||
<br>
|
||||
Fait par <a href="https://mastodon.cipherbliss.com/@tykayn">Tykayn</a> - <a
|
||||
href="https://www.cipherbliss.com">www.cipherbliss.com</a>.
|
||||
<a href="https://forge.chapril.org/tykayn/">Sources disponibles sur la forge du Chapril.</a>
|
||||
<div class="icones">
|
||||
<img class="icon-img" src="img/Type2_Connector_Outline.svg" alt="type2">
|
||||
|
||||
<img class="icon-img" src="img/type2_combo.svg" alt="prise">
|
||||
<img class="icon-img" src="img/Type2_socket.svg" alt="prise">
|
||||
<img class="icon-img" src="img/socket_typee.svg" alt="prise">
|
||||
<img class="icon-img" src="img/chademo.svg" alt="prise">
|
||||
<input type="range" min="1" max="400" value="3" class="slider" id="filter_max_output_slider">
|
||||
</div>
|
||||
<br>
|
||||
icones
|
||||
câble électrique <a href="https://www.flaticon.com/fr/icones-gratuites/energie" title="energie icônes">Energie
|
||||
icônes créées par rukanicon - Flaticon</a>
|
||||
<!-- TODO filtrer les bornes selon la puissance -->
|
||||
|
||||
</p>
|
||||
|
||||
</div>
|
||||
<div id="statsChargingStation">
|
||||
|
||||
<h2 id="toggle-stats" style="cursor: pointer;">
|
||||
🚀 Puissances des stations: 🔽
|
||||
</h2>
|
||||
|
||||
<div id="found_charging_stations">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<hr>
|
||||
<h2 class="title">
|
||||
À propos de ce plan</h2>
|
||||
<p>
|
||||
La carte thématique proposant des points de charge pour véhicule électrique, basée sur les données
|
||||
d'OpenStreetMap. Voir la documentation OSM concernant <a
|
||||
href="https://wiki.openstreetmap.org/wiki/Key:socket:*">les sockets</a> et les
|
||||
<a href="https://wiki.openstreetmap.org/wiki/FR:Tag:amenity%3Dcharging_station">
|
||||
stations de recharge pour véhicules électriques
|
||||
</a>.
|
||||
<br>
|
||||
Les analyses Osmose proposent l'intégration de stations de recharges issues de l'open data sur les IRVE de
|
||||
Data Gouv. Vous pouvez les désactiver dans les filtres de calques. Quand les stations existantes sont
|
||||
activées, seules les analyses osmoses avec un minimum de distance sont affichées.
|
||||
</p>
|
||||
<p>
|
||||
|
||||
<br>
|
||||
Fait par <a href="https://mastodon.cipherbliss.com/@tykayn">Tykayn</a> - <a
|
||||
href="https://www.cipherbliss.com">www.cipherbliss.com</a>.
|
||||
<a href="https://forge.chapril.org/tykayn/">Sources disponibles sur la forge du Chapril.</a>
|
||||
<div class="icones">
|
||||
<img class="icon-img" src="img/Type2_Connector_Outline.svg" alt="type2">
|
||||
|
||||
<img class="icon-img" src="img/type2_combo.svg" alt="prise">
|
||||
<img class="icon-img" src="img/Type2_socket.svg" alt="prise">
|
||||
<img class="icon-img" src="img/socket_typee.svg" alt="prise">
|
||||
<img class="icon-img" src="img/chademo.svg" alt="prise">
|
||||
</div>
|
||||
<br>
|
||||
icones
|
||||
câble électrique <a href="https://www.flaticon.com/fr/icones-gratuites/energie" title="energie icônes">Energie
|
||||
icônes créées par rukanicon - Flaticon</a>
|
||||
|
||||
</p>
|
||||
</div>
|
||||
|
||||
|
||||
|
|
@ -187,4 +204,4 @@
|
|||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
</html>
|
||||
|
|
@ -6,6 +6,12 @@ const lcm_config = {
|
|||
hide_osmose_markers_if_close_to_existing_charging_stations: true,
|
||||
hide_osmose_markers_if_close_to_existing_charging_stations_distance: 10, // meters
|
||||
|
||||
filter_max_output: true,
|
||||
filter_max_output_min: 1,
|
||||
filter_max_output_max: 401,
|
||||
filter_max_output_default_value: 1,
|
||||
filter_unknown_output: true,
|
||||
|
||||
max_possible_station_output: 400,
|
||||
tileServers: {
|
||||
osm: 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
|
||||
|
|
|
|||
161
js/lcm_main.js
161
js/lcm_main.js
|
|
@ -468,7 +468,7 @@ function displayStatsFromGeoJson(resultAsGeojson) {
|
|||
// Ajouter une fonction pour mettre à jour les compteurs
|
||||
function updateCounters() {
|
||||
const stationsCount = geojsondata ? geojsondata.features.length : 0;
|
||||
const osmoseText = osmoseIssuesCount > 0 ? ` (${osmoseIssuesCount} )` : '';
|
||||
const osmoseText = osmoseIssuesCount > 0 ? ` <span class="osmose-counter">(+ ${osmoseIssuesCount} ?)</span>` : '';
|
||||
$('#count_features_fond').html(`⚡${stationsCount}${osmoseText} stations`);
|
||||
}
|
||||
|
||||
|
|
@ -478,10 +478,10 @@ function bindEventsOnJosmRemote(popupElement) {
|
|||
$(popupElement).find('.edit-button.josm').each(function () {
|
||||
// Utiliser .off().on() pour éviter les liaisons multiples si la popup est rouverte
|
||||
$(this).off('click').on('click', (event) => {
|
||||
event.preventDefault(); // Empêcher le comportement par défaut du lien
|
||||
event.preventDefault();
|
||||
let josm_link = $(this).attr('data-href');
|
||||
console.log('Sending command to JOSM:', josm_link);
|
||||
// Utiliser fetch pour la requête GET vers JOSM (plus moderne que $.get)
|
||||
|
||||
fetch(josm_link)
|
||||
.then(response => {
|
||||
if (!response.ok) {
|
||||
|
|
@ -575,13 +575,27 @@ function makePopupOfFeature(feature) {
|
|||
* @param layer
|
||||
*/
|
||||
function eachFeature(feature, layer) {
|
||||
let outPowerGuessed = lcm_utils.guessOutputPowerFromFeature(feature);
|
||||
const maxPowerFilter = parseInt($('#filter_max_output').val()) || lcm_config.filter_max_output_default_value;
|
||||
|
||||
// Filtrage par puissance
|
||||
if (outPowerGuessed === 0 || outPowerGuessed === null) {
|
||||
// Gestion des stations à puissance inconnue
|
||||
if (display_unknown_max_power_station === 'hide') {
|
||||
return;
|
||||
}
|
||||
} else {
|
||||
// Filtrer les stations dont la puissance dépasse le maximum défini
|
||||
if (outPowerGuessed < maxPowerFilter) {
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
let link_josm = createJOSMEditLink(feature);
|
||||
|
||||
let popupContent = makePopupOfFeature(feature);
|
||||
layer.bindPopup(popupContent);
|
||||
|
||||
let outPowerGuessed = lcm_utils.guessOutputPowerFromFeature(feature);
|
||||
let color = lcm_color_utils.getColor(feature);
|
||||
let displayOutPowerGuessed = '? kW';
|
||||
if (outPowerGuessed) {
|
||||
displayOutPowerGuessed = outPowerGuessed + ' kW max';
|
||||
|
|
@ -613,7 +627,7 @@ function eachFeature(feature, layer) {
|
|||
<a class="edit-button josm" data-href="${link_josm}" href="#">JOSM</a>
|
||||
<a href="${panoramaxLink}" target="_blank" class="panoramax-link" title="Voir sur Panoramax">
|
||||
<img src="styles/images/panoramax.ico" alt="icone"></a>
|
||||
<span class="color-indication" style="background-color: ${color};">${displayOutPowerGuessed}</span>
|
||||
<span class="color-indication" style="background-color: ${lcm_color_utils.getColor(feature)};">${displayOutPowerGuessed}</span>
|
||||
<button class="edit-button" id="fullDetails" >détails</button>
|
||||
<span class="popup-content">${popupContent}</span>`;
|
||||
|
||||
|
|
@ -701,8 +715,8 @@ function eachFeature(feature, layer) {
|
|||
* affichage des marqueurs de stations de recharge
|
||||
*/
|
||||
let circle = L.circle(layer._latlng, {
|
||||
color: color,
|
||||
fillColor: color,
|
||||
color: lcm_color_utils.getColor(feature),
|
||||
fillColor: lcm_color_utils.getColor(feature),
|
||||
fillOpacity: opacity,
|
||||
colorOpacity: opacity,
|
||||
radius: radius
|
||||
|
|
@ -711,7 +725,7 @@ function eachFeature(feature, layer) {
|
|||
if (zoom > 15) {
|
||||
let circle_center = L.circle(layer._latlng, {
|
||||
color: 'black',
|
||||
fillColor: color,
|
||||
fillColor: lcm_color_utils.getColor(feature),
|
||||
fillOpacity: 1,
|
||||
radius: 0.1
|
||||
}).addTo(all_stations_markers);
|
||||
|
|
@ -824,7 +838,10 @@ function loadOverpassQuery() {
|
|||
|
||||
function refreshDisplay(convert_points_to_osm = false) {
|
||||
supprimerMarqueurs();
|
||||
displayPointsFromApi(geojsondata, convert_points_to_osm);
|
||||
if (geojsondata) {
|
||||
displayPointsFromApi(geojsondata, convert_points_to_osm);
|
||||
updateCounters(); // Mettre à jour les compteurs après le filtrage
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -867,7 +884,7 @@ function onMapMoveEnd() {
|
|||
console.log("Zoom actuel:", map.getZoom());
|
||||
|
||||
if (map.getZoom() >= 12) {
|
||||
console.log("Recherche des issues Osmose...");
|
||||
// console.log("Recherche des issues Osmose...");
|
||||
searchOsmoseIssues(map);
|
||||
} else {
|
||||
console.log("Zoom trop faible pour les issues Osmose");
|
||||
|
|
@ -980,6 +997,7 @@ $('#toggle-stats').on('click', function () {
|
|||
}
|
||||
});
|
||||
|
||||
|
||||
// Ajouter ces variables avec les autres déclarations globales
|
||||
let food_places_markers = L.layerGroup();
|
||||
const foodIcon = L.divIcon({
|
||||
|
|
@ -1058,7 +1076,6 @@ function searchOsmoseIssues(map) {
|
|||
const bbox = `${bounds.getWest()}%2C${bounds.getSouth()}%2C${bounds.getEast()}%2C${bounds.getNorth()}`;
|
||||
const url = `https://osmose.openstreetmap.fr/api/0.3/issues?zoom=${zoom}&item=8410%2C8411&level=1%2C2%2C3&limit=500&bbox=${bbox}`;
|
||||
|
||||
console.log("Recherche des issues Osmose (liste) avec l'URL :", url);
|
||||
osmose_markers.clearLayers();
|
||||
|
||||
// Modifier la vérification des stations existantes
|
||||
|
|
@ -1232,72 +1249,68 @@ function handleMarkerClick(marker, map) {
|
|||
|
||||
// Ajouter un écouteur d'événements pour le changement de visibilité des calques
|
||||
function init() {
|
||||
food_places_markers.addTo(map);
|
||||
$('#found_charging_stations').hide();
|
||||
$(document).ready(function () {
|
||||
food_places_markers.addTo(map);
|
||||
$('#found_charging_stations').hide();
|
||||
|
||||
// Mettre à jour le contrôle des calques
|
||||
const overlayMaps = {
|
||||
"Stations de recharge": all_stations_markers,
|
||||
"Restaurants et cafés": food_places_markers,
|
||||
"Bornes potentielles (Osmose)": osmose_markers
|
||||
};
|
||||
// Mettre à jour le contrôle des calques
|
||||
const overlayMaps = {
|
||||
"Stations de recharge": all_stations_markers,
|
||||
"Restaurants et cafés": food_places_markers,
|
||||
"Bornes potentielles (Osmose)": osmose_markers
|
||||
};
|
||||
|
||||
const overlayControl = L.control.layers(null, overlayMaps, {
|
||||
collapsed: true,
|
||||
className: 'leaflet-control-layers overlay-layers',
|
||||
id: 'overlay-layers-control'
|
||||
}).addTo(map);
|
||||
|
||||
$('#sendToJOSM').on('click', () => {
|
||||
sendToJOSM(map, geojsondata)
|
||||
.then(() => {
|
||||
console.log('Données envoyées à JOSM avec succès !');
|
||||
})
|
||||
.catch(() => {
|
||||
alert('Erreur : JOSM doit être ouvert avec l\'option "Contrôle à distance" activée');
|
||||
});
|
||||
});
|
||||
$('#josmLink').on('click', () => {
|
||||
sendToJOSM(map, geojsondata)
|
||||
.then(() => {
|
||||
console.log('Données envoyées à JOSM avec succès !');
|
||||
})
|
||||
.catch(() => {
|
||||
alert('Erreur : JOSM doit être ouvert avec l\'option de télécommande "Contrôle à distance" activée dans ses paramètres (accédez-y avec F12)');
|
||||
});
|
||||
});
|
||||
|
||||
$('#searchButton').on('click', searchLocation);
|
||||
$('#shareUrl').on('click', copyCurrentUrl);
|
||||
$('#filter_max_output').on('input', function () {
|
||||
const value = $(this).val();
|
||||
console.log('filter_max_output', value, $(this));
|
||||
$('#filter_max_output_display').text(value + ' kW');
|
||||
refreshDisplay();
|
||||
});
|
||||
$('#filter_max_output_slider').on('input', function () {
|
||||
const value = $(this).val();
|
||||
|
||||
lcm_config.filter_max_output_default_value = value;
|
||||
$('#filter_max_output_display').text(value + ' kW');
|
||||
refreshDisplay();
|
||||
});
|
||||
|
||||
|
||||
const overlayControl = L.control.layers(null, overlayMaps, {
|
||||
collapsed: true,
|
||||
className: 'leaflet-control-layers overlay-layers',
|
||||
id: 'overlay-layers-control'
|
||||
}).addTo(map);
|
||||
$('#searchResults').on('change', function () {
|
||||
const selectedIndex = $(this).eq(0).val();
|
||||
if (selectedIndex !== null) {
|
||||
const selectedPlace = $(this).find('option:selected').data('place');
|
||||
moveToLocation(selectedPlace);
|
||||
}
|
||||
});
|
||||
|
||||
$('#sendToJOSM').on('click', () => {
|
||||
sendToJOSM(map, geojsondata)
|
||||
.then(() => {
|
||||
console.log('Données envoyées à JOSM avec succès !');
|
||||
})
|
||||
.catch(() => {
|
||||
alert('Erreur : JOSM doit être ouvert avec l\'option "Contrôle à distance" activée');
|
||||
});
|
||||
});
|
||||
$('#josmLink').on('click', () => {
|
||||
sendToJOSM(map, geojsondata)
|
||||
.then(() => {
|
||||
console.log('Données envoyées à JOSM avec succès !');
|
||||
})
|
||||
.catch(() => {
|
||||
alert('Erreur : JOSM doit être ouvert avec l\'option de télécommande "Contrôle à distance" activée dans ses paramètres (accédez-y avec F12)');
|
||||
});
|
||||
});
|
||||
|
||||
$('#searchButton').on('click', searchLocation);
|
||||
$('#shareUrl').on('click', copyCurrentUrl);
|
||||
|
||||
|
||||
$('#searchResults').on('change', function () {
|
||||
const selectedIndex = $(this).val();
|
||||
if (selectedIndex !== null) {
|
||||
const selectedPlace = $(this).find('option:selected').data('place');
|
||||
moveToLocation(selectedPlace);
|
||||
}
|
||||
});
|
||||
|
||||
osmose_markers.addTo(map);
|
||||
|
||||
// Ajouter le contrôle de source de recherche
|
||||
const searchControl = `
|
||||
<div class="search-source-control">
|
||||
<label>
|
||||
<input type="checkbox" id="useAddok" checked>
|
||||
Utiliser Addok (France)
|
||||
</label>
|
||||
</div>
|
||||
`;
|
||||
$('#searchLocation').after(searchControl);
|
||||
|
||||
// Mettre à jour les marqueurs Osmose quand la visibilité des stations change
|
||||
map.on('overlayremove overlayadd', function (e) {
|
||||
if (e.name === "Stations de recharge" && map.getZoom() > 12) {
|
||||
searchOsmoseIssues(map);
|
||||
}
|
||||
osmose_markers.addTo(map);
|
||||
});
|
||||
}
|
||||
|
||||
|
|
|
|||
6
styles/_filters.scss
Normal file
6
styles/_filters.scss
Normal file
|
|
@ -0,0 +1,6 @@
|
|||
#filter_max_output_slider {
|
||||
width: 100%;
|
||||
height: 10px;
|
||||
background: #ccc;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
|
@ -6,9 +6,9 @@
|
|||
}
|
||||
|
||||
#bars_power {
|
||||
position: fixed;
|
||||
bottom: -16px;
|
||||
width: 123vw;
|
||||
position: absolute;
|
||||
top: 59.1vh;
|
||||
width: 117%;
|
||||
}
|
||||
|
||||
#toggleSidePanel {
|
||||
|
|
@ -32,7 +32,7 @@
|
|||
position: static;
|
||||
transform: none;
|
||||
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.2);
|
||||
margin: 20px 0 0;
|
||||
margin: 0;
|
||||
width: 100vw;
|
||||
}
|
||||
|
||||
|
|
@ -69,4 +69,8 @@
|
|||
right: 1.4rem;
|
||||
height: 2.6rem;
|
||||
}
|
||||
}
|
||||
|
||||
#count_features_fond {
|
||||
border: solid 1px grey;
|
||||
}
|
||||
|
|
@ -3,6 +3,11 @@
|
|||
background-color: #9F2BFF;
|
||||
}
|
||||
|
||||
.osmose-counter {
|
||||
font-size: 0.85rem;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.proposed-tags-container {
|
||||
max-height: 200px;
|
||||
overflow-y: auto;
|
||||
|
|
|
|||
|
|
@ -6,6 +6,10 @@ overrides leaflet
|
|||
margin-left: 2rem;
|
||||
}
|
||||
|
||||
.leaflet-interactive {
|
||||
border: solid 3px white;
|
||||
}
|
||||
|
||||
/* Styles pour les contrôles de couches */
|
||||
.leaflet-control-layers {
|
||||
&.base-layers {
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
#searchLocation {
|
||||
width: 80%;
|
||||
width: 88%;
|
||||
|
||||
padding: 10px;
|
||||
margin-bottom: 10px;
|
||||
|
|
@ -18,8 +18,8 @@
|
|||
}
|
||||
|
||||
#searchButton {
|
||||
margin-right: 1rem;
|
||||
margin-top: -2.8rem;
|
||||
margin-right: 0rem;
|
||||
margin-top: -4.8rem;
|
||||
}
|
||||
|
||||
#count_features_fond {
|
||||
|
|
|
|||
|
|
@ -222,13 +222,14 @@ a {
|
|||
|
||||
svg {
|
||||
position: fixed;
|
||||
top: 0.5rem;
|
||||
right: 3rem;
|
||||
top: 0.45rem;
|
||||
left: 1.5rem;
|
||||
background: white;
|
||||
border-radius: 100%;
|
||||
width: 3rem;
|
||||
height: 3rem;
|
||||
animation: spin 2s linear infinite;
|
||||
opacity: 0.3;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -389,9 +390,6 @@ button {
|
|||
padding: 0.25rem;
|
||||
}
|
||||
|
||||
.leaflet-interactive {
|
||||
border: solid 3px white;
|
||||
}
|
||||
|
||||
#infos_carte {
|
||||
padding: 1rem 0;
|
||||
|
|
@ -655,7 +653,8 @@ header {
|
|||
|
||||
@import '_osmose.scss';
|
||||
@import '_recherche.scss';
|
||||
@import '_filters.scss';
|
||||
@import '_mobile.scss';
|
||||
@import '_overrides.scss';
|
||||
@import '_responsive.scss';
|
||||
@import '_animations.scss';
|
||||
@import '_animations.scss';
|
||||
|
|
@ -175,13 +175,14 @@ a {
|
|||
font-size: 2rem; }
|
||||
#spinning_icon svg {
|
||||
position: fixed;
|
||||
top: 0.5rem;
|
||||
right: 3rem;
|
||||
top: 0.45rem;
|
||||
left: 1.5rem;
|
||||
background: white;
|
||||
border-radius: 100%;
|
||||
width: 3rem;
|
||||
height: 3rem;
|
||||
animation: spin 2s linear infinite; }
|
||||
animation: spin 2s linear infinite;
|
||||
opacity: 0.3; }
|
||||
|
||||
#footer {
|
||||
max-width: 70ch;
|
||||
|
|
@ -311,9 +312,6 @@ button {
|
|||
border-radius: 1rem;
|
||||
padding: 0.25rem; }
|
||||
|
||||
.leaflet-interactive {
|
||||
border: solid 3px white; }
|
||||
|
||||
#infos_carte {
|
||||
padding: 1rem 0; }
|
||||
|
||||
|
|
@ -514,6 +512,10 @@ header {
|
|||
animation: bounce 0.5s ease infinite;
|
||||
background-color: #9F2BFF; }
|
||||
|
||||
.osmose-counter {
|
||||
font-size: 0.85rem;
|
||||
color: #999; }
|
||||
|
||||
.proposed-tags-container {
|
||||
max-height: 200px;
|
||||
overflow-y: auto;
|
||||
|
|
@ -551,7 +553,7 @@ header {
|
|||
color: white; }
|
||||
|
||||
#searchLocation {
|
||||
width: 80%;
|
||||
width: 88%;
|
||||
padding: 10px;
|
||||
margin-bottom: 10px;
|
||||
border: 1px solid var(--button-border);
|
||||
|
|
@ -566,8 +568,8 @@ header {
|
|||
border-color: var(--button-border); }
|
||||
|
||||
#searchButton {
|
||||
margin-right: 1rem;
|
||||
margin-top: -2.8rem; }
|
||||
margin-right: 0rem;
|
||||
margin-top: -4.8rem; }
|
||||
|
||||
#count_features_fond {
|
||||
position: fixed;
|
||||
|
|
@ -592,6 +594,12 @@ header {
|
|||
border: 0;
|
||||
border-radius: 3px; }
|
||||
|
||||
#filter_max_output_slider {
|
||||
width: 100%;
|
||||
height: 10px;
|
||||
background: #ccc;
|
||||
border-radius: 5px; }
|
||||
|
||||
/* Style pour mobile ---------------------------------- */
|
||||
@media (max-width: 1200px) {
|
||||
header h1 {
|
||||
|
|
@ -599,9 +607,9 @@ header {
|
|||
font-size: 1.5rem; }
|
||||
|
||||
#bars_power {
|
||||
position: fixed;
|
||||
bottom: -16px;
|
||||
width: 123vw; }
|
||||
position: absolute;
|
||||
top: 59.1vh;
|
||||
width: 117%; }
|
||||
|
||||
#toggleSidePanel {
|
||||
position: fixed;
|
||||
|
|
@ -622,7 +630,7 @@ header {
|
|||
position: static;
|
||||
transform: none;
|
||||
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.2);
|
||||
margin: 20px 0 0;
|
||||
margin: 0;
|
||||
width: 100vw; }
|
||||
|
||||
.side-panel.active {
|
||||
|
|
@ -652,12 +660,18 @@ header {
|
|||
top: -4.9rem;
|
||||
right: 1.4rem;
|
||||
height: 2.6rem; } }
|
||||
#count_features_fond {
|
||||
border: solid 1px grey; }
|
||||
|
||||
/**
|
||||
overrides leaflet
|
||||
*/
|
||||
.leaflet-left .leaflet-control {
|
||||
margin-left: 2rem; }
|
||||
|
||||
.leaflet-interactive {
|
||||
border: solid 3px white; }
|
||||
|
||||
/* Styles pour les contrôles de couches */
|
||||
.leaflet-control-layers.base-layers {
|
||||
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M2 9l10-5 10 5-10 5-10-5zm0 6l10 5 10-5M2 12l10 5 10-5"/></svg>');
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
Loading…
Add table
Add a link
Reference in a new issue