it has the same drawbacks as the clutter-free mode : the markup will not be revealed on selection (because line selection doesn’t trigger the active line class).
the code below is set up for my theme ono-sendai, you will probably need to reposition elements to avoid overlapping & adjust font-size to your liking (it may be incompatible with themes that already target the same classes for other purposes, but I know it works on the base theme and a couple of others).
@_ph: is there a way to het the H1 etc in line vertically with the text of their header? I thought the offset was sepcific to my set-up, but I see it is there in your GIF too.
it might not be obvious from the GIF compression, but I’m using the option to show line numbers in the edit view, that’s why the [H1-H6] look offset vertically :
they fit in the empty spaces between line numbers to avoid any overlapping, but I get that it can be offputting if you don’t use line numbers…
Anyway, it’s an easy fix :
look inside the section that starts with /*-- display H1-h6 in gutter--*/
then tweak the values of top:XX px; and font-size: XXpx;, both values are linked, so if you increase the font-size, you’ll need to adjust the top: value accordingly.
There is probably a way to calculate the correct offset values automatically from the font-size but I’ll leave that to somebody else
Anyone know how to get the bullet point relationship lines if using spaces instead of tabs? My lines disappeared when I changed this setting and replaced all the “\t”
@obadiahcruz asked on the Discord about having file and folder icons appear next to titles in the file explorer depending on the type, and this is what I came up with:
I’ve been inserting emojis into the folder name itself, but I worry about it causing issues with compatibility by having special characters in the folder path.
Your method seems like a much safer approach, but it does add some complexity to merge it with each theme.
Would it be possible to assign each folder an emoji from the right-click menu?
Then the icons would be independent of the theme and not lost each time the theme is changed.
Enhancing the view of “folders” and “Table of Content”
/* outliner for the outline */
.outline-heading-children{
border-left: 1px solid rgba(118,158,165,0.2);
border-radius:0 0px 0px 0;
transition:all 0.5s ease-in-out;
}
.outline-heading-children:hover{
border-left-color:rgba(118,158,165,0.4);
}
/* outliner for the file and folders */
.nav-folder,.nav-file{
margin:0 !important;
border-left: 1px solid rgba(118,158,165,0.2);
}
This helps understanding the relationship between child and parents of the folders and contents. In the picture you will see faint lines are appearing in the folder and ouliner section.
I suppose there is no way to apply this in edit mode as well since there’s no information regarding the actual tags in the html representation. If I’m doing this right, these are the css-selectors for the tags in edit mode:
Well my obsidian is not updating to 0.8.15
Did you tried changing the color?
If that does not do the trick than may be they changed the class name.
I will update the code if my obsidian goes to the version 0.8.15
Sometimes if the line color is as same as the background color than it will not show up.
But don’t worry I will update this code if it does not work with my obsidian version.
Just waiting for my update .
.