X-Git-Url: https://dev.renevier.net/?p=syj.git;a=blobdiff_plain;f=public%2Fcss%2Fsyj.css;h=8e29c424d7b779ed54ae5d73b783f0ec43892a82;hp=f3d0f0b965fc041c976f77dfb4d8c839ef377b52;hb=556c960d0d6dc38ad3de6267936a4ab69a322eb0;hpb=f0cec87e660f4c34740d6a8c6256f534c67bb8b1 diff --git a/public/css/syj.css b/public/css/syj.css index f3d0f0b..8e29c42 100644 --- a/public/css/syj.css +++ b/public/css/syj.css @@ -1,5 +1,6 @@ -/* This file is part of Syj, Copyright (c) 2010 Arnaud Renevier, +/* This file is part of Syj, Copyright (c) 2010-2011 Arnaud Renevier, and is published under the AGPL license. */ + body, html { margin: 0; padding: 0; width: 100%; @@ -9,21 +10,56 @@ body, html { /* * map rules */ -#map { +#map, #map-overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 2em; *width: 100%; *height: 100%; } +#map-overlay { + background-color: gray; + opacity: 0.2; + filter:alpha(opacity=0.2); +} .olControlAttribution { bottom: 0.5em; *bottom: 2.5em; - _bottom: 3.0em; left: 0.5em; } +.olControlLayerSwitcher { + bottom: 4em; + top: auto; + left: 13px; + opacity: 0.75; + height: 6em; + max-width: intrinsic; + max-width: -moz-max-content; +} + +/* setting opacity to .olControlLayerSwitcher does not work */ +.olControlLayerSwitcher .layersDiv, +.olControlLayerSwitcher .maximizeDiv, +.olControlLayerSwitcher .minimizeDiv +{ + filter:alpha(opacity=75); +} + +.olControlLayerSwitcher .dataLayersDiv, .olControlLayerSwitcher .dataLbl { + display: none; +} +.olControlLayerSwitcher .layersDiv { + padding: 5px 12px 5px 36px; +} +.olControlLayerSwitcher .maximizeDiv { + top: -6em; +} +.olControlLayerSwitcher .minimizeDiv { + left: 4px; +} + /* * main message rules */ @@ -33,13 +69,12 @@ body, html { bottom: 3.5em; width: 40%; margin: 0px 45% 0px 15%; - padding: 1.5em 1.5em 1.5em 1.5em; - text-align: center; - border-width: 2px; - border-style: solid; - -moz-border-radius: 5px; - -webkit-border-radius: 5px; - border-radius: 5px; + padding-bottom: 0.5em; +} +@media screen and (max-width: 640px) { + #message.optional { + display: none; + } } /* @@ -51,6 +86,7 @@ body, html { } .menu-group { + z-index: 10; /* to be over nominatim-suggestions */ position: relative; /* otherwise, under #map in ie */ float: right; clear: right; @@ -72,17 +108,26 @@ body, html { -webkit-border-radius: 5px; border-radius: 5px; background-color: white; + cursor: pointer; } .menu-item:hover { - background-color: #BBBBFF; + background-color: #E0E0FF; +} + +.info-title { + text-decoration: underline; +} +.info-content a { + text-decoration: none; } #path-infos-content { - background-color: white; - -moz-border-radius: 5px; - -webkit-border-radius: 5px; - border-radius: 5px; - margin: 2px 10px 2px 0; + text-align: center; + padding: 4px 15px 15px 15px; +} + +.info-content { + margin-bottom: 0.5em; } #path-length { @@ -100,12 +145,10 @@ body, html { border-radius: 5px; background-color: white; } -#path-length-title { - text-decoration: underline; -} #data_controls { position: absolute; + z-index: 11; /* to be over login-controls */ right: 0.5em; bottom: 3em; text-align: center; @@ -143,30 +186,53 @@ body, html { border: 1px solid black; padding: 0; } + +#geomform { + padding: 25px 45px 20px 45px; + *width: 40%; /* otherwise takes all screen width in ie<7 */ +} +#edit-btn { + margin-top: 1em; +} +#geom_title { + margin-top: 0.7em; +} +#geom_submit { + margin-top: 0.7em; +} + +#other-language { + opacity: 0.85; + filter:alpha(opacity=85); + background-color: white; + padding: 5px 1px 5px 1px; + position: relative; /* otherwise, under #map in ie */ + margin-bottom: 10px; +} + +/* nominatim-suggestions */ #nominatim-suggestions { + text-align: left; border: 2px solid blue; -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; - margin-top: 8px; -<<<<<<< HEAD max-width: 360px; width: 360px\9; /* ie only */ -======= - max-width: 320px; - width: 320px\9; /* ie only */ ->>>>>>> cf7da47... display route length - position: absolute; background-color: white; -} -#nominatim-suggestions-title { - text-align: center; - font-weight: bold; + position: absolute; + right: 8px; } #nominatim-suggestions-list { + margin-left: 0; + position: relative; list-style: none; padding: 0 16px 0 12px; } +#nominatim-suggestions-title { + text-align: center; + font-weight: bold; +} #nominatim-suggestions-list li.current { background-color: #D3D3D3; } @@ -179,28 +245,6 @@ body, html { text-decoration: none; } -#geomform { - padding: 25px 45px 20px 45px; - *width: 40%; /* otherwise takes all screen width in ie<7 */ -} -#edit-btn { - margin-top: 1em; -} -#geom_title { - margin-top: 0.7em; -} -#geom_submit { - margin-top: 0.7em; -} - -#other-language { - opacity: 0.85; - filter:alpha(opacity=85); - background-color: white; - padding: 5px 1px 5px 1px; - position: relative; /* otherwise, under #map in ie */ -} - /* * login rules */ .modal { @@ -242,16 +286,3 @@ body, html { opacity: 1; filter:alpha(opacity=100); } - -/* - * printing - */ -@media print { - @page { - size: landscape; - } - - #message, #data_controls, #login_controls, #user_area, #login_area, #newpwd_area, .olControlPanZoom{ - display: none; - } -}