diff --git a/src/public/app/services/branches.js b/src/public/app/services/branches.js index 8f739dffc..51abc605d 100644 --- a/src/public/app/services/branches.js +++ b/src/public/app/services/branches.js @@ -120,7 +120,7 @@ async function moveNodeUpInHierarchy(node) { if (!hoistedNoteService.isTopLevelNode(node) && node.getParent().getChildren().length <= 1) { node.getParent().folder = false; - node.getParent().renderTitle(); + node.getParent().getTitle(); } } diff --git a/src/public/app/widgets/containers/collapsible_section_container.js b/src/public/app/widgets/containers/collapsible_section_container.js index 0a1de28b4..534ab23ae 100644 --- a/src/public/app/widgets/containers/collapsible_section_container.js +++ b/src/public/app/widgets/containers/collapsible_section_container.js @@ -22,6 +22,12 @@ const TPL = ` color: var(--muted-text-color); border-bottom: 1px solid var(--main-border-color); } + + .section-title .bx { + font-size: 170%; + position: relative; + top: 6px; + } .section-title.active { color: var(--main-text-color); @@ -37,6 +43,10 @@ const TPL = ` } .section-title-empty { + flex-basis: 20px; + } + + .section-title-empty:last-of-type { flex-shrink: 1; flex-grow: 1; } @@ -51,6 +61,14 @@ const TPL = ` .section-body.active { display: block; } + + .section-title-label { + display: none; + } + + .section-title.active .section-title-label { + display: inline; + }
@@ -128,7 +146,7 @@ export default class CollapsibleSectionContainer extends NoteContextAwareWidget this.$titleContainer.empty().append('
'); for (const widget of this.children) { - const ret = widget.renderTitle(note); + const ret = widget.getTitle(note); if (!ret.show) { continue; @@ -136,7 +154,11 @@ export default class CollapsibleSectionContainer extends NoteContextAwareWidget const $sectionTitle = $('
') .attr('data-section-component-id', widget.componentId) - .append(ret.$title); + .append($('') + .addClass(ret.icon) + .attr("title", ret.title)) + .append(" ") + .append($('').text(ret.title)); this.$titleContainer.append($sectionTitle); this.$titleContainer.append('
'); @@ -150,6 +172,8 @@ export default class CollapsibleSectionContainer extends NoteContextAwareWidget } } + this.$titleContainer.find('.section-title-icon').tooltip(); + if (!$sectionToActivate) { $sectionToActivate = $lastActiveSection; } diff --git a/src/public/app/widgets/note_tree.js b/src/public/app/widgets/note_tree.js index 96760e7ef..ad16926e2 100644 --- a/src/public/app/widgets/note_tree.js +++ b/src/public/app/widgets/note_tree.js @@ -580,7 +580,7 @@ export default class NoteTreeWidget extends NoteContextAwareWidget { node.setExpanded(branch.isExpanded, {noEvents: true, noAnimation: true}); } - node.renderTitle(); + node.getTitle(); } /** diff --git a/src/public/app/widgets/type_property_widgets/file_properties.js b/src/public/app/widgets/type_property_widgets/file_properties.js index 517eabbf1..5dd6f69ba 100644 --- a/src/public/app/widgets/type_property_widgets/file_properties.js +++ b/src/public/app/widgets/type_property_widgets/file_properties.js @@ -61,11 +61,12 @@ export default class FilePropertiesWidget extends NoteContextAwareWidget { return this.note && this.note.type === 'file'; } - renderTitle(note) { + getTitle() { return { show: this.isEnabled(), activate: true, - $title: 'File' + title: 'File', + icon: 'bx bx-file' }; } diff --git a/src/public/app/widgets/type_property_widgets/image_properties.js b/src/public/app/widgets/type_property_widgets/image_properties.js index b72b0e126..9bb34eb9f 100644 --- a/src/public/app/widgets/type_property_widgets/image_properties.js +++ b/src/public/app/widgets/type_property_widgets/image_properties.js @@ -43,11 +43,12 @@ export default class ImagePropertiesWidget extends NoteContextAwareWidget { return this.note && this.note.type === 'image'; } - renderTitle(note) { + getTitle(note) { return { show: this.isEnabled(), activate: true, - $title: 'Image' + title: 'Image', + icon: 'bx bx-image' }; } diff --git a/src/public/app/widgets/type_property_widgets/inherited_attribute_list.js b/src/public/app/widgets/type_property_widgets/inherited_attribute_list.js index 96f15f0c5..44e14ae87 100644 --- a/src/public/app/widgets/type_property_widgets/inherited_attribute_list.js +++ b/src/public/app/widgets/type_property_widgets/inherited_attribute_list.js @@ -28,14 +28,11 @@ export default class InheritedAttributesWidget extends NoteContextAwareWidget { this.child(this.attributeDetailWidget); } - renderTitle(note) { - const inheritedAttributes = this.getInheritedAttributes(note); - - this.$title.text(`Inherited attrs (${inheritedAttributes.length})`); - + getTitle() { return { show: true, - $title: this.$title + title: "Inherited attributes", + icon: "bx bx-list-plus" }; } @@ -45,8 +42,6 @@ export default class InheritedAttributesWidget extends NoteContextAwareWidget { this.$container = this.$widget.find('.inherited-attributes-container'); this.$widget.append(this.attributeDetailWidget.render()); - - this.$title = $('
'); } async refreshWithNote(note) { diff --git a/src/public/app/widgets/type_property_widgets/note_properties.js b/src/public/app/widgets/type_property_widgets/note_properties.js index 6870f0dbc..f439341dd 100644 --- a/src/public/app/widgets/type_property_widgets/note_properties.js +++ b/src/public/app/widgets/type_property_widgets/note_properties.js @@ -21,11 +21,12 @@ export default class NotePropertiesWidget extends NoteContextAwareWidget { return this.note && !!this.note.getLabelValue('pageUrl'); } - renderTitle(note) { + getTitle() { return { show: this.isEnabled(), activate: true, - $title: 'Info' + title: 'Info', + icon: 'bx bx-info-square' }; } diff --git a/src/public/app/widgets/type_property_widgets/owned_attribute_list.js b/src/public/app/widgets/type_property_widgets/owned_attribute_list.js index 41ceff51e..ddb6563ef 100644 --- a/src/public/app/widgets/type_property_widgets/owned_attribute_list.js +++ b/src/public/app/widgets/type_property_widgets/owned_attribute_list.js @@ -31,14 +31,11 @@ export default class OwnedAttributeListWidget extends NoteContextAwareWidget { this.child(this.attributeEditorWidget, this.attributeDetailWidget); } - renderTitle(note) { - const ownedAttrs = note.getAttributes().filter(attr => attr.noteId === this.noteId && !attr.isAutoLink) - - this.$title.text(`Owned attrs (${ownedAttrs.length})`); - + getTitle() { return { show: true, - $title: this.$title + title: "Owned attributes", + icon: "bx bx-list-check" }; } @@ -68,7 +65,7 @@ export default class OwnedAttributeListWidget extends NoteContextAwareWidget { if (loadResults.getAttributes(this.componentId).find(attr => attr.isAffecting(this.note))) { this.refreshWithNote(this.note, true); - this.renderTitle(this.note); + this.getTitle(this.note); } } } diff --git a/src/public/app/widgets/type_property_widgets/promoted_attributes.js b/src/public/app/widgets/type_property_widgets/promoted_attributes.js index 27d13d286..c8ee17e78 100644 --- a/src/public/app/widgets/type_property_widgets/promoted_attributes.js +++ b/src/public/app/widgets/type_property_widgets/promoted_attributes.js @@ -39,23 +39,20 @@ export default class PromotedAttributesWidget extends NoteContextAwareWidget { this.$widget = $(TPL); this.overflowing(); this.$container = this.$widget.find(".promoted-attributes-container"); - - this.$title = $('
'); } - renderTitle(note) { + getTitle(note) { const promotedDefAttrs = note.getPromotedDefinitionAttributes(); if (promotedDefAttrs.length === 0) { return { show: false }; } - this.$title.text(`Promoted attrs (${promotedDefAttrs.length})`); - return { show: true, activate: true, - $title: this.$title + title: "Promoted attributes", + icon: "bx bx-table" }; } @@ -292,7 +289,7 @@ export default class PromotedAttributesWidget extends NoteContextAwareWidget { if (loadResults.getAttributes(this.componentId).find(attr => attr.isAffecting(this.note))) { this.refresh(); - this.renderTitle(this.note); + this.getTitle(this.note); this.triggerCommand('refreshSectionContainer'); } } diff --git a/src/public/app/widgets/type_property_widgets/search_definition.js b/src/public/app/widgets/type_property_widgets/search_definition.js index 41b983aa2..aa483b9a4 100644 --- a/src/public/app/widgets/type_property_widgets/search_definition.js +++ b/src/public/app/widgets/type_property_widgets/search_definition.js @@ -206,11 +206,12 @@ export default class SearchDefinitionWidget extends NoteContextAwareWidget { return this.note && this.note.type === 'search'; } - renderTitle(note) { + getTitle() { return { show: this.isEnabled(), activate: true, - $title: 'Search' + title: 'Search', + icon: 'bx bx-search' }; }