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');