mirror of
https://github.com/gtritchie/bulk-properties.git
synced 2026-07-22 06:08:37 +00:00
Move delete button to the select/deselect row (#50)
* Move "Delete selected" button to select/deselect row Addresses #48: the warning-red delete button next to the lighter-red "Update properties" CTA drew the eye toward delete and made update look inactive. Move delete to the Select all / Deselect all row, left-justified, with the same styling as the sibling buttons. * Let selection row span full modal width The "Delete selected" button was only pushed left within the right half of the row. Hide the empty .setting-item-info on this row so the control area spans the modal, letting margin-right: auto put Delete at the left edge while Select all / Deselect all stay on the right.
This commit is contained in:
parent
4d53ba0e27
commit
eaf24746b3
2 changed files with 18 additions and 14 deletions
|
|
@ -182,7 +182,14 @@ export class BulkEditModal extends Modal {
|
|||
});
|
||||
}
|
||||
|
||||
new Setting(contentEl)
|
||||
const selectionRow = new Setting(contentEl)
|
||||
.addButton(btn => {
|
||||
btn.setButtonText("Delete selected").onClick(() => {
|
||||
void this.doDelete();
|
||||
});
|
||||
this.deleteBtn = btn.buttonEl;
|
||||
this.deleteBtn.addClass("bulk-properties-delete-btn");
|
||||
})
|
||||
.addButton(btn => {
|
||||
btn.setButtonText("Select all").onClick(() => {
|
||||
void this.bulkSetSelection(true);
|
||||
|
|
@ -195,6 +202,7 @@ export class BulkEditModal extends Modal {
|
|||
});
|
||||
this.deselectAllBtn = btn.buttonEl;
|
||||
});
|
||||
selectionRow.settingEl.addClass("bulk-properties-selection-row");
|
||||
|
||||
const editableProperties = settings.properties.filter(p => p.name !== settings.selectionProperty);
|
||||
const hasEditableProperties = editableProperties.length > 0;
|
||||
|
|
@ -249,20 +257,8 @@ export class BulkEditModal extends Modal {
|
|||
updateToggleAriaChecked(toggle, value);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
const footer = new Setting(contentEl)
|
||||
.addButton(btn => {
|
||||
btn
|
||||
.setButtonText("Delete selected notes")
|
||||
.setWarning()
|
||||
.onClick(() => {
|
||||
void this.doDelete();
|
||||
});
|
||||
this.deleteBtn = btn.buttonEl;
|
||||
});
|
||||
if (hasEditableProperties) {
|
||||
footer.addButton(btn => {
|
||||
new Setting(contentEl).addButton(btn => {
|
||||
btn
|
||||
.setButtonText("Update properties")
|
||||
.setCta()
|
||||
|
|
|
|||
|
|
@ -43,6 +43,14 @@
|
|||
margin-left: var(--size-4-2);
|
||||
}
|
||||
|
||||
.bulk-properties-selection-row .setting-item-info {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.bulk-properties-delete-btn {
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.bulk-properties-value-container {
|
||||
padding-bottom: var(--size-4-3);
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue