cartodb/Leaflet
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Refactor Label CSS

Browse Source
This commit is contained in:
Yohan Boniface 2016-07-02 10:56:11 +02:00
parent 2f4b97de19
commit 9c8590aebc
1 changed files with 54 additions and 97 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

151
dist/leaflet.css vendored
View File

@ -540,108 +540,65 @@
/* Label */ /* Label */
/* Base styles for the element that has a tooltip */
.leaflet-label { .leaflet-label {
background: white;
background-clip: padding-box;
border-color: white;
border-radius: 2px;
border-style: solid;
border-width: 4px;
color: #111;
display: block;
font: 12px/20px "Helvetica Neue", Arial, Helvetica, sans-serif;
font-weight: bold;
padding: 1px 6px;
position: absolute; position: absolute;
-webkit-user-select: none; padding: 6px;
-moz-user-select: none; background-color: #fff;
-ms-user-select: none; border: 1px solid #222;
user-select: none; color: #222;
pointer-events: none;
white-space: nowrap; white-space: nowrap;
z-index: 6; -webkit-user-select: none;
box-sizing: border-box; -moz-user-select: none;
} -ms-user-select: none;
user-select: none;
pointer-events: none;
}
.leaflet-label.leaflet-clickable { .leaflet-label.leaflet-clickable {
cursor: pointer; cursor: pointer;
pointer-events: auto; pointer-events: auto;
} }
.leaflet-label:before,
.leaflet-label:after {
border-top: 6px solid transparent;
border-bottom: 6px solid transparent;
border-right: 6px solid transparent;
content: none;
position: absolute;
top: 5px;
}
.leaflet-label:before {
border-right: 6px solid black;
border-right-color: inherit;
left: -10px;
}
.leaflet-label:after {
border-left: 6px solid black;
border-left-color: inherit;
right: -16px;
}
.leaflet-label-top:after,
.leaflet-label-top:before, .leaflet-label-top:before,
.leaflet-label-bottom:after, .leaflet-label-bottom:before,
.leaflet-label-bottom:before { .leaflet-label-left:before,
left: -49%; /* IE8 fallback */ .leaflet-label-right:before {
/* Calc include 4 px of border - minus half of the 6px of tip size */ position: absolute;
left: calc(-50% + 1px); pointer-events: none;
position: relative; border: 6px solid transparent;
top: 29px; background: transparent;
}
.leaflet-label-top:after,
.leaflet-label-top:before {
border-top-color: white;
}
.leaflet-label-bottom:after,
.leaflet-label-bottom:before {
border-bottom-color: white;
top: -28px;
}
.leaflet-label-top:before {
display: none;
border-right-color: transparent;
border-bottom-color: transparent;
border-left-color: transparent;
border-top-color: transparent;
}
.leaflet-label-top:after {
content: ' ';
border-right-color: transparent;
border-bottom-color: transparent;
border-left-color: transparent;
}
.leaflet-label-bottom:before {
display: none;
border-right-color: transparent;
border-bottom-color: transparent;
border-left-color: transparent;
border-top-color: transparent;
}
.leaflet-label-bottom:after {
border-right-color: transparent;
border-top-color: transparent;
border-left-color: transparent;
}
.leaflet-label-bottom:after,
.leaflet-label-top:after,
.leaflet-label-right:before,
.leaflet-label-left:after {
content: ""; content: "";
} }
/* Directions */
.leaflet-label-bottom:before,
.leaflet-label-top:before {
left: 50%;
margin-left: -6px;
}
.leaflet-label-top:before {
bottom: 0;
margin-bottom: -12px;
border-top-color: #222;
}
.leaflet-label-bottom:before {
top: 0;
margin-top: -12px;
margin-left: -6px;
border-bottom-color: #222;
}
.leaflet-label-left:before,
.leaflet-label-right:before {
top: 50%;
margin-top: -6px;
}
.leaflet-label-left:before {
right: 0;
margin-right: -12px;
border-left-color: #222;
}
.leaflet-label-right:before {
left: 0;
margin-left: -12px;
border-right-color: #222;
}