diff --git a/debug/map/controls.html b/debug/map/controls.html
index b336ff5b..9204def6 100644
--- a/debug/map/controls.html
+++ b/debug/map/controls.html
@@ -25,11 +25,11 @@
cloudmade = new L.TileLayer(getCloudMadeUrl(997), {attribution: cloudmadeAttribution}),
cloudmade2 = new L.TileLayer(getCloudMadeUrl(998), {attribution: 'Hello world'});
- var map = new L.Map('map').addLayer(cloudmade).setView(new L.LatLng(50.5, 30.51), 15);
+ var map = new L.Map('map').addLayer(cloudmade).setView(new L.LatLng(50.5, 30.512), 15);
- var marker = new L.CircleMarker(new L.LatLng(50.5, 30.505), {color: 'red'});
+ var marker = new L.Marker(new L.LatLng(50.5, 30.505), {color: 'red'});
map.addLayer(marker);
- marker.bindPopup("Hello World").openPopup();
+ marker.bindPopup("Leaflet is designed with simplicity, performance and usability in mind. It works efficiently across all major desktop and mobile platforms out of the box, taking advantage of HTML5 and CSS3 on modern browsers while still being accessible on older ones.").openPopup();
var marker2 = new L.Marker(new L.LatLng(50.502, 30.515));
map.addLayer(marker2);
diff --git a/dist/images/layers-2x.png b/dist/images/layers-2x.png
new file mode 100644
index 00000000..a2cf7f9e
Binary files /dev/null and b/dist/images/layers-2x.png differ
diff --git a/dist/images/layers.png b/dist/images/layers.png
index ef90a080..bca0a0e4 100644
Binary files a/dist/images/layers.png and b/dist/images/layers.png differ
diff --git a/dist/leaflet.css b/dist/leaflet.css
index 0f613271..ddb7e6b8 100644
--- a/dist/leaflet.css
+++ b/dist/leaflet.css
@@ -283,14 +283,18 @@
.leaflet-control-layers {
box-shadow: 0 1px 7px rgba(0,0,0,0.4);
background: #f8f8f9;
- -webkit-border-radius: 8px;
- border-radius: 8px;
+ -webkit-border-radius: 5px;
+ border-radius: 5px;
}
.leaflet-control-layers-toggle {
background-image: url(images/layers.png);
width: 36px;
height: 36px;
}
+.leaflet-retina .leaflet-control-layers-toggle {
+ background-image: url(images/layers-2x.png);
+ background-size: 26px 26px;
+ }
.leaflet-touch .leaflet-control-layers-toggle {
width: 44px;
height: 44px;
@@ -388,11 +392,11 @@
.leaflet-popup-content-wrapper {
padding: 1px;
text-align: left;
- -webkit-border-radius: 20px;
- border-radius: 20px;
+ -webkit-border-radius: 12px;
+ border-radius: 12px;
}
.leaflet-popup-content {
- margin: 14px 20px;
+ margin: 13px 19px;
line-height: 1.4;
}
.leaflet-popup-content p {
@@ -406,11 +410,11 @@
overflow: hidden;
}
.leaflet-popup-tip {
- width: 15px;
- height: 15px;
+ width: 17px;
+ height: 17px;
padding: 1px;
- margin: -8px auto 0;
+ margin: -10px auto 0;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
@@ -427,7 +431,7 @@
position: absolute;
top: 0;
right: 0;
- padding: 4px 5px 0 0;
+ padding: 4px 4px 0 0;
text-align: center;
width: 18px;
height: 14px;
diff --git a/src/map/Map.js b/src/map/Map.js
index 6bdd84cf..1bc2bfc9 100644
--- a/src/map/Map.js
+++ b/src/map/Map.js
@@ -483,15 +483,10 @@ L.Map = L.Class.extend({
_initLayout: function () {
var container = this._container;
- L.DomUtil.addClass(container, 'leaflet-container');
-
- if (L.Browser.touch) {
- L.DomUtil.addClass(container, 'leaflet-touch');
- }
-
- if (this.options.fadeAnimation) {
- L.DomUtil.addClass(container, 'leaflet-fade-anim');
- }
+ L.DomUtil.addClass(container, 'leaflet-container' +
+ (L.Browser.touch ? ' leaflet-touch' : '') +
+ (L.Browser.retina ? ' leaflet-retina' : '') +
+ (this.options.fadeAnimation ? ' leaflet-fade-anim' : ''));
var position = L.DomUtil.getStyle(container, 'position');