comparison geotemco/lib/openlayers/theme/default/style.css @ 0:57bde4830927

first commit
author Zoe Hong <zhong@mpiwg-berlin.mpg.de>
date Tue, 24 Mar 2015 11:37:17 +0100
parents
children
comparison
equal deleted inserted replaced
-1:000000000000 0:57bde4830927
1 div.olMap {
2 z-index: 0;
3 padding: 0 !important;
4 margin: 0 !important;
5 cursor: default;
6 }
7
8 div.olMapViewport {
9 text-align: left;
10 -ms-touch-action: none;
11 }
12
13 div.olLayerDiv {
14 -moz-user-select: none;
15 -khtml-user-select: none;
16 }
17
18 .olLayerGoogleCopyright {
19 left: 2px;
20 bottom: 2px;
21 }
22 .olLayerGoogleV3.olLayerGoogleCopyright {
23 right: auto !important;
24 }
25 .olLayerGooglePoweredBy {
26 left: 2px;
27 bottom: 15px;
28 }
29 .olLayerGoogleV3.olLayerGooglePoweredBy {
30 bottom: 15px !important;
31 }
32 /* GMaps should not set styles on its container */
33 .olForeignContainer {
34 opacity: 1 !important;
35 }
36 .olControlAttribution {
37 font-size: smaller;
38 left: 3px;
39 bottom: 1.5em;
40 position: absolute;
41 display: block;
42 }
43 .olControlScale {
44 right: 3px;
45 bottom: 3em;
46 display: block;
47 position: absolute;
48 font-size: smaller;
49 }
50 .olControlScaleLine {
51 display: block;
52 position: absolute;
53 left: 10px;
54 bottom: 15px;
55 font-size: xx-small;
56 }
57 .olControlScaleLineBottom {
58 border: solid 2px black;
59 border-bottom: none;
60 margin-top:-2px;
61 text-align: center;
62 }
63 .olControlScaleLineTop {
64 border: solid 2px black;
65 border-top: none;
66 text-align: center;
67 }
68
69 .olControlPermalink {
70 right: 3px;
71 bottom: 1.5em;
72 display: block;
73 position: absolute;
74 font-size: smaller;
75 }
76
77 div.olControlMousePosition {
78 bottom: 0;
79 right: 3px;
80 display: block;
81 position: absolute;
82 font-family: Arial;
83 font-size: smaller;
84 }
85
86 .olControlOverviewMapContainer {
87 position: absolute;
88 bottom: 0;
89 right: 0;
90 }
91
92 .olControlOverviewMapElement {
93 padding: 10px 18px 10px 10px;
94 background-color: #00008B;
95 -moz-border-radius: 1em 0 0 0;
96 }
97
98 .olControlOverviewMapMinimizeButton,
99 .olControlOverviewMapMaximizeButton {
100 height: 18px;
101 width: 18px;
102 right: 0;
103 bottom: 80px;
104 cursor: pointer;
105 }
106
107 .olControlOverviewMapExtentRectangle {
108 overflow: hidden;
109 background-image: url("img/blank.gif");
110 cursor: move;
111 border: 2px dotted red;
112 }
113 .olControlOverviewMapRectReplacement {
114 overflow: hidden;
115 cursor: move;
116 background-image: url("img/overview_replacement.gif");
117 background-repeat: no-repeat;
118 background-position: center;
119 }
120
121 .olLayerGeoRSSDescription {
122 float:left;
123 width:100%;
124 overflow:auto;
125 font-size:1.0em;
126 }
127 .olLayerGeoRSSClose {
128 float:right;
129 color:gray;
130 font-size:1.2em;
131 margin-right:6px;
132 font-family:sans-serif;
133 }
134 .olLayerGeoRSSTitle {
135 float:left;font-size:1.2em;
136 }
137
138 .olPopupContent {
139 padding:5px;
140 overflow: auto;
141 }
142
143 .olControlNavigationHistory {
144 background-image: url("img/navigation_history.png");
145 background-repeat: no-repeat;
146 width: 24px;
147 height: 24px;
148
149 }
150 .olControlNavigationHistoryPreviousItemActive {
151 background-position: 0 0;
152 }
153 .olControlNavigationHistoryPreviousItemInactive {
154 background-position: 0 -24px;
155 }
156 .olControlNavigationHistoryNextItemActive {
157 background-position: -24px 0;
158 }
159 .olControlNavigationHistoryNextItemInactive {
160 background-position: -24px -24px;
161 }
162
163 div.olControlSaveFeaturesItemActive {
164 background-image: url(img/save_features_on.png);
165 background-repeat: no-repeat;
166 background-position: 0 1px;
167 }
168 div.olControlSaveFeaturesItemInactive {
169 background-image: url(img/save_features_off.png);
170 background-repeat: no-repeat;
171 background-position: 0 1px;
172 }
173
174 .olHandlerBoxZoomBox {
175 border: 2px solid red;
176 position: absolute;
177 background-color: white;
178 opacity: 0.50;
179 font-size: 1px;
180 filter: alpha(opacity=50);
181 }
182 .olHandlerBoxSelectFeature {
183 border: 2px solid blue;
184 position: absolute;
185 background-color: white;
186 opacity: 0.50;
187 font-size: 1px;
188 filter: alpha(opacity=50);
189 }
190
191 .olControlPanPanel {
192 top: 10px;
193 left: 5px;
194 }
195
196 .olControlPanPanel div {
197 background-image: url(img/pan-panel.png);
198 height: 18px;
199 width: 18px;
200 cursor: pointer;
201 position: absolute;
202 }
203
204 .olControlPanPanel .olControlPanNorthItemInactive {
205 top: 0;
206 left: 9px;
207 background-position: 0 0;
208 }
209 .olControlPanPanel .olControlPanSouthItemInactive {
210 top: 36px;
211 left: 9px;
212 background-position: 18px 0;
213 }
214 .olControlPanPanel .olControlPanWestItemInactive {
215 position: absolute;
216 top: 18px;
217 left: 0;
218 background-position: 0 18px;
219 }
220 .olControlPanPanel .olControlPanEastItemInactive {
221 top: 18px;
222 left: 18px;
223 background-position: 18px 18px;
224 }
225
226 .olControlZoomPanel {
227 top: 71px;
228 left: 14px;
229 }
230
231 .olControlZoomPanel div {
232 background-image: url(img/zoom-panel.png);
233 position: absolute;
234 height: 18px;
235 width: 18px;
236 cursor: pointer;
237 }
238
239 .olControlZoomPanel .olControlZoomInItemInactive {
240 top: 0;
241 left: 0;
242 background-position: 0 0;
243 }
244
245 .olControlZoomPanel .olControlZoomToMaxExtentItemInactive {
246 top: 18px;
247 left: 0;
248 background-position: 0 -18px;
249 }
250
251 .olControlZoomPanel .olControlZoomOutItemInactive {
252 top: 36px;
253 left: 0;
254 background-position: 0 18px;
255 }
256
257 /*
258 * When a potential text is bigger than the image it move the image
259 * with some headers (closes #3154)
260 */
261 .olControlPanZoomBar div {
262 font-size: 1px;
263 }
264
265 .olPopupCloseBox {
266 background: url("img/close.gif") no-repeat;
267 cursor: pointer;
268 }
269
270 .olFramedCloudPopupContent {
271 padding: 5px;
272 overflow: auto;
273 }
274
275 .olControlNoSelect {
276 -moz-user-select: none;
277 -khtml-user-select: none;
278 }
279
280 .olImageLoadError {
281 background-color: pink;
282 opacity: 0.5;
283 filter: alpha(opacity=50); /* IE */
284 }
285
286 /**
287 * Cursor styles
288 */
289
290 .olCursorWait {
291 cursor: wait;
292 }
293 .olDragDown {
294 cursor: move;
295 }
296 .olDrawBox {
297 cursor: crosshair;
298 }
299 .olControlDragFeatureOver {
300 cursor: move;
301 }
302 .olControlDragFeatureActive.olControlDragFeatureOver.olDragDown {
303 cursor: -moz-grabbing;
304 }
305
306 /**
307 * Layer switcher
308 */
309 .olControlLayerSwitcher {
310 position: absolute;
311 top: 25px;
312 right: 0;
313 width: 20em;
314 font-family: sans-serif;
315 font-weight: bold;
316 margin-top: 3px;
317 margin-left: 3px;
318 margin-bottom: 3px;
319 font-size: smaller;
320 color: white;
321 background-color: transparent;
322 }
323
324 .olControlLayerSwitcher .layersDiv {
325 padding-top: 5px;
326 padding-left: 10px;
327 padding-bottom: 5px;
328 padding-right: 10px;
329 background-color: darkblue;
330 }
331
332 .olControlLayerSwitcher .layersDiv .baseLbl,
333 .olControlLayerSwitcher .layersDiv .dataLbl {
334 margin-top: 3px;
335 margin-left: 3px;
336 margin-bottom: 3px;
337 }
338
339 .olControlLayerSwitcher .layersDiv .baseLayersDiv,
340 .olControlLayerSwitcher .layersDiv .dataLayersDiv {
341 padding-left: 10px;
342 }
343
344 .olControlLayerSwitcher .maximizeDiv,
345 .olControlLayerSwitcher .minimizeDiv {
346 width: 18px;
347 height: 18px;
348 top: 5px;
349 right: 0;
350 cursor: pointer;
351 }
352
353 .olBingAttribution {
354 color: #DDD;
355 }
356 .olBingAttribution.road {
357 color: #333;
358 }
359
360 .olGoogleAttribution.hybrid, .olGoogleAttribution.satellite {
361 color: #EEE;
362 }
363 .olGoogleAttribution {
364 color: #333;
365 }
366 span.olGoogleAttribution a {
367 color: #77C;
368 }
369 span.olGoogleAttribution.hybrid a, span.olGoogleAttribution.satellite a {
370 color: #EEE;
371 }
372
373 /**
374 * Editing and navigation icons.
375 * (using the editing_tool_bar.png sprint image)
376 */
377 .olControlNavToolbar ,
378 .olControlEditingToolbar {
379 margin: 5px 5px 0 0;
380 }
381 .olControlNavToolbar div,
382 .olControlEditingToolbar div {
383 background-image: url("img/editing_tool_bar.png");
384 background-repeat: no-repeat;
385 margin: 0 0 5px 5px;
386 width: 24px;
387 height: 22px;
388 cursor: pointer
389 }
390 /* positions */
391 .olControlEditingToolbar {
392 right: 0;
393 top: 0;
394 }
395 .olControlNavToolbar {
396 top: 295px;
397 left: 9px;
398 }
399 /* layouts */
400 .olControlEditingToolbar div {
401 float: right;
402 }
403 /* individual controls */
404 .olControlNavToolbar .olControlNavigationItemInactive,
405 .olControlEditingToolbar .olControlNavigationItemInactive {
406 background-position: -103px -1px;
407 }
408 .olControlNavToolbar .olControlNavigationItemActive ,
409 .olControlEditingToolbar .olControlNavigationItemActive {
410 background-position: -103px -24px;
411 }
412 .olControlNavToolbar .olControlZoomBoxItemInactive {
413 background-position: -128px -1px;
414 }
415 .olControlNavToolbar .olControlZoomBoxItemActive {
416 background-position: -128px -24px;
417 }
418 .olControlEditingToolbar .olControlDrawFeaturePointItemInactive {
419 background-position: -77px -1px;
420 }
421 .olControlEditingToolbar .olControlDrawFeaturePointItemActive {
422 background-position: -77px -24px;
423 }
424 .olControlEditingToolbar .olControlDrawFeaturePathItemInactive {
425 background-position: -51px -1px;
426 }
427 .olControlEditingToolbar .olControlDrawFeaturePathItemActive {
428 background-position: -51px -24px;
429 }
430 .olControlEditingToolbar .olControlDrawFeaturePolygonItemInactive{
431 background-position: -26px -1px;
432 }
433 .olControlEditingToolbar .olControlDrawFeaturePolygonItemActive {
434 background-position: -26px -24px;
435 }
436
437 div.olControlZoom {
438 position: absolute;
439 top: 8px;
440 left: 8px;
441 background: rgba(255,255,255,0.4);
442 border-radius: 4px;
443 padding: 2px;
444 }
445 div.olControlZoom a {
446 display: block;
447 margin: 1px;
448 padding: 0;
449 color: white;
450 font-size: 18px;
451 font-family: 'Lucida Grande', Verdana, Geneva, Lucida, Arial, Helvetica, sans-serif;
452 font-weight: bold;
453 text-decoration: none;
454 text-align: center;
455 height: 22px;
456 width:22px;
457 line-height: 19px;
458 background: #130085; /* fallback for IE - IE6 requires background shorthand*/
459 background: rgba(0, 60, 136, 0.5);
460 filter: alpha(opacity=80);
461 }
462 div.olControlZoom a:hover {
463 background: #130085; /* fallback for IE */
464 background: rgba(0, 60, 136, 0.7);
465 filter: alpha(opacity=100);
466 }
467 @media only screen and (max-width: 600px) {
468 div.olControlZoom a:hover {
469 background: rgba(0, 60, 136, 0.5);
470 }
471 }
472 a.olControlZoomIn {
473 border-radius: 4px 4px 0 0;
474 }
475 a.olControlZoomOut {
476 border-radius: 0 0 4px 4px;
477 }
478
479
480 /**
481 * Animations
482 */
483
484 .olLayerGrid .olTileImage {
485 -webkit-transition: opacity 0.2s linear;
486 -moz-transition: opacity 0.2s linear;
487 -o-transition: opacity 0.2s linear;
488 transition: opacity 0.2s linear;
489 }
490
491 /* Turn on GPU support where available */
492 .olTileImage {
493 -webkit-transform: translateZ(0);
494 -moz-transform: translateZ(0);
495 -o-transform: translateZ(0);
496 -ms-transform: translateZ(0);
497 transform: translateZ(0);
498 -webkit-backface-visibility: hidden;
499 -moz-backface-visibility: hidden;
500 -ms-backface-visibility: hidden;
501 backface-visibility: hidden;
502 -webkit-perspective: 1000;
503 -moz-perspective: 1000;
504 -ms-perspective: 1000;
505 perspective: 1000;
506 }
507
508 /* when replacing tiles, do not show tile and backbuffer at the same time */
509 .olTileReplacing {
510 display: none;
511 }
512
513 /* override any max-width image settings (e.g. bootstrap.css) */
514 img.olTileImage {
515 max-width: none;
516 }