public/css/syj.css

   1 /*  This file is part of Syj, Copyright (c) 2010-2011 Arnaud Renevier,
   2     and is published under the AGPL license. */
   3 body, html {
   4     margin: 0; padding: 0;
   5     width: 100%;
   6     height: 100%;
   7 }
   8
   9 /*
  10  * map rules
  11  */
  12 #map, #map-overlay {
  13     position: absolute;
  14     top: 0; left: 0; right: 0;
  15     bottom: 2em;
  16     *width: 100%;
  17     *height: 100%;
  18 }
  19 #map-overlay {
  20     background-color: gray;
  21     opacity: 0.2;
  22     filter:alpha(opacity=0.2);
  23 }
  24
  25 .olControlAttribution {
  26     bottom: 0.5em;
  27     *bottom: 2.5em;
  28     _bottom: 3.0em;
  29     left: 0.5em;
  30 }
  31
  32 /*
  33  * main message rules
  34  */
  35
  36 #message {
  37     position: absolute;
  38     bottom: 3.5em;
  39     width: 40%;
  40     margin: 0px 45% 0px 15%;
  41     padding: 1.5em 1.5em 1.5em 1.5em;
  42     text-align: center;
  43     border-width: 2px;
  44     border-style: solid;
  45     -moz-border-radius: 5px;
  46     -webkit-border-radius: 5px;
  47     border-radius: 5px;
  48 }
  49
  50 /*
  51  * menu rules
  52  */
  53
  54 #menu {
  55     text-align: right;
  56 }
  57
  58 .menu-group {
  59     z-index: 10; /* to be over nominatim-suggestions */
  60     position: relative; /* otherwise, under #map in ie */
  61     float: right;
  62     clear: right;
  63     padding-top: 8px;
  64     padding-left: 3em;
  65     opacity: 0.85;
  66     filter:alpha(opacity=85);
  67 }
  68
  69 .menu-item {
  70     position: relative; /* otherwise, under #map in ie */
  71     min-width: 150px;
  72     margin: 2px 10px 2px 0;
  73     background-color: white;
  74     text-decoration: none;
  75     border: #1E90FF 2px solid;
  76     padding: 2px 15px 2px 15px;
  77     -moz-border-radius: 5px;
  78     -webkit-border-radius: 5px;
  79     border-radius: 5px;
  80     background-color: white;
  81 }
  82 .menu-item:hover {
  83     background-color: #E0E0FF;
  84 }
  85
  86 .info-title {
  87     text-decoration: underline;
  88 }
  89
  90 #path-infos-content {
  91     text-align: center;
  92     padding: 4px 15px 15px 15px;
  93 }
  94
  95 #path-export-title {
  96     margin-top: 1em;
  97 }
  98 #path-export-content a {
  99     text-decoration: none;
 100 }
 101
 102 #path-length {
 103     text-align: center;
 104     position: absolute; /* otherwise, under #map in ie */
 105     top: 1em;
 106     left: 5em;
 107     opacity: 0.85;
 108     margin-right: 12px;
 109     filter:alpha(opacity=85);
 110     background-color: white;
 111     padding: 2px 15px 2px 15px;
 112     -moz-border-radius: 5px;
 113     -webkit-border-radius: 5px;
 114     border-radius: 5px;
 115     background-color: white;
 116 }
 117
 118 #data_controls {
 119     position: absolute;
 120     right: 0.5em;
 121     bottom: 3em;
 122     text-align: center;
 123     background-color: white;
 124     opacity: 0.85;
 125     filter:alpha(opacity=85);
 126     border: 1px solid gray;
 127     margin: auto;
 128     -moz-border-radius: 5px;
 129     -webkit-border-radius: 5px;
 130     border-radius: 5px;
 131 }
 132 #data_controls_btns {
 133     padding: 5px 10px 5px 10px;
 134 }
 135
 136 #nominatim-form {
 137     text-align: left;
 138     padding-bottom: 7px;
 139     margin-bottom: 3px;
 140     border-bottom: 1px solid black;
 141 }
 142 #nominatim-message {
 143     max-width: 16em;
 144     padding: 15px 0 15px 0;
 145 }
 146 #nominatim-label {
 147     text-decoration: none;
 148 }
 149 #nominatim-search {
 150     border: 1px solid black;
 151 }
 152 #nominatim-submit {
 153     width: 26px;
 154     border: 1px solid black;
 155     padding: 0;
 156 }
 157
 158 #geomform {
 159     padding: 25px 45px 20px 45px;
 160     *width: 40%; /* otherwise takes all screen width in ie<7 */
 161 }
 162 #edit-btn {
 163     margin-top: 1em;
 164 }
 165 #geom_title {
 166     margin-top: 0.7em;
 167 }
 168 #geom_submit {
 169     margin-top: 0.7em;
 170 }
 171
 172 #other-language {
 173     opacity: 0.85;
 174     filter:alpha(opacity=85);
 175     background-color: white;
 176     padding: 5px 1px 5px 1px;
 177     position: relative; /* otherwise, under #map in ie */
 178 }
 179
 180 /* nominatim-suggestions */
 181 #nominatim-suggestions {
 182     text-align: left;
 183     border: 2px solid blue;
 184     -moz-border-radius: 8px;
 185     -webkit-border-radius: 8px;
 186     border-radius: 8px;
 187     max-width: 360px;
 188     width: 360px\9; /* ie only */
 189     background-color: white;
 190     position: absolute;
 191     right: 8px;
 192 }
 193 #nominatim-suggestions-list {
 194     margin-left: 0;
 195     position: relative;
 196     list-style: none;
 197     padding: 0 16px 0 12px;
 198 }
 199 #nominatim-suggestions-title {
 200     text-align: center;
 201     font-weight: bold;
 202 }
 203 #nominatim-suggestions-list li.current {
 204     background-color: #D3D3D3;
 205 }
 206 .nominatim-suggestions-icon {
 207     border: none;
 208     vertical-align: middle;
 209     margin-right: 4px;
 210 }
 211 .nominatim-suggestions-link {
 212     text-decoration: none;
 213 }
 214
 215 /* * login rules
 216  */
 217 .modal {
 218     background-color: white;
 219     text-align: center;
 220     width: 50%;
 221     margin-left: auto;
 222     margin-right: auto;
 223     padding: 21px;
 224     border: 1px solid gray;
 225     opacity: 0.85;
 226     filter:alpha(opacity=85);
 227 }
 228
 229 .form-table-elem {
 230     display: block;
 231     width: 100%;
 232 }
 233 .modal .message {
 234     margin: 0 35px 12px 35px;
 235 }
 236 #login_area_create {
 237     text-align: right;
 238 }
 239
 240 #user_control_anchor {
 241     text-align: right;
 242 }
 243
 244 #user_email-desc {
 245     margin: 0px 0px 12px 0px;
 246     padding: 8px 2px 8px 2px;
 247     background-color: #D3D3D3; /* lightgrey */
 248 }
 249
 250 #termsofusearea {
 251     height: 50%;
 252     /* override opacity defined in .modal rule */
 253     opacity: 1;
 254     filter:alpha(opacity=100);
 255 }
 256
 257 /*
 258  * printing
 259  */
 260 @media print {
 261     @page {
 262       size: landscape;
 263     }
 264
 265     #message, #menu, #user_area, #login_area, #newpwd_area, .olControlPanZoom{
 266         display: none;
 267     }
 268 }