diff --git a/css/app.css b/css/app.css index a6e2d59ee..1d190d4af 100644 --- a/css/app.css +++ b/css/app.css @@ -914,17 +914,9 @@ a:hover .icon.out-link { background-position: -500px -14px;} background-color: #F6F6F6; } -.inspector-preset .form-field { - padding-left: 20px; - padding-right: 20px; -} - -.inspector-preset .form-field:first-child { - margin-top: 10px; -} - -.inspector-preset .form-field:last-child { - padding-bottom: 20px; +.form-field { + margin-bottom: 10px; + width: 100%; } .form-label { @@ -1026,14 +1018,9 @@ a:hover .icon.out-link { background-position: -500px -14px;} /* adding additional preset fields */ .more-buttons { - margin-top: 20px; border-top: 1px solid #CCC; } -.more-buttons:nth-last-child(2) { - border-bottom: 1px solid #CCC; -} - button.preset-add-field { width: 25%; height: 40px; diff --git a/js/id/ui/preset.js b/js/id/ui/preset.js index 71799bdfe..af0b63f12 100644 --- a/js/id/ui/preset.js +++ b/js/id/ui/preset.js @@ -73,7 +73,13 @@ iD.ui.preset = function(context) { var shown = fields.filter(function(field) { return field.shown(); }), notShown = fields.filter(function(field) { return !field.shown(); }); - var $fields = selection.selectAll('.form-field') + var $form = selection.selectAll('form') + .data([0]); + + $form.enter().append('form') + .attr('class', 'preset-form inspector-inner col12'); + + var $fields = $form.selectAll('.form-field') .data(shown, fieldKey); // Enter @@ -81,7 +87,7 @@ iD.ui.preset = function(context) { var $enter = $fields.enter() .insert('div', '.more-buttons') .attr('class', function(field) { - return 'form-field form-field-' + field.id + ' col12'; + return 'form-field form-field-' + field.id; }); var $label = $enter.append('label')