client: Move ribbon at the bottom

This commit is contained in:
Elian Doran 2024-10-20 00:56:05 +03:00
parent fcebb43410
commit ac61d0f3ea
No known key found for this signature in database
2 changed files with 30 additions and 30 deletions

View File

@ -122,28 +122,6 @@ export default class DesktopLayout {
.id('center-pane')
.child(new SplitNoteContainer(() =>
new NoteWrapperWidget()
.child(
new RibbonContainer()
// the order of the widgets matter. Some of these want to "activate" themselves
// when visible. When this happens to multiple of them, the first one "wins".
// promoted attributes should always win.
.ribbon(new ScriptExecutorWidget())
.ribbon(new SearchDefinitionWidget())
.ribbon(new EditedNotesWidget())
.ribbon(new BookPropertiesWidget())
.ribbon(new NotePropertiesWidget())
.ribbon(new FilePropertiesWidget())
.ribbon(new ImagePropertiesWidget())
.ribbon(new BasicPropertiesWidget())
.ribbon(new OwnedAttributeListWidget())
.ribbon(new InheritedAttributesWidget())
.ribbon(new NotePathsWidget())
.ribbon(new NoteMapRibbonWidget())
.ribbon(new SimilarNotesWidget())
.ribbon(new NoteInfoWidget())
.button(new RevisionsButton())
.button(new NoteActionsWidget())
)
.child(new SharedInfoWidget())
.child(new WatchedFileUpdateStatusWidget())
.child(new FloatingButtons()
@ -188,6 +166,28 @@ export default class DesktopLayout {
...this.customWidgets.get('node-detail-pane'), // typo, let's keep it for a while as BC
...this.customWidgets.get('note-detail-pane')
)
.child(
new RibbonContainer()
// the order of the widgets matter. Some of these want to "activate" themselves
// when visible. When this happens to multiple of them, the first one "wins".
// promoted attributes should always win.
.ribbon(new ScriptExecutorWidget())
.ribbon(new SearchDefinitionWidget())
.ribbon(new EditedNotesWidget())
.ribbon(new BookPropertiesWidget())
.ribbon(new NotePropertiesWidget())
.ribbon(new FilePropertiesWidget())
.ribbon(new ImagePropertiesWidget())
.ribbon(new BasicPropertiesWidget())
.ribbon(new OwnedAttributeListWidget())
.ribbon(new InheritedAttributesWidget())
.ribbon(new NotePathsWidget())
.ribbon(new NoteMapRibbonWidget())
.ribbon(new SimilarNotesWidget())
.ribbon(new NoteInfoWidget())
.button(new RevisionsButton())
.button(new NoteActionsWidget())
)
)
)
.child(...this.customWidgets.get('center-pane'))

View File

@ -6,7 +6,7 @@ const TPL = `
<div class="ribbon-container">
<style>
.ribbon-container {
margin-bottom: 5px;
margin-top: 5px;
}
.ribbon-top-row {
@ -24,7 +24,7 @@ const TPL = `
.ribbon-tab-title {
color: var(--muted-text-color);
border-bottom: 1px solid var(--main-border-color);
border-top: 1px solid var(--main-border-color);
min-width: 24px;
flex-basis: 24px;
max-width: max-content;
@ -39,7 +39,7 @@ const TPL = `
.ribbon-tab-title.active {
color: var(--main-text-color);
border-bottom: 3px solid var(--main-text-color);
border-top: 3px solid var(--main-text-color);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
@ -62,7 +62,7 @@ const TPL = `
min-width: 0;
max-width: 35px;
flex-grow: 1;
border-bottom: 1px solid var(--main-border-color);
border-top: 1px solid var(--main-border-color);
}
.ribbon-tab-spacer:last-of-type {
@ -74,7 +74,7 @@ const TPL = `
.ribbon-button-container {
display: flex;
border-bottom: 1px solid var(--main-border-color);
border-top: 1px solid var(--main-border-color);
margin-right: 5px;
}
@ -86,9 +86,9 @@ const TPL = `
.ribbon-body {
display: none;
border-bottom: 1px solid var(--main-border-color);
border-top: 1px solid var(--main-border-color);
margin-left: 10px;
margin-right: 5px; /* needs to have this value so that the bottom border is the same width as the top one */
margin-right: 5px; /* needs to have this value so that the top border is the same width as the top one */
}
.ribbon-body.active {