X-Git-Url: https://git-public.kairo.at/?p=lantea.git;a=blobdiff_plain;f=style%2Flantea.css;h=f5364cad970faeb962fa484dbe3336e3b5a27f95;hp=03af2d1af38bd6fd3bc1294d8f885e41c7d651b1;hb=81b1b5fe77679daa0c540365e47e2fe9c36fea22;hpb=b5e49b956629a45c3af14a87790060cbf18a718a diff --git a/style/lantea.css b/style/lantea.css index 03af2d1..f5364ca 100644 --- a/style/lantea.css +++ b/style/lantea.css @@ -5,55 +5,58 @@ body { font-family: sans-serif; margin: 0; + background: url("loading.png") repeat; } h1 { display: none; } -#menuArea { - position: absolute; - /* width: 30em; */ - left: 1%; - top: 1em; - z-index: 5; -} - -#zoomArea { - position: absolute; - right: 1%; - top: 1em; - z-index: 5; - text-align: center; -} - -#fullscreenArea { +#dialogArea, +.overlayArea { position: absolute; - right: 1%; - bottom: 2em; z-index: 5; - text-align: center; -} - -.overlayArea { transition-property: opacity; transition-duration: .2s; } +#dialogArea.hidden, .overlayArea.hidden { opacity: 0; transition-duration: 1s; } +#dialogArea:-moz-system-metric(touch-enabled), .overlayArea:-moz-system-metric(touch-enabled) { font-size: 3mozmm; } +#dialogArea input[type="button"]:-moz-system-metric(touch-enabled), +#dialogArea input[type="text"]:-moz-system-metric(touch-enabled), +#dialogArea select:-moz-system-metric(touch-enabled), .overlayArea input[type="button"]:-moz-system-metric(touch-enabled), .overlayArea select:-moz-system-metric(touch-enabled) { font-size: 3mozmm; } +#menuArea { + /* width: 30em; */ + left: 1%; + top: 1em; +} + +#zoomArea { + right: 1%; + top: 1em; + text-align: center; +} + +#fullscreenArea { + right: 1%; + bottom: 2em; + text-align: center; +} + #zoomLevel { background-color: rgba(255, 255, 255, .8); border-radius: 3px; @@ -85,11 +88,7 @@ h1 { z-index: 1; } -#map { - background: url("style/loading.png") repeat; -} - -#debug { +#action { position: absolute; bottom: 5px; left: .5em; @@ -100,12 +99,20 @@ h1 { padding: 0 3px; } +#actionimg { + vertical-align: text-bottom; +} + .debugHide { display: none; } +.settingsSubTitle { + margin: .5em 0 0; + font-weight: bold; +} + #copyright { - position: absolute; bottom: 5px; right: .5em; margin: 0; @@ -121,6 +128,35 @@ h1 { opacity: 0; } +#dialogArea { + top: 20%; + right: 0; + left: 0; + width: 30ch; + max-width: 92%; + z-index: 10; + background-color: rgba(255, 255, 255, .8); + border: 0; + margin: auto; + padding: .5em; + border-radius: 5px; +} + +#dialogArea.hidden { + top: -100%; +} + +.dialogTitle { + margin: 0 0 .5em; + font-weight: bold; +} + +.dialogHelp { + margin: .5em 0; + font-size: small; + opacity: .66; +} + @media screen and (max-width: 500px) { body { font-size: 10px;