Will be adding Selectors to this Post
Structure of Selectors
- Workspace
- Left Ribbon
- Right Ribbon
- Left Sidebar
- File Explorer
- Search
- Star Notes
- Notes Panes
- Main Content
- Title Bar
- Preview Mode
- Editor Mode
- Right Sidebar
- Collapse / Open Icon
- Tags Pane
- Back-links Pane
- Notes Pane
Understanding HTML Attributes
As Silver stated, workspace-leaf-content have a
data-type
(e.g. “markdown”) and they also have adata-mode="preview"
when in preview mode (doesn’t look like there’s a data-mode for editor, not sure if intentional) within the main container, there is div with class.workspace
which contains the ribbons (.workspace-ribbon.side-dock-ribbon.mod-left
and.workspace-ribbon.side-dock-ribbon.mod-right
), the sidebars (.workspace-split.mod-left-split
and.workspace-split.mod-right-split
) and the main “root” workspace (.workspace-split.mod-root
). So, if you’re looking to target a note in a sidebar specifically, you’d probably be looking for something like.mod-left-split .worspace-leaf-content[data-type="markdown"]