I'll update this list when other elements come to mind. This post is a wiki, so anyone can add something to it.
Background color, text color, link color
(Could probably share the same class as E2EE banner)
You can currently select between external and internal links, but there is no way to select and separate Joplin notes from internal files such as a
- a class for single tags
- single tag class (there is the
.tag-listclass, but to select a single tag in CSS
.tag-list spanhas to be used, as of right now)
The containing div has no attributes other than
style, I was trying to align it to right side but was unable to get any style to apply using CSS attribute selectors. Not 100% sure having a class would fix this but would at least make it clear that it can't be done without so much trial and error.
<input ...>element and the link within this div also lack a class.
These are the only objects inside
<div class="header" ...>without a class.
Background for the tag list bar appears to be controlled by the class
.tag-list. However for the tags themselves the containing <span> has no attributes other than style.
Adding a selected class to the list-item-container will work for both notebooks and notes.
(it is possible to target this with
#react-root div div div:last-child div input but that is pretty finicky!)
Like title it can be selected with
#react-root > div > div > div:nth-child(8) > div:nth-child(1) > span, not a good long-term solution though.
These elements should have a class name as well:
New Todo button
New Note button
- Dropdown calendar (as you can see, if the whole app is styled in dark mode, the calendar background stays white and the text is only slightly visible)
- modal backdrop and dialog itself