diff --git a/css/app.css b/css/app.css index b72ba6145..386479d12 100644 --- a/css/app.css +++ b/css/app.css @@ -54,10 +54,6 @@ a:hover { color:#222; } -table th { - text-align:left; -} - input[type=text] { background-color: white; width:150px; @@ -73,6 +69,19 @@ input[type=text]:focus { border-color:#aaa; } +/* tables */ + +table { + background-color: white; + border-collapse: collapse; + width:100%; + border-spacing:0; +} + +table th { + text-align:left; +} + /* UI Lists ------------------------------------------------------- */ @@ -110,15 +119,14 @@ a.selected { color: white; } +.fl { float: left;} +.fr { float: right;} + div.hide, form.hide { display:none; } -button:hover form.hide { - display: block; -} - /* Buttons */ button { @@ -249,6 +257,7 @@ button.action .label { } /* Definitions for every icon */ + .icon.browse { background-position: 0px 0px;} .icon.add-place { background-position: -20px 0px;} .icon.add-road { background-position: -40px 0px;} @@ -365,12 +374,6 @@ button.Browse .label { width:150px; } -.inspector-wrap table { - border-collapse: collapse; - width:100%; - border-spacing:0; -} - .inspector-wrap .tag-table-wrap { max-height:350px; border-top: 1px solid #ccc; @@ -383,7 +386,6 @@ button.Browse .label { } .inspector-wrap .buttons { - margin-top: 10px; border-top: 1px solid #ccc; } diff --git a/img/source/sprite.svg b/img/source/sprite.svg index 5e676130d..f5e1eee15 100644 --- a/img/source/sprite.svg +++ b/img/source/sprite.svg @@ -27,9 +27,9 @@ borderopacity="1.0" inkscape:pageopacity="0.0" inkscape:pageshadow="2" - inkscape:zoom="16" - inkscape:cx="298.70699" - inkscape:cy="157.19463" + inkscape:zoom="11.313708" + inkscape:cx="291.89171" + inkscape:cy="165.02789" inkscape:document-units="px" inkscape:current-layer="layer12" showgrid="true" @@ -141,10 +141,6 @@ orientation="0,1" position="145,60" id="guide47496" /> - diff --git a/img/sprite.png b/img/sprite.png index 581045621..105533bc6 100644 Binary files a/img/sprite.png and b/img/sprite.png differ diff --git a/js/id/ui/inspector.js b/js/id/ui/inspector.js index 416661a94..e215d8b5b 100644 --- a/js/id/ui/inspector.js +++ b/js/id/ui/inspector.js @@ -58,25 +58,21 @@ iD.Inspector = function() { selection.append('div') .attr('class', 'head inspector-inner').call(drawhead); - var table = selection - .append('div').attr('class', 'inspector-inner tag-table-wrap') - .append('table').attr('class', 'inspector'); + var inspectorwrap = selection + .append('ul').attr('class', 'inspector-inner tag-table-wrap fillL2') - table.append('thead').append('tr').selectAll('th') + inspectorwrap .data(['tag', 'value', '']) .enter() - .append('th').text(String); - - var tbody = table.append('tbody'); function draw(data) { - var tr = tbody.selectAll('tr') + var tr = inspectorwrap.selectAll('li') .data(d3.entries(data)); tr.exit().remove(); - var row = tr.enter().append('tr'); - var valuetds = row.selectAll('td') + var row = tr.enter().append('li'); + var valuetds = row.selectAll('input') .data(function(d) { return [d, d]; }); - valuetds.enter().append('td').append('input') + valuetds.enter().append('input') .property('value', function(d, i) { return d[i ? 'value' : 'key']; }) .on('keyup.update', function(d, i) { d[i ? 'value' : 'key'] = this.value; @@ -93,8 +89,8 @@ iD.Inspector = function() { }); })); }); - - row.append('td').attr('class', 'tag-help').append('a') + row.append('button').attr('class','remove'); + row.append('a').attr('class', 'tag-help button') .text('?') .attr('target', '_blank') .attr('tabindex', -1) @@ -118,7 +114,7 @@ iD.Inspector = function() { function grabtags() { var grabbed = {}; function grab(d) { grabbed[d.key] = d.value; } - tbody.selectAll('td').each(grab); + inspectorwrap.selectAll('input').each(grab); return grabbed; } @@ -145,7 +141,7 @@ iD.Inspector = function() { event.close(entity); }); selection.append('button') - .attr('class', 'delete wide action') + .attr('class', 'delete wide action fr') .html("Delete") .on('click', function(entity) { event.remove(entity); }); }