/bin/html/map/ui/minimalist.css
CSS | 226 lines | 196 code | 7 blank | 23 comment | 0 complexity | b9cf023882d3008a2e2e5254332ac841 MD5 | raw file
1/** 2* License and Terms of Use 3* 4* Copyright (c) 2011 SignpostMarv 5* 6* Permission is hereby granted, free of charge, to any person obtaining a copy 7* of this software and associated documentation files (the "Software"), to deal 8* in the Software without restriction, including without limitation the rights 9* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 10* copies of the Software, and to permit persons to whom the Software is 11* furnished to do so, subject to the following conditions: 12* 13* The above copyright notice and this permission notice shall be included in 14* all copies or substantial portions of the Software. 15* 16* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 17* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 18* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 19* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 20* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 21* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN 22* THE SOFTWARE. 23*/ 24.mapapi-ui-sidebars { 25 z-index: 200 ; 26} 27.mapapi-ui-minimalist .mapapi-ui-sidebars .zoomcontrol, .mapapi-ui-minimalist .mapapi-ui-sidebars .menu{ 28 position: absolute ; 29 top: 37px ; 30 height: 29px ; 31 vertical-align: top ; 32 background: #eee ; 33 font-size: 12px ; 34} 35.mapapi-ui-minimalist .mapapi-ui-sidebars .zoomcontrol{ 36 right: 8px ; 37 width: 16px ; 38 text-align: center ; 39 text-indent: -4px ; 40 border-radius: 0 8px 8px 0; 41 box-shadow: 0px 2px 4px #000 ; 42 clip:rect(0,20px,33px,0); 43 overflow: hidden ; 44 line-height: 14.5px ; 45 z-index: 400 ; 46} 47 48.mapapi-ui-minimalist .mapapi-ui-sidebars .menu{ 49 right: 24px ; 50 line-height: 29px ; 51 width: auto ; 52 box-shadow: 0 2px 4px #000 ; 53 z-index: 300 ; 54} 55.mapapi-ui-minimalist .mapapi-ui-sidebars .menu.minimised{ 56 width: 0 ; 57} 58.mapapi-ui-minimalist .mapapi-ui-sidebars .menu > ul{ 59 padding: 0 .25em ; 60} 61.mapapi-ui-minimalist .mapapi-ui-sidebars .menu.minimised > ul{ 62 display: none ; 63} 64.mapapi-ui-minimalist .mapapi-ui-sidebars .menu .toggle-menu{ 65 position: absolute ; 66 top: 0 ; 67 left: -1em ; 68 z-index: 200 ; 69 padding: 0 4px ; 70 background: #eee ; 71 border-radius: 8px 0 0 8px ; 72 height: 100% ; 73 box-shadow: 0px 2px 4px #000 ; 74 clip:rect(0,1em,33px,0); 75} 76.mapapi-ui-minimalist .mapapi-ui-sidebars .menu > ul > li{ 77 display: inline-block ; 78 position: relative ; 79 margin-left: 1em ; 80} 81.mapapi-ui-minimalist .mapapi-ui-sidebars .menu > ul > li:first-child{ 82 margin-left: 0 ; 83} 84.mapapi-ui-minimalist .mapapi-ui-sidebars .menu > ul > li > h1{ 85 font-size: 1.2em ; 86 font-weight: bolder ; 87} 88.mapapi-ui-minimalist .mapapi-ui-sidebars .menu > ul > li > ul, .mapapi-ui-minimalist .mapapi-ui-sidebars .menu > ul > li > ul > li > ul{ 89 display: none ; 90} 91.mapapi-ui-minimalist .mapapi-ui-sidebars .menu > ul > li > ul > li > ul{ 92 max-height: 400px ; 93 overflow: auto ; 94 padding-top: 1em ; 95} 96.mapapi-ui-minimalist .mapapi-ui-sidebars .menu > ul > li > ul > li > ul > li{ 97 padding: 0 0 0 .25em; 98 margin-right: 2em ; 99 line-height: 1.5em ; 100 width: 100% ; 101} 102.mapapi-ui-minimalist .mapapi-ui-sidebars .menu > ul > li > ul > li > ul > li:nth-child(odd){ 103 background: #ddd ; 104} 105.mapapi-ui-minimalist .mapapi-ui-sidebars .menu > ul > li.toggled > ul, .mapapi-ui-minimalist .mapapi-ui-sidebars .menu > ul > li:hover > ul{ 106 display: block ; 107 position: absolute ; 108 top: 100% ; 109 right: 0 ; 110 background: #eee ; 111 border-radius: 8px 0 8px 8px ; 112 padding: .25em ; 113} 114.mapapi-ui-minimalist .mapapi-ui-sidebars .menu > ul > li:hover{ 115 z-index: 300 ; 116} 117.mapapi-ui-minimalist .mapapi-ui-sidebars .menu > ul > li:hover > h1{ 118 background: #fff ; 119 border-radius: 8px 8px 0 0 ; 120 box-shadow: 4px 4px 4px #000 ; 121} 122.mapapi-ui-minimalist .mapapi-ui-sidebars .menu > ul > li:hover ul{ 123 background: #fff ; 124 box-shadow: 4px 4px 4px #000 ; 125} 126.mapapi-ui-minimalist .mapapi-ui-sidebars .menu > ul > li > ul > li:hover > ul{ 127 display: block ; 128 position: absolute ; 129 top: 8px ; 130 right: 100% ; 131 margin-right: -8px ; 132 border-radius: 8px 0 8px 8px ; 133 padding: .25em ; 134 box-shadow: 8px 8px 4px #000 ; 135} 136.mapapi-ui-minimalist .mapapi-ui-sidebars .menu > ul > li > ul > li{ 137 padding-left: 1em ; 138 white-space: pre ; 139} 140.mapapi-ui-minimalist .mapapi-ui-sidebars .menu > ul > li > ul > li:hover, .mapapi-ui-minimalist .mapapi-ui-sidebars .menu > ul > li > ul > li.toggled, .mapapi-ui-minimalist .mapapi-ui-sidebars .menu > ul > li.mapapijs > ul > li{ 141 font-weight: bolder ; 142} 143.mapapi-ui-minimalist .mapapi-ui-sidebars .menu > ul > li > ul > li.toggled{ 144 font-weight: bolder ; 145} 146.mapapi-ui-minimalist .mapapi-ui-sidebars .menu li.childless:hover > ul { 147 display: none ; 148} 149 150.mapapi-ui-minimalist .mapapi-ui-marker{ 151 display: block ; 152 position: absolute ; 153 top: 0 ; 154 left: 0 ; 155} 156 157.mapapi-ui-minimalist .mapapi-ui-infowindow{ 158 display: block ; 159 position: absolute ; 160 top: 0 ; 161 left: 0 ; 162 padding: 0 0 40px 32px ; 163 max-width: 50% ; 164 background: transparent url('marker.png') bottom left no-repeat ; 165} 166.mapapi-ui-minimalist .mapapi-ui-infowindow .mapapi-ui-wrapper{ 167 padding: 1px ; 168 border-radius: 16px ; 169 position: absolute ; 170 bottom: 32px ; 171 left: 0 ; 172 background: #fff url('marker-tail-top-slice.png') bottom left no-repeat ; 173} 174.mapapi-ui-minimalist .mapapi-ui-infowindow .mapapi-ui-item-contents{ 175 background: #fff ; 176 padding: .25em 1em .25em 8px ; 177 border: 2px solid #5a749e ; 178 border-radius: 16px ; 179} 180.mapapi-ui-minimalist .mapapi-ui-infowindow .waiting .mapapi-ui-item-contents{ 181 font-size: 0 ; 182 line-height: 28px ; 183} 184.mapapi-ui-minimalist .mapapi-ui-infowindow .waiting .mapapi-ui-infowindow-close{ 185 display: none ; 186} 187 188 189.mapapi-ui-minimalist .mapapi-ui-infowindow .mapapi-ui-infowindow-close{ 190 position: absolute ; 191 top: 1px ; 192 right: 1px ; 193 width: 1em ; 194 padding: 2px ; 195 text-align: center ; 196 border-radius: 0 16px 0 0 ; 197} 198.mapapi-ui-minimalist .mapapi-ui-infowindow .mapapi-ui-infowindow-close:hover{ 199 background: #eee ; 200 box-shadow: 0px 2px 4px #000 ; 201} 202 203.mapapi-ui-minimalist .mapapi-ui-marker-numbered .mapapi-ui-marker-number, .mapapi-ui-minimalist .mapapi-ui-marker-numbered .mapapi-ui-marker-img{ 204 position: absolute ; 205 top: 0 ; 206 left: 0 ; 207 width: 100% ; 208 height: 100% ; 209 text-align: center ; 210 overflow: hidden ; 211} 212 213.mapapi-net-modal{ 214 position: absolute ; 215 top: 0 ; 216 left: 0 ; 217 width: 100% ; 218 height: 100% ; 219 background: #000 ; 220 background: rgba(0,0,0,.5) ; 221 z-index: 65536 ; 222} 223.mapapi-net-modal > div{ 224 background: #eee ; 225 margin-top: 1em ; 226}