nubs
September 22, 2023, 8:30am
1
wasn’t sure if this is considered a feature request or plugin request. ¯\_(ツ)_/¯
Use case or problem
I’d like to more easily be able to differentiate between separate lines while editing notes.
Proposed solution
The option to add alternating-colored rows to the note view in edit mode, similar to Excel.
Current workaround (optional)
N/A. Unable to find any community plugins or themes to implement color banding.
Related feature requests (optional)
N/A.
kepano/obsidian-minimal: A distraction-free and highly customizable theme for Obsidian
row-alt
Add striped background to alternating table rows
I think your best bet will be to write a CSS snippet.
That link to Minimal is referring to tables. This link talks about paragraph text. You’ll need to change this into Obsidian syntax, to target the right elements.
css
2 Likes
nubs
September 25, 2023, 10:43am
5
was afraid of this cause the most “coding” I know was learning markup just now on obsidian. I’m always down for a challenge though. thanks for the tip!
You marked it as solution, which makes it auto-close.
Instead, I removed the auto-close, moved it to help and tagged it css. You can ask for help and someone might suggest a snippet. No need to write it all by yourself.
ush
September 26, 2023, 2:09pm
7
Here’s an awful-looking minimal working example
.cm-line:nth-child(odd) {
background-color: red;
}
.cm-line:nth-child(even) {
background-color: blue;
}
About :nth-child
:
You can find variable names of “proper” colors in:
Replace red
or blue
with var(--variable-name-that-you-want-to-use)
1 Like
Good start!
For nicer colors, you could use RGBA, and add a very transparent Alpha in the 4th value.
.cm-line:nth-child(odd) {
background-color: rgba(255, 0, 0, 0.1);
}
.cm-line:nth-child(even) {
background-color: rgba(0, 0, 255, 0.1);
}
The problem with nth-child is that it is based on full lines, not on wrapped lines. Depending on what you are looking for.
2 Likes
ush
September 26, 2023, 2:19pm
9
Right, but I’m not sure how I can get that fine-grained control with CSS snippets…
ush
September 26, 2023, 2:28pm
10
By the way, you can highlight the currently active line using
.cm-line.cm-active {
background-color: <COLOR YOU LIKE>;
}
(though this might not be exactly what you want.)
Also, some themes have this feature out of the box:
Obsidian Nord
Minimal (needs to be configured with Style Settings)
1 Like
nubs
September 26, 2023, 9:25pm
11
This is good stuff, I’ll have to check this out after work.
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.