I use “Strict line breaks” to maximise compatibility with other Markdown apps, but mostly just use the editor and it’s unclear whether I’ve actually added the two spaces required for the strict line break or not. So I had a brainwave and added a line break marker with CSS.
Additionally, I found I could target trailing spaces and tabs in the editor, so I added those, too:
You are one of the star experts here, and I use your Andy Mode almost religiously, adding it to any new theme I try, and having it as part of my standard default theme set-up.
Being an almost complete ignorant about CSS, but wanting to know if another one your brainwaves could be useful for me, could you explain in simple terms what this latest code snippet does, apart from compatibility with other markdown apps?
@Klaas I’ve updated the main post with a screenshot to make it clearer
Basically it replaces trailing spaces (spaces at the end of a line) with a · character, so you can actually see them (instead of them being invisible). Also, if the line ends with two or more spaces - what counts as a line break in markdown - the line will also end with a ↵ character to indicate a new line.
I also replace tabs with a ⟶ character, so you can see them as well.
All of these only apply to the editor, and in preview mode the characters will not appear
How does this compare with Show whitespace plugin ?
(Which solution to choose for good compatibility with themes, plugins, fonts, monospaced fonts, bold text, …)
I was reading this post about CSS themes and the changes from CM5 to CM6.
I am trying to get the CSS listed at the start of this thread to work with with new live-preview / source-mode editor, but just can’t work out how to modify the old CSS to make it work.
Does your post on the CodeMirror website mean that it will be impossible to tweak our old CSS themes to work ‘fully’ with the new editor, although some elements will work okay?
I understand almost nothing when it comes to CSS, but I have cobbled together a theme that I like. The only things I can’t get working are the CSS snippets that enable invisibles (spaces, line breaks, tabs, etc) to be viewed when writing. I don’t know if it is impossible to get the CSS to work as I need it to, or if I am just too dim to get the syntax right.
I think there is a plugin that did this for cm5, but it hasn’t yet been updated to cm6 - but some people are working to get it upgraded behind the scenes and it may be available soon in the plugin store.
Can anyone tell me if this works in the final state of the program in any way? Can anyone give me instructions on how to enable this? I’ve tried some ways, but they all don’t work.
It hasn’t been updated to work with the new editor, so it will only work with old versions of Obsidian.
Think the community-plugins directory needs to be moderated so that out-of-date plugins are removed or clear information is given stating which version of Obsidian each plugin is compatible with.
Wow, thank you. I’ve been missing this functionality since Show Whitespace stopped working. I know it is probably a bit of a niche requirement, bit of a love/hate thing.
In case it’s useful to anyone, I copied most of the original post and just added .markdown-source-view at the start. This now works in my current version of Obsidian:
/* Symbols at line breaks */
.markdown-source-view .cm-line::after {
content:'↵';
color: var(--text-faint);
}
/* Symbols at trailing spaces */
.markdown-source-view .cm-trailing-space-a::before, .cm-trailing-space-b::before, .cm-trailing-space-new-line::before, .cm-tab::before {
content: '·';
color: var(--text-faint);
}
/* Symbols at indents - for some reason needs more specifics*/
.markdown-source-view.mod-cm6 .cm-indent::before {
content: '🠂';
color: var(--text-faint);
}
.
The issue is me.