Home / GitHub Page

List of CSS elements which should have a class

I’ll update this list when other elements come to mind. This post is a wiki, so anyone can add something to it.

Preferences -> Encryption -> E2EE text


Background color, text color, link color

Banner

Banner
(Could probably share the same class as E2EE banner)

Search Bar

search-box

  • 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.
  • Both the <input ...> element and the link within this div also lack a class.
  • These are the only objects inside <div class="header" ...> without a class.

Local search

image

Tag List Tags

tags
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.

Selected and Deselected Notebooks

(currently overriding list-item-container will cause you not to be able to see the selected notebook)
Notebooks

Selected and Deselected Notes

Note List
(currently the list-item class is on a sub element, which causes issues styling todo’s, it is also reused between notebooks and notes which is not ideal)
list-item-example-issue

Note Title

Note title
(it is possible to target this with #react-root div div div:last-child div input but that is pretty finicky!)

Last Edit Timestamp

last-edit
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.

Next element here

1 Like