Skip to content

Commit

Permalink
chore(css): layer catalogue + fix(position): comportement bizarre du …
Browse files Browse the repository at this point in the history
…bouton
  • Loading branch information
azarz committed Nov 28, 2023
1 parent 0d7ac31 commit 4aa8830
Show file tree
Hide file tree
Showing 11 changed files with 90 additions and 156 deletions.
66 changes: 4 additions & 62 deletions src/css/assets/location-fixed.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
67 changes: 5 additions & 62 deletions src/css/assets/location-follow.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
2 changes: 1 addition & 1 deletion src/css/assets/selected-layer.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
75 changes: 57 additions & 18 deletions src/css/layer-catalogue.css
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,13 @@
}

#layerManagerWindow h4 {
padding: 0 30px 5px;
margin: 0 0 10px 0;
font-family: "Open Sans Semibold";
font-size: 1.1em;
}

#layer-thematics {
width: 100%;
}

.layer-thematics {
Expand All @@ -26,31 +31,52 @@
margin: auto;
}


.baseLayer .layerImg{
width: 112.5px;
}

.subCatMenu .baseLayer .layerImg img{
width: 112.5px;
height: 75px;
}

.layer-title-thematic,
.layer-title {
font-family: "Open Sans";
font-size: 11px;
font-style: normal;
font-weight: 600;
line-height: normal;
color: #091625;
display: flex;
justify-content: center;
text-align: left
}

.layer-title-thematic {
color: #26a581;
font-weight: 600;
}

#layerManagerWindow .subCatMenu {
#layerManagerWindow #thematicLayers {
text-align: center;
margin: 0 15px 0 15px;
margin: 0;
display: grid;
flex-wrap: wrap;
justify-content: space-evenly;
justify-content: space-between;
grid-template-columns: 26% 26% 26%;
}

#baseLayers {
display: flex;
flex-direction: row;
justify-content: flex-start;
overflow-x: scroll;
scrollbar-width: none; /* Firefox */
}

#baseLayers::-webkit-scrollbar {
display: none;
}

.selectedLayer .layer-badge {
position: absolute;
width: 18px;
Expand All @@ -59,6 +85,8 @@
right: 10px;
background-repeat: no-repeat;
background-image: url("assets/selected-layer.svg");
border: 2px solid white;
border-radius: 50%;
}

.selectedLayer img {
Expand All @@ -71,7 +99,16 @@
box-sizing: border-box;
}

.subCatMenu .layer {
#baseLayers .layer {
display: inline-block;
padding-bottom: 1em;
position: relative;
flex-shrink: 0;
width: 112.5px;
margin-right: 12px;
}

#thematicLayers .layer {
display: inline-block;
padding-bottom: 1em;
width: 100%;
Expand All @@ -90,7 +127,6 @@
}

.subCatButton {
padding: 0 30px 5px;
margin: 0 0 10px 0;
position: relative;
overflow-x: scroll;
Expand All @@ -105,24 +141,27 @@
display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
/* Hide scrollbar and Firefox */
.subCatButton {
-ms-overflow-style: none; /* IE and Edge */
scrollbar-width: none; /* Firefox */
}

.thematic-button-active {
color: #26a581;
border-color: #26a581;
}

.thematicButton {
display: block;
border: 1px solid #ccc;
background-color: #ffffff;
border: 1px solid #3F4A55;
color: #3F4A55;
background-color: #fff0;
border-radius: 50px;
padding: 10px;
cursor: pointer;
text-align: center;
white-space: nowrap;
margin-right: 10px;
font-family: "Open Sans Semibold";
font-size: 0.8em
}

.thematic-button-active {
color: #26a581;
border-color: #26a581;
}
10 changes: 4 additions & 6 deletions src/css/layer-manager.css
Original file line number Diff line number Diff line change
@@ -1,7 +1,3 @@
div#layerManagerWindowClose {
top: -10px;
}

