midgard/MapComplete
1
0
Fork 0
forked from MapComplete/MapComplete
Code Pull requests Activity

Add fruit tree theme prototype; cleanup and split of the mobile layout (fix #120), allow overzoom on baselayers (fix #97)

Browse source
This commit is contained in:
Pieter Vander Vennet 2020-09-24 00:33:23 +02:00
parent d7083131a1
commit ca5b4297b3
6 changed files with 265 additions and 167 deletions
Download patch file Download diff file Expand all files Collapse all files

164
index.css
View file

@ -24,7 +24,6 @@ body {
cursor: pointer;
width: 43px;
height: 43px;
display: none; /*Hidden by default, only visible on mobile*/
}
#geolocate-button img {
@ -188,12 +187,6 @@ body {
padding-bottom: 0.2em;
}
#hidden-on-mobile {
display: none; /*Only shown on small screens - this is probably named wrongly*/
}
.add-popup-all-buttons {
max-height: 50vh;
display: inline-block;
@ -201,61 +194,6 @@ body {
width: 100%;
}
@media only screen and (max-height: 600px) and (not (max-width:700px)) {
/* Landscape and portrait */
#topleft-tools {
padding: 0.1em 0.1em 0.1em unset;
}
.hidden-on-mobile {
display: none !important;
}
#userbadge-and-search {
position: relative;
display: inline-block;
width: auto;
max-width: 50vw;
margin: 0;
}
#userbadge {
position: fixed;
right: 0.3em;
width: min-content;
max-width: 50vw;
margin: 0;
padding: 0;
}
}
@media only screen and (max-width: 600px) {
/* Portrait */
#userbadge-and-search {
display: inline-block;
width: auto;
max-width: 100vw;
}
.hidden-on-mobile {
display: none !important;
}
#topleft-tools {
padding: 0.2em !important;
padding-top: 0.3em !important;
}
#userbadge {
margin-bottom: 0.3em;
}
}
/**************************************/
@ -365,108 +303,6 @@ body {
}
@media only screen and (max-width: 600px), only screen and (max-height: 600px) {
#hidden-on-mobile {
display: block;
}
.hidden-on-mobile {
display: none !important;
}
#messagesbox-wrapper {
display: none;
}
#messagesbox {
display: none;
}
#help-button-mobile{
display: unset;
pointer-events: all;
}
#help-button-mobile div {
box-shadow: 0 0 10px #0006;
margin-bottom: 10px;
}
#geolocate-button {
display: block;
}
.leaflet-popup {
/* Popups are hidden on mobile */
display: none;
}
#centermessage {
top: 30%;
left: 15%;
width: 60%;
}
.add-popup-all-buttons {
max-height: calc(100vh - 12em);
height: min-content;
display: inline-block;
overflow-y: auto;
width: 100%;
}
#messagesboxmobile {
display: block;
position: absolute;
z-index: 10000;
background-color: white;
}
#welcomeMessage {
display: inline-block;
background-color: white;
border-radius: 0;
width: 100%;
max-width: 100%;
margin: 0;
padding: 0;
box-sizing: border-box;
max-height: max-content;
box-shadow: unset;
overflow-y: unset;
}
}
@media only screen and (max-height: 400px) {
/* Landscape: small 'to the map' */
#hidden-on-mobile {
display: unset;
}
.hidden-on-mobile {
display: none !important;
}
#messagesboxmobile {
position: absolute;
display: block;
z-index: 10000;
padding-bottom: 5em;
}
#welcomeMessage {
box-shadow: unset;
max-height: 100vh;
}
}
.imgWithAttr {
max-height: 20em;