bachir/drupal-erable
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

nouvelles cartes projet + quelques corrections

Browse Source
This commit is contained in:
Valentin Le Moign
2025-02-03 23:23:52 +01:00
parent d912155cd0
commit 1a22f4c4c3
16 changed files with 241 additions and 224 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
web/autoload.php
View File

@@ -10,7 +10,6 @@
* @see index.php
* @see core/install.php
* @see core/rebuild.php
* @see core/modules/statistics/statistics.php
*/
return require __DIR__ . '/../vendor/autoload.php';

2
web/profiles/drupal-starterkit-profile

Submodule web/profiles/drupal-starterkit-profile updated: 0072fa85fb...6122ad5f5b

43
web/themes/erabletheme/css/styles.css
View File

@@ -776,6 +776,9 @@ em {
padding: 5px 3vw;
padding-left: 0 !important;
}
.views-row article.actu-teaser .preview_sous_titre .sous_titre {
line-height: 1.3 !important;
}
@media (min-width: 760px) {
.views-row article.actu-teaser .preview_sous_titre {
padding-left: unset;
@@ -1386,11 +1389,15 @@ main.main-login .login > div > div:not(.hidden) form .button:hover, main.main-lo
margin-bottom: 1rem;
}
.layout-content .fullpage .fullpage_content .sous_titre {
font-size: 1.2rem;
padding: 0 3vw;
font-family: "Marianne", sans-serif;
font-size: 1rem;
line-height: 1.4;
font-family: "Barlow", sans-serif;
color: black;
font-size: 1.2rem;
}
@media (min-width: 760px) {
.layout-content .fullpage .fullpage_content .sous_titre {
font-size: 1.6rem;
}
}
.layout-content .fullpage .fullpage_content p {
padding: 0 3vw;
@@ -1861,6 +1868,16 @@ aside.layout-sidebar-first:has(#block-erabletheme-views-block-projets-block-1) >
}
}
*/
.content_partenaires header {
font-family: "Marianne", sans-serif;
font-size: 1rem;
line-height: 1.4;
margin-bottom: 4vh;
margin-top: -5vh;
}
.content_partenaires header p {
margin: 1rem 3vw;
}
.content_partenaires .views-row {
margin-bottom: 2vh;
}
@@ -2956,25 +2973,31 @@ aside.layout-sidebar-first:has(#block-erabletheme-views-block-projets-block-1) >
margin: 0 3vw;
margin-top: 4rem;
}
.fullpage.projet_full .carte > div > div:first-of-type {
display: none;
}
.fullpage.projet_full .carte .leaflet-pane path {
stroke: #00ff80;
stroke-width: 2;
fill: #00ff80;
fill-opacity: 0.2;
}
.fullpage.projet_full .carte #leaflet-popup {
position: fixed;
.fullpage.projet_full .carte .popup .leaflet-popup-tip {
background: rgba(0, 0, 0, 0) !important;
box-shadow: none !important;
}
.fullpage.projet_full .carte .popup .leaflet-popup-content-wrapper {
padding: 0.3rem 0.8rem;
background-color: white;
font-size: 0.8rem !important;
opacity: 0;
transition: opacity 0.3s ease;
box-shadow: none;
border-radius: unset;
font-family: "Marianne", sans-serif;
font-size: 1rem;
line-height: 1.4;
}
.fullpage.projet_full .libelles-carte {
display: none;
.fullpage.projet_full .carte .popup .leaflet-popup-content-wrapper .leaflet-popup-content {
margin: 0;
}
.fullpage.projet_full .legende-carte > div > div:first-of-type {
display: none;

2
web/themes/erabletheme/css/styles.css.map
View File

File diff suppressed because one or more lines are too long

148
web/themes/erabletheme/js/erabletheme.js
View File

@@ -335,10 +335,10 @@
//
document.querySelectorAll('p, li, h1, h2, h3, h4, h5, h6').forEach((content) => {
content.innerHTML = content.innerHTML.replaceAll(' ;', ' ');
content.innerHTML = content.innerHTML.replaceAll(' :', ' ');
content.innerHTML = content.innerHTML.replaceAll(' ?', ' ');
content.innerHTML = content.innerHTML.replaceAll(' !', ' ');
content.innerHTML = content.innerHTML.replaceAll(' ;', ' ;');
content.innerHTML = content.innerHTML.replaceAll(' :', ' :');
content.innerHTML = content.innerHTML.replaceAll(' ?', ' ?');
content.innerHTML = content.innerHTML.replaceAll(' !', ' !');
content.innerHTML = content.innerHTML.replaceAll('« ', '« ');
content.innerHTML = content.innerHTML.replaceAll(' »', ' »');
content.innerHTML = content.innerHTML.replaceAll('(« ', '(« ');
@@ -393,58 +393,114 @@
}
}
let firstMap = null;
Drupal.behaviors.customLeafletInteraction = {
attach: function (context, settings) {
$(context).on('leafletMapInit', function (e, settings, map, mapid, markers) {
//
// on projects pages, replace leaflet icons with erable leafs
//
const leafletIcons = document.querySelectorAll('.leaflet-marker-pane img');
for (let icon of leafletIcons) {
icon.setAttribute('src', '/themes/erabletheme/assets/leaf.svg');
}
//
// set hover on leaflet marker and zones
//
if (document.querySelector('.projet_full')) {
// map on the projects page
const leafletPlaces = document.querySelectorAll('.leaflet-marker-pane img, .leaflet-overlay-pane path');
const libelles = document.querySelectorAll('.libelles-carte > div > div > div');
let customIcon = L.icon({
iconUrl: '/themes/erabletheme/assets/leaf.svg',
iconSize: [20, 20],
iconAnchor: [10, 20],
popupAnchor: [0, -20]
});
for (let i = 0; i < leafletPlaces.length; i++) {
const carte = document.querySelector('.carte');
let initiatedMap = document.querySelector(`#${mapid}`);
const currentLibelle = initiatedMap.parentElement.nextElementSibling.innerText;
initiatedMap.parentElement.nextElementSibling.remove();
if (document.querySelectorAll('.leaflet-container').length <= 1) {
firstMap = map;
let bounds = L.latLngBounds();
map.eachLayer(function (layer) {
if (layer instanceof L.Marker && !layer._popup) {
layer.bindPopup(currentLibelle, { closeButton: false, className: 'popup' })
.setIcon(customIcon)
.on('mouseover', function () {
this.openPopup();
})
.on('mouseout', function () {
this.closePopup();
});
leafletPlaces[i].addEventListener('mouseenter', () => {
let div = document.createElement('div');
div.setAttribute('id', 'leaflet-popup');
div.style.zIndex = '100';
const x = leafletPlaces[i].getBoundingClientRect().left + leafletPlaces[i].getBoundingClientRect().width / 2;
const y = leafletPlaces[i].getBoundingClientRect().top;
setTimeout(() => {
div.style.opacity = 1;
const divHeight = div.getBoundingClientRect().height;
const divWidth = div.getBoundingClientRect().width;
bounds.extend(layer.getLatLng());
map.fitBounds(bounds, { padding: [30, 30], maxZoom: 18 });
}
});
} else {
// map on the projects index
document.querySelector(`#${mapid}`).parentElement.parentElement.parentElement.remove();
const firstMarker = Object.values(markers)[0];
let newMarker = L.marker([firstMarker._latlng.lat, firstMarker._latlng.lng], { icon: customIcon })
.addTo(firstMap)
.bindPopup(currentLibelle, { closeButton: false, className: 'popup' })
.on('mouseover', function () {
this.openPopup();
})
.on('mouseout', function () {
this.closePopup();
});
firstMap.fitBounds(
firstMap.getBounds().extend(newMarker.getLatLng()),
{ padding: [30, 30], maxZoom: 18 }
);
}
} else {
//
// on projects pages, replace leaflet icons with erable leafs
//
const currentMap = document.querySelector('.leaflet-container');
const leafletIcons = document.querySelectorAll('.leaflet-marker-pane img');
for (let icon of leafletIcons) {
icon.setAttribute('src', '/themes/erabletheme/assets/leaf.svg');
}
//
// set hover on leaflet marker and zones
//
const leafletPlaces = document.querySelectorAll('.leaflet-marker-pane img, .leaflet-overlay-pane path');
const libelles = document.querySelectorAll('.libelles-carte > div > div > div');
for (let i = 0; i < leafletPlaces.length; i++) {
const carte = document.querySelector('.carte');
leafletPlaces[i].addEventListener('mouseenter', () => {
let div = document.createElement('div');
div.setAttribute('id', 'leaflet-popup');
div.style.zIndex = '100';
const x = leafletPlaces[i].getBoundingClientRect().left + leafletPlaces[i].getBoundingClientRect().width / 2;
const y = leafletPlaces[i].getBoundingClientRect().top;
setTimeout(() => {
div.style.left = `${x - divWidth / 2}px`;
div.style.top = `${y - divHeight}px`;
div.style.opacity = 1;
const divHeight = div.getBoundingClientRect().height;
const divWidth = div.getBoundingClientRect().width;
setTimeout(() => {
div.style.left = `${x - divWidth / 2}px`;
div.style.top = `${y - divHeight}px`;
}, 10);
}, 10);
}, 10);
div.innerText = libelles[i].innerText;
carte.appendChild(div);
});
leafletPlaces[i].addEventListener('mouseleave', () => {
let divs = document.querySelectorAll('#leaflet-popup');
for (let div of divs) {
div.style.opacity = 0;
setTimeout(() => {
div.remove();
}, 300);
}
});
div.innerText = libelles[i].innerText;
carte.appendChild(div);
});
leafletPlaces[i].addEventListener('mouseleave', () => {
let divs = document.querySelectorAll('#leaflet-popup');
for (let div of divs) {
div.style.opacity = 0;
setTimeout(() => {
div.remove();
}, 300);
}
});
}
}
});
}
}

3
web/themes/erabletheme/scss/_fullpage.scss
View File

@@ -27,9 +27,8 @@
}
.sous_titre {
font-size: $l_font_size;
padding: 0 $x_margin;
@include main_text_content();
@include sous_titre_alt();
}
p {

8
web/themes/erabletheme/scss/_partenaires.scss
View File

@@ -1,4 +1,12 @@
.content_partenaires {
header {
@include main_text_content();
margin-bottom: 4vh;
margin-top: -5vh;
p {
margin: 1rem $x_margin;
}
}
.views-row {
margin-bottom: 2vh;
article {

30
web/themes/erabletheme/scss/_projets.scss
View File

@@ -307,6 +307,9 @@
width: auto;
margin: 0 $x_margin;
margin-top: 4rem;
> div > div:first-of-type {
display: none;
}
.leaflet-pane {
path {
stroke: $fluo_green;
@@ -315,19 +318,24 @@
fill-opacity: 0.2;
}
}
#leaflet-popup {
position: fixed;
padding: 0.3rem 0.8rem;
background-color: white;
font-size: $sm_font_size !important;
opacity: 0;
transition: opacity 0.3s ease;
@include main_text_content();
.popup {
.leaflet-popup-tip {
background: rgba(0, 0, 0, 0) !important;
box-shadow: none !important;
}
.leaflet-popup-content-wrapper {
padding: 0.3rem 0.8rem;
background-color: white;
font-size: $sm_font_size !important;
box-shadow: none;
border-radius: unset;
@include main_text_content();
.leaflet-popup-content {
margin: 0;
}
}
}
}
.libelles-carte {
display: none;
}
.legende-carte {
> div > div:first-of-type {
display: none;

3
web/themes/erabletheme/scss/partials/_articles_teaser.scss
View File

@@ -47,6 +47,9 @@
font-size: $m_font_size;
padding: 5px $x_margin;
padding-left: 0 !important;
.sous_titre {
line-height: 1.3 !important;
}
@media (min-width: $breakpoint_tablet) {
padding-left: unset;
font-size: $l_font_size;