#layer-thematics-number,
#layer-switcher-number {
display: inline-block;
Expand All @@ -11,9 +7,11 @@ div#layerManagerWindowClose {
text-align: center;
font-size: 0.9em;
margin: auto;
border-radius: 50%;
background-color: #00b798;
border-radius: 50px;
background-color: #26A581;
color: #fff;
font-family: "Open Sans";
padding: 3px 5px;
}

.layer-tabs-wrap {
Expand Down
5 changes: 5 additions & 0 deletions src/css/my-position.css
Original file line number Diff line number Diff line change
Expand Up @@ -72,7 +72,12 @@
padding-bottom: 10px;
border-bottom: 1px solid #DDE1E6;
overflow-x: scroll;
scrollbar-width: none; /* Firefox */
}
.divPositionButtons::-webkit-scrollbar {
display: none;
}

#positionShare {
}
.lblPositionImg {
Expand Down
1 change: 0 additions & 1 deletion src/html/tabs/layermanagerWindow.html
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
<div class="d-none" id="layerManagerWindow">
<div id="layerManagerWindowClose" class="windowClose"></div>
<div class="layer-tabs-wrap">
<!-- panneau des couches thematiques actif par defaut -->
<input class="layer-tabs-input" name="layer-tabs" type="radio" id="layer-thematics-tab" checked="checked"/>
Expand Down
5 changes: 2 additions & 3 deletions src/js/map-buttons-listeners.js
Original file line number Diff line number Diff line change
Expand Up @@ -13,8 +13,7 @@ const addListeners = () => {
const map = Globals.map;
if (Location.isTrackingActive()){
// De tracking a simple suivi de position
Location.locationOnOff();
Location.locationOnOff();
Location.disableTracking();
}
map.setBearing(Math.round((map.getBearing() % 360) + 360 ) % 360);

Expand Down Expand Up @@ -44,7 +43,7 @@ const addListeners = () => {

// Bouton Comparaison de carte
DOM.$sideBySideBtn.addEventListener("click", () => { Globals.compare.toggle(); });

// Bouton du gestionnaire de couches
DOM.$layerManagerBtn.addEventListener("click", () => { Globals.menu.open("layerManager"); });

Expand Down
3 changes: 1 addition & 2 deletions src/js/map-listeners.js
Original file line number Diff line number Diff line change
Expand Up @@ -24,8 +24,7 @@ const addListeners = () => {
return
} else if (Location.isTrackingActive()){
// De tracking a simple suivi de position
Location.locationOnOff();
Location.locationOnOff();
Location.disableTracking();
}
});

Expand Down
1 change: 0 additions & 1 deletion src/js/nav.js
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,6 @@ class MenuNavigation {
document.getElementById("myaccountWindowClose").addEventListener('click', () => { this.close("myaccount"); });
document.getElementById("myaccount").addEventListener('click', () => { this.open("myaccount"); });
// Gestionnaire des couches
document.getElementById("layerManagerWindowClose").addEventListener('click', () => { this.close("layerManager"); });
document.getElementById("infoWindowClose").addEventListener('click', () => { this.close('info')});
document.getElementById("legendWindowClose").addEventListener('click', () => { this.close('legend')});
document.getElementById("informationsWindowClose").addEventListener('click', () => { this.close('informations')});
Expand Down
11 changes: 11 additions & 0 deletions src/js/services/location.js
Original file line number Diff line number Diff line change
Expand Up @@ -227,6 +227,16 @@ const getLocation = async (tracking) => {
return results;
}

const disableTracking = () => {
DOM.$geolocateBtn.style.backgroundImage = 'url("' + LocationFixeImg + '")';
tracking_active = false;
Toast.show({
text: "Suivi de position activé",
duration: "short",
position: "bottom"
});
}

const isLocationActive = () => {
return location_active;
}
Expand All @@ -244,4 +254,5 @@ export default {
locationOnOff,
getOrientation,
getLocation,
disableTracking,
}

0 comments on commit 4aa8830

Please sign in to comment.