How can you indend the left navigation?

[Andre601]

Currently using navigation.tabs and navigation.sections but I don't like how the entries are listed and would like to alter it slightly.

My goal is to make them indent a bit (padding-left: 0.5rem), so that the actual parts are more separated from the section titles.
Unfortunately can I not just alter md-nav__link or even md-nav > md-nav__link because the ToC also utilizes those.

Would I need to use theme extension to change this?

[squidfunk]

This should achieve what you're asking for:

.md-nav__item--section > .md-nav > .md-nav__list {
  margin-left: 0.5rem;
}

[Andre601]

This does the trick. Thank you!

[MaximilianKohler]

Not sure if I should make a new discussion. I've seen a few related ones. I'm trying to add one additional indentation level for one page.

I have:

nav:
  - Home: index.md
  - General:
    - • FAQ: faq.md
    - • Intro: intro.md

I want to create:

nav:
  - Home: index.md
  - General:
    - • FAQ: faq.md
      - • Eg: eg.md
    - • Intro: intro.md

But it causes an error.

I tried:

nav:
  - Home: index.md
  - General:
    - • FAQ: faq.md
    -   • Eg: eg.md
    - • Intro: intro.md

And it doesn't register the additional spaces.

I tried copying from https://www.editpad.org/tool/invisible-character, and it doesn't register it. If I use   then it gives an error.

Originally, I didn't have the page in the left nav at all, but that means there's no ToC when you visit the page on a phone. I want a ToC for the page.

EDIT: Ah. In Windows Character Map, in the lower 1/3rd there are some spaces you can copy. I used "En Quad" or "Em Quad" and it works.

nav:
  - Home: index.md
  - General:
    - • FAQ: faq.md
    -  • Eg: eg.md
    - • Intro: intro.md