diff --git a/css/app.css b/css/app.css
index d7ac60fb7..2b956888b 100644
--- a/css/app.css
+++ b/css/app.css
@@ -234,7 +234,7 @@ ul.toggle-list {
ul.toggle-list li a {
position: relative;
- padding: 5px 10px 5px 25px;
+ padding: 5px 10px 5px 30px;
display:block;
border-top: 1px solid #ccc;
}
@@ -273,13 +273,13 @@ ul.link-list li:last-child {
content: "";
display: inline-block;
border-radius: 50%;
- height: 12px;
- width: 12px;
+ height: 16px;
+ width: 16px;
margin-right: 10px;
border: 1px solid #CCC;
position: absolute;
left: 5px;
- top: 8px;
+ top: 5px;
}
.toggle-list a:hover::before {
@@ -291,6 +291,19 @@ ul.link-list li:last-child {
box-shadow: inset 0 0 0 2px white;
}
+.toggle-list.check-list a::before {
+ border-radius: 2px;
+}
+
+.toggle-list.check-list a:hover::before {
+ background: white url(img/sprite.svg) no-repeat -480px -0px;
+ box-shadow: none;
+}
+
+.toggle-list.check-list a.selected::before {
+ background: white url(img/sprite.svg) no-repeat -480px -20px;
+}
+
/* Utility Classes
------------------------------------------------------- */
.fillL {
@@ -1124,20 +1137,20 @@ input[type=number] {
border-bottom: 1px solid #CCC;
color: #7092FF;
width: 100%;
- padding-left: 25px;
+ padding-left: 30px;
}
.radio-wrap button::before {
content: "";
display: inline-block;
border-radius: 50%;
- height: 12px;
- width: 12px;
+ height: 16px;
+ width: 16px;
margin-right: 10px;
border: 1px solid #CCC;
position: absolute;
left: 5px;
- top: 8px;
+ top: 5px;
}
.radio-wrap button:hover::before {
diff --git a/dist/img/sprite.svg b/dist/img/sprite.svg
index 680ef2ce2..7c4d05738 100644
--- a/dist/img/sprite.svg
+++ b/dist/img/sprite.svg
@@ -38,22 +38,22 @@
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
- inkscape:zoom="18.189894"
- inkscape:cx="263.82239"
- inkscape:cy="300.42147"
+ inkscape:zoom="16"
+ inkscape:cx="471.57386"
+ inkscape:cy="545.41375"
inkscape:document-units="px"
inkscape:current-layer="layer12"
showgrid="true"
- inkscape:window-width="1483"
- inkscape:window-height="804"
- inkscape:window-x="35"
+ inkscape:window-width="1280"
+ inkscape:window-height="756"
+ inkscape:window-x="56"
inkscape:window-y="0"
inkscape:window-maximized="0"
fit-margin-top="0"
fit-margin-left="0"
fit-margin-right="0"
fit-margin-bottom="0"
- showguides="false"
+ showguides="true"
inkscape:guide-bbox="true"
inkscape:snap-bbox="true"
inkscape:snap-nodes="true"
@@ -228,7 +228,7 @@
image/svg+xml
-
+
@@ -377,13 +377,6 @@
id="path3769"
inkscape:connector-curvature="0"
sodipodi:nodetypes="ccccccccc" />
-
@@ -925,7 +918,7 @@
transform="translate(10.000004,-1.9999957)">
@@ -959,11 +952,11 @@
sodipodi:cy="-129.34375"
sodipodi:rx="3.46875"
sodipodi:ry="3.46875"
- d="m 106.03125,-129.34375 a 3.46875,3.46875 0 1 1 -6.9375,0 3.46875,3.46875 0 1 1 6.9375,0 z"
+ d="m 106.03125,-129.34375 c 0,1.91574 -1.55301,3.46875 -3.46875,3.46875 -1.91574,0 -3.46875,-1.55301 -3.46875,-3.46875 0,-1.91574 1.55301,-3.46875 3.46875,-3.46875 1.91574,0 3.46875,1.55301 3.46875,3.46875 z"
transform="matrix(1.009009,0,0,1.009009,-411.98649,15.371188)" />
@@ -1015,11 +1008,11 @@
sodipodi:cy="-129.34375"
sodipodi:rx="3.46875"
sodipodi:ry="3.46875"
- d="m 106.03125,-129.34375 a 3.46875,3.46875 0 1 1 -6.9375,0 3.46875,3.46875 0 1 1 6.9375,0 z"
+ d="m 106.03125,-129.34375 c 0,1.91574 -1.55301,3.46875 -3.46875,3.46875 -1.91574,0 -3.46875,-1.55301 -3.46875,-3.46875 0,-1.91574 1.55301,-3.46875 3.46875,-3.46875 1.91574,0 3.46875,1.55301 3.46875,3.46875 z"
transform="matrix(1.009009,0,0,1.009009,-410.98649,15.371188)" />
@@ -1099,11 +1092,11 @@
sodipodi:cy="-129.34375"
sodipodi:rx="3.46875"
sodipodi:ry="3.46875"
- d="m 106.03125,-129.34375 a 3.46875,3.46875 0 1 1 -6.9375,0 3.46875,3.46875 0 1 1 6.9375,0 z"
+ d="m 106.03125,-129.34375 c 0,1.91574 -1.55301,3.46875 -3.46875,3.46875 -1.91574,0 -3.46875,-1.55301 -3.46875,-3.46875 0,-1.91574 1.55301,-3.46875 3.46875,-3.46875 1.91574,0 3.46875,1.55301 3.46875,3.46875 z"
transform="matrix(1.009009,0,0,1.009009,-410.98649,14.371188)" />
@@ -1149,7 +1142,7 @@
transform="translate(10.000004,-1.9999957)">
@@ -1183,11 +1176,11 @@
sodipodi:cy="-129.34375"
sodipodi:rx="3.46875"
sodipodi:ry="3.46875"
- d="m 106.03125,-129.34375 a 3.46875,3.46875 0 1 1 -6.9375,0 3.46875,3.46875 0 1 1 6.9375,0 z"
+ d="m 106.03125,-129.34375 c 0,1.91574 -1.55301,3.46875 -3.46875,3.46875 -1.91574,0 -3.46875,-1.55301 -3.46875,-3.46875 0,-1.91574 1.55301,-3.46875 3.46875,-3.46875 1.91574,0 3.46875,1.55301 3.46875,3.46875 z"
transform="matrix(1.009009,0,0,1.009009,-411.98649,15.371188)" />
@@ -1239,11 +1232,11 @@
sodipodi:cy="-129.34375"
sodipodi:rx="3.46875"
sodipodi:ry="3.46875"
- d="m 106.03125,-129.34375 a 3.46875,3.46875 0 1 1 -6.9375,0 3.46875,3.46875 0 1 1 6.9375,0 z"
+ d="m 106.03125,-129.34375 c 0,1.91574 -1.55301,3.46875 -3.46875,3.46875 -1.91574,0 -3.46875,-1.55301 -3.46875,-3.46875 0,-1.91574 1.55301,-3.46875 3.46875,-3.46875 1.91574,0 3.46875,1.55301 3.46875,3.46875 z"
transform="matrix(1.009009,0,0,1.009009,-410.98649,15.371188)" />
@@ -1338,11 +1331,11 @@
sodipodi:cy="-129.34375"
sodipodi:rx="3.46875"
sodipodi:ry="3.46875"
- d="m 106.03125,-129.34375 a 3.46875,3.46875 0 1 1 -6.9375,0 3.46875,3.46875 0 1 1 6.9375,0 z"
+ d="m 106.03125,-129.34375 c 0,1.91574 -1.55301,3.46875 -3.46875,3.46875 -1.91574,0 -3.46875,-1.55301 -3.46875,-3.46875 0,-1.91574 1.55301,-3.46875 3.46875,-3.46875 1.91574,0 3.46875,1.55301 3.46875,3.46875 z"
transform="matrix(1.009009,0,0,1.009009,-410.98649,14.371188)" />
@@ -1388,7 +1381,7 @@
transform="translate(10.000004,-1.9999957)">
@@ -1422,11 +1415,11 @@
sodipodi:cy="-129.34375"
sodipodi:rx="3.46875"
sodipodi:ry="3.46875"
- d="m 106.03125,-129.34375 a 3.46875,3.46875 0 1 1 -6.9375,0 3.46875,3.46875 0 1 1 6.9375,0 z"
+ d="m 106.03125,-129.34375 c 0,1.91574 -1.55301,3.46875 -3.46875,3.46875 -1.91574,0 -3.46875,-1.55301 -3.46875,-3.46875 0,-1.91574 1.55301,-3.46875 3.46875,-3.46875 1.91574,0 3.46875,1.55301 3.46875,3.46875 z"
transform="matrix(1.009009,0,0,1.009009,-411.98649,15.371188)" />
+
+
+
+
+
+
diff --git a/js/id/ui/background.js b/js/id/ui/background.js
index 5fa0bf25a..56f239f4c 100644
--- a/js/id/ui/background.js
+++ b/js/id/ui/background.js
@@ -240,12 +240,12 @@ iD.ui.Background = function(context) {
var overlayList = content
.append('ul')
- .attr('class', 'toggle-list');
+ .attr('class', 'toggle-list check-list');
var gpxLayerItem = content
.append('ul')
.style('display', iD.detect().filedrop ? 'block' : 'none')
- .attr('class', 'toggle-list')
+ .attr('class', 'toggle-list check-list')
.append('li')
.append('a')
.classed('layer-toggle-gpx', true)