Horizontal line selection

[VanHate]

Description

This isn't really a bug, but it does ruin the user experience a bit.
I want to separate the labels from the note text with a horizontal line. When I do this and then open the note again, the line becomes selected and it looks ugly
And also, if I make a note template with labels and leave a horizontal line under them without text after the line, it disappears.

TriliumNext Version

0.91.6

What operating system are you using?

Windows

What is your setup?

Server access only

Operating System Version

Windows 10 22H2

Error logs

No response

[eliandoran]

I want to separate the labels from the note text with a horizontal line.

The best approach here is not to alter the content of the notes themselves. The reason is that you don't want this line to show up in exports, shared notes, etc.

The change needs to be done at UI level instead and Trilium allows it.

You can create a CSS code note with #appCss with the following content:

.promoted-attributes-container {
  border-bottom: 1px solid var(--main-border-color);
}

When I do this and then open the note again, the line becomes selected and it looks ugly

Since the horizontal line is an interactive block/element that you can move around, it needs to have a way to indicate it's selected.

And also, if I make a note template with labels and leave a horizontal line under them without text after the line, it disappears.

Indeed, apparently this is a feature. If the HTML contains no text (which a single <hr> counts as), then it is removed.

[VanHate]

Thank you! I think it's necessary to add to the docs that #appCss is applied globally to all notes (so #appCss=myStyle doesn't work for me if I want to apply the style to only certain templates). Therefore, in the CSS note itself, you need to specify:

.myStyle .promoted-attributes-container { 
   border-bottom: 1px solid var(--main-border-color);
}