Skip to content

Commit

Permalink
fix(ios): display bugs
Browse files Browse the repository at this point in the history
  • Loading branch information
@azarz
azarz committed Dec 1, 2023
1 parent 773ed3c commit c222688
Show file tree
Hide file tree
Showing 12 changed files with 34 additions and 32 deletions.
4 changes: 2 additions & 2 deletions ios/App/App.xcodeproj/project.pbxproj
View file
Original file line number Diff line number Diff line change
Expand Up @@ -346,7 +346,7 @@
buildSettings = {
ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
CODE_SIGN_STYLE = Automatic;
CURRENT_PROJECT_VERSION = 2.90;
CURRENT_PROJECT_VERSION = 2.90.1;
INFOPLIST_FILE = App/Info.plist;
IPHONEOS_DEPLOYMENT_TARGET = 13.0;
LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
Expand All @@ -366,7 +366,7 @@
buildSettings = {
ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
CODE_SIGN_STYLE = Automatic;
CURRENT_PROJECT_VERSION = 2.90;
CURRENT_PROJECT_VERSION = 2.90.1;
INFOPLIST_FILE = App/Info.plist;
IPHONEOS_DEPLOYMENT_TARGET = 13.0;
LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
Expand Down
2 changes: 1 addition & 1 deletion src/css/alt-menu.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,7 @@
#altMenuContainer {
z-index: 3001;
height: auto;
top: 68px;
top: calc(68px + env(safe-area-inset-top));
display: flex;
width: 100%;
position: absolute
Expand Down
1 change: 1 addition & 0 deletions src/css/directions.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@
* compute
*/
.btnDirectionsCompute {
appearance: unset; /* for ios */
display: block;
margin: auto;
border: none;
Expand Down
1 change: 1 addition & 0 deletions src/css/isochrone.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,7 @@
* compute
*/
.btnIsochroneCompute {
appearance: unset; /* for ios */
display: block;
margin: auto;
border: none;
Expand Down
24 changes: 12 additions & 12 deletions src/css/map-buttons.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,8 @@
width: 20px;
height: 20px;
z-index: 3001;
top: 10px;
left: 10px;
top: calc(10px + env(safe-area-inset-top));
left: calc(10px + env(safe-area-inset-left));
background-image: url("assets/back.svg");
background-position: center;
background-repeat: no-repeat;
Expand All @@ -37,43 +37,43 @@
#layerManagerBtn {
background-image: url("assets/layers.svg");
position: absolute;
bottom: 180px;
bottom: calc(180px + env(safe-area-inset-bottom));
}

#geolocateBtn {
background-image: url("assets/localisation.svg");
position: absolute;
bottom: 130px;
bottom: calc(130px + env(safe-area-inset-bottom));
}

#sideBySideBtn {
background-image: url("assets/compare.svg");
position: absolute;
left: 15px;
bottom: 130px;
bottom: calc(130px + env(safe-area-inset-bottom));
}

#compassBtn {
background-image: url("assets/compass.svg");
position: absolute;
bottom: 225px;
bottom: calc(225px + env(safe-area-inset-bottom));
}

@media (min-width: 615px), screen and ((min-aspect-ratio: 1/1) and (min-width:400px)) {
@media (min-width: 615px), screen and (min-aspect-ratio: 1/1) and (min-width:400px) {
#layerManagerBtn {
bottom: 65px;
bottom: calc(65px + env(safe-area-inset-bottom));
}

#geolocateBtn {
bottom: 15px;
bottom: calc(15px + env(safe-area-inset-bottom));
}

#sideBySideBtn {
left: 90px;
bottom: 65px;
left: calc(90px + env(safe-area-inset-left));
bottom: calc(65px + env(safe-area-inset-bottom));
}

#compassBtn {
top: 15px;
top: calc(15px + env(safe-area-inset-top));
}
}
6 changes: 3 additions & 3 deletions src/css/map.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@

/* Map */
.map {
height: calc(100vh - 78px);
height: calc(100vh - 78px - env(safe-area-inset-bottom));
width: 100vw;
flex-grow: 1;
position: fixed;
Expand All @@ -46,10 +46,10 @@
flex-direction: column;
}

