Hi everyone,
How to change notebook color in userchrome.css?
thanks.
You mean the background color of the currently selected notebook, right?
I may be mistaken, but I couldn’t find a way to do this via CSS. It seems like it would be styling list-item-container, but the background color for that item is being applied via element styling vs a class.
Div of currently selected notebook
<div class="list-item-container" background-color: rgb(1, 63, 116);" draggable="true" folderid="x..." style="box-sizing: border-box; height: 25px; display: flex; align-items: stretch; >
Div of Non-selected notebook
<div class="list-item-container" background-color: rgba(200, 200, 200, 0);" draggable="true" folderid="y..." style="box-sizing: border-box; height: 25px; display: flex; align-items: stretch;>
Ideally the first element would have a class="selected" that was changing the background color, or even just there as a styling hook.
Curious if anyone else has found a work around.
Like this. color code notebook.
I’d be surprised if there was a way to do that in css since Joplin doesn’t support setting different colors for different notebooks. Usually to do something like that you would give each notebook a different class in html, then in css you would apply a different style to each class. But since Joplin styles them all the same I bet they all have the same class, so you can only change all of them in CSS. But I haven’t looked at source and I’m not the greatest at CSS so could be missing something!
1 Like
You can set the color for all notebooks, but not for individual ones.
There was a PR open to add an icon to a notebook, but we had to defer the merge. This PR could be used to also add individual coloring. But this is a long way to go, because we have to develop a dialog framework first. (The one we are using is rather limited.)
1 Like
Thank you 
Thank you 