Get rid of extra form-label-button-wrap div

Buttons can now be directly appended to the form-field-label flex container
This commit is contained in:
Bryan Housel
2018-11-27 09:14:11 -05:00
parent d2687d9068
commit 986b663c9e
5 changed files with 42 additions and 59 deletions
+8 -12
View File
@@ -106,20 +106,16 @@ export function uiField(context, presetField, entity, options) {
if (options.wrap) {
var label = enter
.append('label')
.attr('class', 'form-label')
.attr('class', 'form-field-label')
.attr('for', function(d) { return 'preset-input-' + d.safeid; });
label
.append('span')
.attr('class', 'label-text')
.text(function(d) { return d.label(); });
var wrap = label
.append('div')
.attr('class', 'form-label-button-wrap');
if (options.remove) {
wrap
label
.append('button')
.attr('class', 'remove-icon')
.attr('title', t('icons.remove'))
@@ -128,7 +124,7 @@ export function uiField(context, presetField, entity, options) {
}
if (options.revert) {
wrap
label
.append('button')
.attr('class', 'modified-icon')
.attr('title', t('icons.undo'))
@@ -142,10 +138,10 @@ export function uiField(context, presetField, entity, options) {
container = container
.merge(enter);
container.selectAll('.form-label-button-wrap .remove-icon')
container.selectAll('.form-field-label > .remove-icon')
.on('click', remove);
container.selectAll('.form-label-button-wrap .modified-icon')
container.selectAll('.form-field-label > .modified-icon')
.on('click', revert);
container
@@ -179,7 +175,7 @@ export function uiField(context, presetField, entity, options) {
if (help) {
d3_select(this)
.call(help.body)
.select('.form-label-button-wrap')
.select('.form-field-label')
.call(help.button);
}
@@ -187,7 +183,7 @@ export function uiField(context, presetField, entity, options) {
if (reference) {
d3_select(this)
.call(reference.body)
.select('.form-label-button-wrap')
.select('.form-field-label')
.call(reference.button);
}
+1 -3
View File
@@ -335,7 +335,7 @@ export function uiFieldLocalized(field, context) {
var label = wrap
.append('label')
.attr('class', 'form-label');
.attr('class', 'form-field-label');
label
.append('span')
@@ -343,8 +343,6 @@ export function uiFieldLocalized(field, context) {
.text(t('translate.localized_translation_label'));
label
.append('div')
.attr('class', 'form-label-button-wrap')
.append('button')
.attr('class', 'minor remove-icon-multilingual')
.on('click', function(d){
+18 -16
View File
@@ -145,8 +145,9 @@ export function uiRawMemberEditor(context) {
utilHighlightEntity(d.id, false, context);
});
var label = d3_select(this).append('label')
.attr('class', 'form-label');
var label = d3_select(this)
.append('label')
.attr('class', 'form-field-label');
var labelLink = label
.append('span')
@@ -155,21 +156,21 @@ export function uiRawMemberEditor(context) {
.attr('href', '#')
.on('click', selectMember);
labelLink.append('span')
labelLink
.append('span')
.attr('class', 'member-entity-type')
.text(function(d) {
var matched = context.presets().match(d.member, context.graph());
return (matched && matched.name()) || utilDisplayType(d.member.id);
});
labelLink.append('span')
labelLink
.append('span')
.attr('class', 'member-entity-name')
.text(function(d) { return utilDisplayName(d.member); });
var buttonWrap = label.append('div')
.attr('class', 'form-label-button-wrap');
buttonWrap.append('button')
label
.append('button')
.attr('class', 'download-icon')
.attr('title', t('icons.zoom_to'))
.attr('tabindex', -1)
@@ -177,25 +178,26 @@ export function uiRawMemberEditor(context) {
.on('click', zoomToMember);
} else {
var incompleteLabel = d3_select(this).append('label')
.attr('class', 'form-label');
var incompleteLabel = d3_select(this)
.append('label')
.attr('class', 'form-field-label');
var labelText = incompleteLabel
.append('span')
.attr('class', 'label-text');
labelText.append('span')
labelText
.append('span')
.attr('class', 'member-entity-type')
.text(t('inspector.'+d.type, { id: d.id }));
labelText.append('span')
labelText
.append('span')
.attr('class', 'member-entity-name')
.text(t('inspector.incomplete', { id: d.id }));
var wrap = incompleteLabel.append('div')
.attr('class', 'form-label-button-wrap');
wrap.append('button')
incompleteLabel
.append('button')
.attr('class', 'download-icon')
.attr('title', t('icons.download'))
.attr('tabindex', -1)
+1 -1
View File
@@ -189,7 +189,7 @@ export function uiRawMembershipEditor(context) {
var label = enter
.append('label')
.attr('class', 'form-label')
.attr('class', 'form-field-label')
.append('span')
.attr('class', 'label-text')
.append('a')