Ignore:
Timestamp:
Jan 31, 2018, 2:52:42 PM (7 years ago)
Author:
alloc
Message:

Fixes

File:
1 edited

Legend:

Unmodified
Added
Removed

  • binary-improvements/webserver/leaflet/leaflet.css

    r133 r315  
    11/* required styles */
    22
    3 .leaflet-map-pane,
     3.leaflet-pane,
    44.leaflet-tile,
    55.leaflet-marker-icon,
    66.leaflet-marker-shadow,
    7 .leaflet-tile-pane,
    87.leaflet-tile-container,
    9 .leaflet-overlay-pane,
    10 .leaflet-shadow-pane,
    11 .leaflet-marker-pane,
    12 .leaflet-popup-pane,
    13 .leaflet-overlay-pane svg,
     8.leaflet-pane > svg,
     9.leaflet-pane > canvas,
    1410.leaflet-zoom-box,
    1511.leaflet-image-layer,
    … …  
    2117.leaflet-container {
    2218        overflow: hidden;
    23         -ms-touch-action: none;
    2419        }
    2520.leaflet-tile,
    … …  
    2924           -moz-user-select: none;
    3025                user-select: none;
    31         -webkit-user-drag: none;
     26          -webkit-user-drag: none;
     27        }
     28/* Safari renders non-retina tile on retina better with this, but Chrome is worse */
     29.leaflet-safari .leaflet-tile {
     30        image-rendering: -webkit-optimize-contrast;
     31        }
     32/* hack that prevents hw layers "stretching" when loading new tiles */
     33.leaflet-safari .leaflet-tile-container {
     34        width: 1600px;
     35        height: 1600px;
     36        -webkit-transform-origin: 0 0;
    3237        }
    3338.leaflet-marker-icon,
    … …  
    3540        display: block;
    3641        }
    37 /* map is broken in FF if you have max-width: 100% on tiles */
    38 .leaflet-container img {
     42/* .leaflet-container svg: reset svg max-width decleration shipped in Joomla! (joomla.org) 3.x */
     43/* .leaflet-container img: map is broken in FF if you have max-width: 100% on tiles */
     44.leaflet-container .leaflet-overlay-pane svg,
     45.leaflet-container .leaflet-marker-pane img,
     46.leaflet-container .leaflet-shadow-pane img,
     47.leaflet-container .leaflet-tile-pane img,
     48.leaflet-container img.leaflet-image-layer {
    3949        max-width: none !important;
    4050        }
    41 /* stupid Android 2 doesn't understand "max-width: none" properly */
    42 .leaflet-container img.leaflet-image-layer {
    43         max-width: 15000px !important;
    44         }
     51
     52.leaflet-container.leaflet-touch-zoom {
     53        -ms-touch-action: pan-x pan-y;
     54        touch-action: pan-x pan-y;
     55        }
     56.leaflet-container.leaflet-touch-drag {
     57        -ms-touch-action: pinch-zoom;
     58        }
     59.leaflet-container.leaflet-touch-drag.leaflet-touch-zoom {
     60        -ms-touch-action: none;
     61        touch-action: none;
     62}
     63.leaflet-container {
     64        -webkit-tap-highlight-color: transparent;
     65}
     66.leaflet-container a {
     67        -webkit-tap-highlight-color: rgba(51, 181, 229, 0.4);
     68}
    4569.leaflet-tile {
    4670        filter: inherit;
    … …  
    5377        width: 0;
    5478        height: 0;
     79        -moz-box-sizing: border-box;
     80             box-sizing: border-box;
     81        z-index: 800;
    5582        }
    5683/* workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=888319 */
    … …  
    5986        }
    6087
    61 .leaflet-tile-pane    { z-index: 2; }
    62 .leaflet-objects-pane { z-index: 3; }
    63 .leaflet-overlay-pane { z-index: 4; }
    64 .leaflet-shadow-pane  { z-index: 5; }
    65 .leaflet-marker-pane  { z-index: 6; }
    66 .leaflet-popup-pane   { z-index: 7; }
     88.leaflet-pane         { z-index: 400; }
     89
     90.leaflet-tile-pane    { z-index: 200; }
     91.leaflet-overlay-pane { z-index: 400; }
     92.leaflet-shadow-pane  { z-index: 500; }
     93.leaflet-marker-pane  { z-index: 600; }
     94.leaflet-tooltip-pane   { z-index: 650; }
     95.leaflet-popup-pane   { z-index: 700; }
     96
     97.leaflet-map-pane canvas { z-index: 100; }
     98.leaflet-map-pane svg    { z-index: 200; }
    6799
    68100.leaflet-vml-shape {
    … …  
    81113.leaflet-control {
    82114        position: relative;
    83         z-index: 7;
     115        z-index: 800;
     116        pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */
    84117        pointer-events: auto;
    85118        }
    … …  
    125158/* zoom and fade animations */
    126159
    127 .leaflet-fade-anim .leaflet-tile,
     160.leaflet-fade-anim .leaflet-tile {
     161        will-change: opacity;
     162        }
    128163.leaflet-fade-anim .leaflet-popup {
    129164        opacity: 0;
    … …  
    133168                transition: opacity 0.2s linear;
    134169        }
    135 .leaflet-fade-anim .leaflet-tile-loaded,
    136170.leaflet-fade-anim .leaflet-map-pane .leaflet-popup {
    137171        opacity: 1;
    138172        }
    139 
     173.leaflet-zoom-animated {
     174        -webkit-transform-origin: 0 0;
     175            -ms-transform-origin: 0 0;
     176                transform-origin: 0 0;
     177        }
     178.leaflet-zoom-anim .leaflet-zoom-animated {
     179        will-change: transform;
     180        }
    140181.leaflet-zoom-anim .leaflet-zoom-animated {
    141182        -webkit-transition: -webkit-transform 0.25s cubic-bezier(0,0,0.25,1);
    … …  
    145186        }
    146187.leaflet-zoom-anim .leaflet-tile,
    147 .leaflet-pan-anim .leaflet-tile,
    148 .leaflet-touching .leaflet-zoom-animated {
     188.leaflet-pan-anim .leaflet-tile {
    149189        -webkit-transition: none;
    150190           -moz-transition: none;
    … …  
    160200/* cursors */
    161201
    162 .leaflet-clickable {
     202.leaflet-interactive {
    163203        cursor: pointer;
    164204        }
    165 .leaflet-container {
     205.leaflet-grab {
    166206        cursor: -webkit-grab;
    167207        cursor:    -moz-grab;
     208        }
     209.leaflet-crosshair,
     210.leaflet-crosshair .leaflet-interactive {
     211        cursor: crosshair;
    168212        }
    169213.leaflet-popup-pane,
    … …  
    171215        cursor: auto;
    172216        }
    173 .leaflet-dragging .leaflet-container,
    174 .leaflet-dragging .leaflet-clickable {
     217.leaflet-dragging .leaflet-grab,
     218.leaflet-dragging .leaflet-grab .leaflet-interactive,
     219.leaflet-dragging .leaflet-marker-draggable {
    175220        cursor: move;
    176221        cursor: -webkit-grabbing;
    … …  
    178223        }
    179224
     225/* marker & overlays interactivity */
     226.leaflet-marker-icon,
     227.leaflet-marker-shadow,
     228.leaflet-image-layer,
     229.leaflet-pane > svg path,
     230.leaflet-tile-container {
     231        pointer-events: none;
     232        }
     233
     234.leaflet-marker-icon.leaflet-interactive,
     235.leaflet-image-layer.leaflet-interactive,
     236.leaflet-pane > svg path.leaflet-interactive {
     237        pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */
     238        pointer-events: auto;
     239        }
    180240
    181241/* visual tweaks */
    … …  
    250310        line-height: 30px;
    251311        }
    252 
     312.leaflet-touch .leaflet-bar a:first-child {
     313        border-top-left-radius: 2px;
     314        border-top-right-radius: 2px;
     315        }
     316.leaflet-touch .leaflet-bar a:last-child {
     317        border-bottom-left-radius: 2px;
     318        border-bottom-right-radius: 2px;
     319        }
    253320
    254321/* zoom control */
    … …  
    259326        text-indent: 1px;
    260327        }
    261 .leaflet-control-zoom-out {
    262         font-size: 20px;
    263         }
    264 
    265 .leaflet-touch .leaflet-control-zoom-in {
     328
     329.leaflet-touch .leaflet-control-zoom-in, .leaflet-touch .leaflet-control-zoom-out  {
    266330        font-size: 22px;
    267         }
    268 .leaflet-touch .leaflet-control-zoom-out {
    269         font-size: 24px;
    270331        }
    271332
    … …  
    304365        background: #fff;
    305366        }
     367.leaflet-control-layers-scrollbar {
     368        overflow-y: scroll;
     369        overflow-x: hidden;
     370        padding-right: 5px;
     371        }
    306372.leaflet-control-layers-selector {
    307373        margin-top: 2px;
    … …  
    316382        border-top: 1px solid #ddd;
    317383        margin: 5px -10px 5px -6px;
     384        }
     385
     386/* Default icon URLs */
     387.leaflet-default-icon-path {
     388        background-image: url(images/marker-icon.png);
    318389        }
    319390
    … …  
    355426        white-space: nowrap;
    356427        overflow: hidden;
    357         -moz-box-sizing: content-box;
    358              box-sizing: content-box;
     428        -moz-box-sizing: border-box;
     429             box-sizing: border-box;
    359430
    360431        background: #fff;
    … …  
    387458        position: absolute;
    388459        text-align: center;
     460        margin-bottom: 20px;
    389461        }
    390462.leaflet-popup-content-wrapper {
    … …  
    401473        }
    402474.leaflet-popup-tip-container {
    403         margin: 0 auto;
    404475        width: 40px;
    405476        height: 20px;
    406         position: relative;
     477        position: absolute;
     478        left: 50%;
     479        margin-left: -20px;
    407480        overflow: hidden;
     481        pointer-events: none;
    408482        }
    409483.leaflet-popup-tip {
    … …  
    423497.leaflet-popup-tip {
    424498        background: white;
    425 
     499        color: #333;
    426500        box-shadow: 0 3px 14px rgba(0,0,0,0.4);
    427501        }
    … …  
    431505        right: 0;
    432506        padding: 4px 4px 0 0;
     507        border: none;
    433508        text-align: center;
    434509        width: 18px;
    … …  
    477552        border: 1px solid #666;
    478553        }
     554
     555
     556/* Tooltip */
     557/* Base styles for the element that has a tooltip */
     558.leaflet-tooltip {
     559        position: absolute;
     560        padding: 6px;
     561        background-color: #fff;
     562        border: 1px solid #fff;
     563        border-radius: 3px;
     564        color: #222;
     565        white-space: nowrap;
     566        -webkit-user-select: none;
     567        -moz-user-select: none;
     568        -ms-user-select: none;
     569        user-select: none;
     570        pointer-events: none;
     571        box-shadow: 0 1px 3px rgba(0,0,0,0.4);
     572        }
     573.leaflet-tooltip.leaflet-clickable {
     574        cursor: pointer;
     575        pointer-events: auto;
     576        }
     577.leaflet-tooltip-top:before,
     578.leaflet-tooltip-bottom:before,
     579.leaflet-tooltip-left:before,
     580.leaflet-tooltip-right:before {
     581        position: absolute;
     582        pointer-events: none;
     583        border: 6px solid transparent;
     584        background: transparent;
     585        content: "";
     586        }
     587
     588/* Directions */
     589
     590.leaflet-tooltip-bottom {
     591        margin-top: 6px;
     592}
     593.leaflet-tooltip-top {
     594        margin-top: -6px;
     595}
     596.leaflet-tooltip-bottom:before,
     597.leaflet-tooltip-top:before {
     598        left: 50%;
     599        margin-left: -6px;
     600        }
     601.leaflet-tooltip-top:before {
     602        bottom: 0;
     603        margin-bottom: -12px;
     604        border-top-color: #fff;
     605        }
     606.leaflet-tooltip-bottom:before {
     607        top: 0;
     608        margin-top: -12px;
     609        margin-left: -6px;
     610        border-bottom-color: #fff;
     611        }
     612.leaflet-tooltip-left {
     613        margin-left: -6px;
     614}
     615.leaflet-tooltip-right {
     616        margin-left: 6px;
     617}
     618.leaflet-tooltip-left:before,
     619.leaflet-tooltip-right:before {
     620        top: 50%;
     621        margin-top: -6px;
     622        }
     623.leaflet-tooltip-left:before {
     624        right: 0;
     625        margin-right: -12px;
     626        border-left-color: #fff;
     627        }
     628.leaflet-tooltip-right:before {
     629        left: 0;
     630        margin-left: -12px;
     631        border-right-color: #fff;
     632        }
Note: See TracChangeset for help on using the changeset viewer.