This is some simple CSS (just one rule) to achieve middle ground between the default outliner mode and the document mode.
It hides the bullet points completely for first level blocks that have no children. The moment you indent a block under another one, they both get the bullet points back.
This is set to work on desktop but not on mobile (where I need bullet points to access the block menu). You can also show again the bullet point by tagging the block with a tag that contains a @ like #@ (I use this in combination with Custom icons as bullet points)
Some prefer to show bullet point on hover, I prefer this way. I have used it for a while and I’m happy with this simple solution.
Here there is the code:
:root:not(.is-native-android) .ls-block[haschild="false"][level="1"]:not([data-refs-self*="@"]) > div > div > a > .bullet-container {
display: none !important;
}
Thankyou @alex0 this is exactly what I had been looking for long time.
This is very intuitive to have a page start as a blank one which is perfect for long firm writing as well. And when needed, bullets are invoked with simple indenting under the necessary heading/ context.
And all the block structure remains intact which is not the case with using t d
Showing the bullet on Hover would be helpful when you want to open the bullet in the right idebar or access the right-click menu.
Do you have the variant when the bullet shows at hover?
Another thing about the plug-in is that it adds tags like #.ul and others for lists and indentation. I personally would not want all those extra tags, even though all of Sethyan’s plug-ins are fabulous.
Thanks a lot! I really needed something like this. I wanted to ask you if there is a way to create the bullet just on the line I press tab.
I’m seeing that it creates the bullet just a line before the one I push tab.
Any idea how to make it?
Thanks!
This should already be the case, isn’t it for you?
You can mark a block with #@ tag to make it a bullet point. Or you can leave a block empty and indent all the blocks that you want as bullet points.
This is meant to be a simple visual hack that doesn’t change how Logseq works, so it is very safe to adopt. For more complex needs check the Long Form plugin in the Marketplace.
I have created that block with the #@ but it looks very weird for me. I attach the picture so you can see what I meant with creating the bullet for the line before. Ain’t there a way to css hack that?
Also, why Logseq doesn’t recognise traditional Markdown? I thought just writing a - or 1. would recognise the bullets and numbers.
You can use this CSS to hide tags that contain a @:
a.tag[data-ref*="@"] {display: none;}
Open Markdown files created by Logseq, all blocks are bullet points. The CSS I shared only hides the bullet point in Logseq’s UI but it is still there.
In general you can turn some blocks into a numbered list using /Numbered list command or something like that.
Thanks a lot!
I still don’t get why Logseq doesn’t allow to choose if you want to see the bullet point or not.
It’s something disturbing for me visually for example.
Anyway, I’ll continue my research! Thanks again
Are you looking for something like this? When drilled down, the parent bullet has its bullet hidden, font size incerased, guideline removed, and various alignment tweaks to get it inline with the breadcrumb + child blocks.
Hi, i really love your code. It makes it so much better for me. But can you help me to use this style in Whiteboards? unfortunately i have no css skills and want that the first bulletpoint in a block on a whiteboard is not shown.
