1/*!
2 * Copyright (c) 2008-2022 Mark C. Prins <mprins@users.sf.net>
3 *
4 * Permission to use, copy, modify, and distribute this software for any
5 * purpose with or without fee is hereby granted, provided that the above
6 * copyright notice and this permission notice appear in all copies.
7 *
8 * THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES
9 * WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF
10 * MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR
11 * ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES
12 * WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN
13 * ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF
14 * OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.
15 */
16
17/* admin form */
18#olmap_purgeform p {
19    text-align: left;
20}
21
22/* admin form */
23
24
25/* map container */
26.olContainer {
27    border: 1px solid __border__;
28    background-color: __background_neu__;
29    width: auto;
30    float: left;
31}
32
33/* TODO check */
34/* Work around a case of style reset, setting it on the container breaks the overview map. See: http://www.dokuwiki.org/plugin:openlayersmap?rev=1329438681&do=diff */
35.olContainer img {
36    max-width: none;
37}
38
39/*OL map */
40.olMap {
41    cursor: default;
42    background-image: url("olMapbg.png");
43    background-color: __background_neu__;
44    background-repeat: repeat;
45    background-attachment: scroll;
46    background-position: 0 0;
47    /* on some browsers the outline is partly hidden by the .olContainer; this way we work around that.*/
48    touch-action: none;
49}
50
51.olMap:focus {
52    outline-style: solid;
53    outline-width: 2px;
54    outline-offset: 2px;
55}
56
57.ol-viewport > div > * {
58    outline-width: 0;
59}
60
61/** popup styles. */
62.olPopup {
63    position: absolute;
64    background-color: __background__;
65    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
66    padding: 15px;
67    border-radius: 10px;
68    border: 1px solid __border__;
69    bottom: 12px;
70    left: -50px;
71    min-width: 280px;
72}
73
74.olPopup:after, .olPopup:before {
75    top: 100%;
76    border: solid transparent;
77    content: " ";
78    height: 0;
79    width: 0;
80    position: absolute;
81    pointer-events: none;
82}
83
84.olPopup:after {
85    border-top-color: __background__;
86    border-width: 10px;
87    left: 48px;
88    margin-left: -10px;
89}
90
91.olPopup:before {
92    border-top-color: __background_alt__;
93    border-width: 11px;
94    left: 48px;
95    margin-left: -11px;
96}
97
98.txt p {
99    display: inline;
100}
101
102.rowId {
103    border: 1px dotted __border__;
104}
105
106.spacer {
107    height: 8px;
108    min-width: 190px;
109}
110
111.coord {
112    float: left;
113    top: 0;
114    position: absolute;
115    font-size: smaller;
116    overflow: hidden;
117    min-width: 190px;
118}
119
120.coord img {
121    height: inherit;
122    vertical-align: middle;
123}
124
125.olPopupCloseBox {
126    text-decoration: none !important;
127    position: absolute;
128    top: 2px;
129    right: 8px;
130}
131
132.olPopupCloseBox:after {
133    content: "✖";
134}
135
136
137/* POI table */
138.olPOItableSpan {
139    display: inline;
140}
141
142.olPOItable {
143    margin: 1px;
144    padding: 1px;
145    border: 1px solid __border__;
146    width: 99%;
147}
148
149.olPrintOnly {
150    display: none;
151}
152
153.olWebOnly {
154    display: inline;
155}
156
157.olPOItable .icon {
158    text-align: center;
159}
160
161/** accesible tooltip, to add to a focusable element containing a span with the tooltip. */
162/* show a tooltip offset to above/left */
163.olHasTooltip span, .olHasTooltip_bttm_r span, .olHasTooltip_bttm_l span, .olHasTooltip_TL span {
164    position: absolute;
165    clip: rect(1px 1px 1px 1px); /* < IE8 */
166    clip: rect(1px, 1px, 1px, 1px);
167    padding: 0;
168    border: 0;
169    height: 1px;
170    width: 1px;
171    overflow: hidden;
172    opacity: 0;
173    will-change: opacity, clip;
174    -moz-animation-name: fadeIn;
175    -webkit-animation-name: fadeIn;
176    animation-name: fadeIn;
177    -moz-animation-timing-function: ease;
178    -webkit-animation-timing-function: ease;
179    animation-timing-function: ease;
180    -moz-animation-delay: 0.35s;
181    -webkit-animation-delay: 0.35s;
182    animation-delay: 0.35s;
183    -moz-animation-duration: 5s;
184    -webkit-animation-duration: 5s;
185    animation-duration: 5s;
186    -moz-animation-iteration-count: 1;
187    -webkit-animation-iteration-count: 1;
188    animation-iteration-count: 1;
189}
190
191.olHasTooltip:hover span, .olHasTooltip_bttm_r:hover span, .olHasTooltip_bttm_l:hover span, .olHasTooltip:focus span, .olHasTooltip_bttm_r:focus span, .olHasTooltip_bttm_l:focus span, .olHasTooltip_TL:hover span, .olHasTooltip_TL:focus span {
192    clip: auto;
193    padding: 3px;
194    height: auto;
195    width: auto;
196    z-index: 1100;
197    max-height: 100px;
198    white-space: nowrap;
199    display: inline-block;
200    background-color: __background_alt__;
201    color: __text__;
202    border: 1px solid __border__;
203    -moz-border-radius: 5px;
204    -webkit-border-radius: 5px;
205    border-radius: 5px;
206    -moz-box-shadow: 2px 2px 2px __border__;
207    -webkit-box-shadow: 2px 2px 2px __border__;
208    box-shadow: 2px 2px 2px __border__;
209    bottom: 2em;
210    right: 0;
211    -moz-animation-name: fadeOut;
212    -webkit-animation-name: fadeOut;
213    animation-name: fadeOut;
214}
215
216/* show a tooltip offset to below/right */
217.olHasTooltip_bttm_r:hover span, .olHasTooltip_bttm_r:focus span {
218    bottom: -2em;
219    left: 1em;
220    right: auto;
221}
222
223/* show a tooltip offset to below/left */
224.olHasTooltip_bttm_l:hover span, .olHasTooltip_bttm_l:focus span {
225    bottom: -2em;
226}
227
228@keyframes fadeIn {
229    0% {
230        opacity: 0;
231    }
232    100% {
233        opacity: 0;
234    }
235}
236
237@keyframes fadeOut {
238    from {
239        opacity: 1;
240    }
241    to {
242        opacity: 0;
243    }
244}
245
246.olMapHelp {
247    display: none;
248    z-index: 1100;
249    position: absolute;
250    background: __background_alt__;
251    border: 1px solid __border__;
252    padding-right: 2px;
253    border-radius: 4px;
254    box-shadow: 2px 2px 2px __border__;
255}
256
257.olMapHelpButtonDiv {
258    position: relative;
259    float: right;
260    width: 22px;
261    background-color: __background_neu__;
262}
263
264.olMapHelpButton {
265    position: absolute;
266    height: 22px;
267    width: 22px;
268    line-height: 19px;
269    text-decoration: none;
270    text-align: center;
271    padding: 0;
272    color: #FFF;
273    background: rgba(0, 60, 136, 0.7);
274    border: 1px solid __border__;
275    z-index: 1100;
276    border-bottom-left-radius: 4px;
277}
278
279.olMapHelpButton:hover, .olMapHelpButton:focus {
280    background: #003c88;
281}
282
283.ol-zoom {
284    top: 8px;
285    left: 8px;
286    background: rgba(255, 255, 255, 0.2);
287}
288
289.ol-full-screen {
290    left: 8px;
291    right: initial;
292    top: 64px;
293    background: rgba(255, 255, 255, 0.2);
294}
295
296.ol-overviewmap {
297    right: 0;
298    left: initial;
299    bottom: 50px;
300
301}
302
303.ol-attribution {
304    bottom: 19px;
305    right: 0;
306    background: __background_neu__;
307
308    ul {
309        color: __text__ !important;
310        margin: 0 !important;
311    }
312}
313
314.ol-control {
315    button {
316        display: block;
317        margin: 1px;
318        padding: 0;
319        color: #FFF;
320        height: 22px;
321        width: 22px;
322        line-height: 19px;
323        text-decoration: none;
324        text-align: center;
325        border: 1px solid __border__;
326        background: rgba(0, 60, 136, 0.7);
327
328        :hover {
329            background: #003c88;
330        }
331    }
332}
333
334.ol-mouse-position {
335    top: initial;
336    bottom: 0;
337    right: 4em;
338    font-size: 14px;
339    text-shadow: -2px 0 #fff, 0 2px #fff, 2px 0 #fff, 0 -2px #fff;
340}
341
342.ol-scale-step-text {
343    font-size: 14px;
344    bottom: -10px;
345}
346
347.layer-switcher {
348    top: 64px;
349    right: 0;
350
351    ul {
352        color: __text__ !important;
353        list-style-type: none !important;
354        margin: 0 !important;
355        line-height: 1em !important;
356    }
357
358    li {
359        margin-top: 0;
360    }
361}
362
363.layer-switcher.shown.layer-switcher-activation-mode-click > button {
364    left: initial;
365}