@media (min-width: 615px), screen and ((min-aspect-ratio: 1/1) and (min-width:400px)) {
@media (min-width: 615px), screen and (min-aspect-ratio: 1/1) and (min-width:400px) {
#map {
height: 100vh;
width: calc(100vw - 75px);
width: calc(100vw - 75px - env(safe-area-inset-left));
right: 0;
}
}
4 changes: 2 additions & 2 deletions src/css/media-queries.css
View file
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
/* mode paysage et écrans larges */
@media (min-width: 615px), screen and ((min-aspect-ratio: 1/1) and (min-width:400px)) {
@media (min-width: 615px), screen and (min-aspect-ratio: 1/1) and (min-width:400px) {
#tabContainer {
width: 50%;
height: fit-content;
top: 100%;
left: 75px;
left: calc(75px + env(safe-area-inset-left));
}
}
11 changes: 5 additions & 6 deletions src/css/nav.css
View file
Original file line number Diff line number Diff line change
@@ -1,10 +1,9 @@
#navContainer {
display: flex;
position: absolute;
bottom: 0px;
top: calc(100% - 78px);
top: calc(100% - 78px - env(safe-area-inset-bottom));
width: 100%;
height: 60px;
height: calc(60px + env(safe-area-inset-bottom));
font-size: 12px;
background-color: white;
padding: 10px 0px 8px 0px;
Expand Down Expand Up @@ -78,7 +77,7 @@
.subnav {
position: absolute;
background-color: #f4f6f8;
bottom: 78px;
bottom: calc(78px + env(safe-area-inset-bottom));
left: -100%;
transition: transform 0.2s;
transition-timing-function: ease-out;
Expand Down Expand Up @@ -178,12 +177,12 @@
background-image: url(../html/img/tracer.svg);
}

@media (min-width: 615px), screen and ((min-aspect-ratio: 1/1) and (min-width:400px)) {
@media (min-width: 615px), screen and (min-aspect-ratio: 1/1) and (min-width:400px) {
#navContainer {
flex-direction: column;
width: 75px;
height: 100vh;
left: 0;
left: env(safe-area-inset-left);
top: 0;
box-sizing: border-box;
}
Expand Down
6 changes: 3 additions & 3 deletions src/css/search.css
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
#searchContainer {
position: fixed;
top: 0;
top: env(safe-area-inset-top);
width: 100%;
z-index: 3000;
height: 40px;
Expand Down Expand Up @@ -139,9 +139,9 @@
background-image: url("assets/close.svg");
}

@media (min-width: 615px), screen and ((min-aspect-ratio: 1/1) and (min-width:400px)) {
@media (min-width: 615px), screen and (min-aspect-ratio: 1/1) and (min-width:400px) {
#searchContainer {
width: 40%;
left: 85px;
left: calc(85px + env(safe-area-inset-left));
}
}
2 changes: 1 addition & 1 deletion src/css/tabs.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@
/* Bottom menu */
#tabContainer {
position: absolute;
top: calc(100% - 78px);
top: calc(100% - 78px - env(safe-area-inset-bottom));
height: fit-content;
width: 100%;
background-color: #f4f6f8;
Expand Down
2 changes: 1 addition & 1 deletion src/html/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
<meta charset="utf-8">
<meta name="format-detection" content="telephone=no">
<meta name="msapplication-tap-highlight" content="no">
<meta name="viewport" content="initial-scale=1, width=device-width, viewport-fit=cover">
<meta name="viewport" content="initial-scale=1, width=device-width, viewport-fit=cover, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<link rel="shortcut icon" type="image/x-icon" href="img/favicon.png">

<title>Géoportail</title>
Expand Down
3 changes: 2 additions & 1 deletion src/js/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -143,7 +143,8 @@ function app() {
// Initialisation du menu de navigation
Globals.menu = new MenuNavigation();
Globals.menu.show();

// HACK: Nécessaire pour iOS qui ne met pas à jour la taille de l'écran au lancement...
setTimeout(() => Globals.map.resize(), 100);
}

app();

0 comments on commit c222688

Please sign in to comment.