Custom CSS

Theme tips

Disable indenting for top level folders

Thanks to @edwardhorsford here is a snippet if you do not want your top level folders to be indented.
See https://github.com/johansan/notebook-navigator/issues/557

/* Remove indentation from first level of folders */
.nn-navitem.nn-folder {
  padding-inline-start: calc(max(0, var(--level, 0) - 1) * var(--nn-setting-nav-indent)) !important;
}

/* Hide chevron on root folder only and prevent single clicks collapsing item*/
.nn-navitem.nn-folder[data-level="0"] .nn-navitem-chevron {
  opacity: 0 !important;
  pointer-events: none !important;
}

Configure background color separately for desktop and mobile

Thanks to @greetclammy you can use the following CSS snippet to configure background differently for desktop and mobile.
See https://github.com/johansan/notebook-navigator/issues/469

body {
  --nn-theme-list-bg: var(--background-secondary);
  --nn-theme-list-header-bg: var(--background-secondary);
}

body.is-mobile.theme-light {
  --nn-theme-mobile-nav-bg: var(--background-primary);
  --nn-theme-list-bg: var(--background-primary);
  --nn-theme-list-header-bg: var(--background-primary);
}

body.is-mobile.theme-dark {
  --nn-theme-mobile-nav-bg: var(--background-secondary);
  --nn-theme-list-bg: var(--background-secondary);
  --nn-theme-list-header-bg: var(--background-secondary);
}

Retroma theme

If you use the Obsidian Retroma theme you might want to use the following snippet to add padding to Notebook Navigator panes so the padding effect of the skin gets enough space:

.nn-split-container.nn-orientation-vertical .nn-list-pane {
  margin-top: 8px !important; 
}
.nn-navigation-pane .nn-pane-header,
.nn-list-pane .nn-pane-header {
  margin-bottom: 8px !important;
}

Thank you to @mattsigal for the CSS snippet. See more at https://github.com/johansan/notebook-navigator/issues/470