Label in sidebar | Voters

Label in sidebar

complete

Adam Stevens

I would like to add some content (specifically I will put the Latest API version) at the bottom of a sidebar.

The idea would be to have a new sidebar type that doesn't link to anything, and I can control the color/style of.

March 9, 2020

Joshua Chen

marked this post as

complete

https://github.com/facebook/docusaurus/pull/6519

Joshua Chen

I've merged in "sidebar divider". If we are to implement either of them, we'll probably give a generic API that allows you to directly pass static HTML as a sidebar item, as we do for the footer.

Joshua Chen

Merged in a post:

Sidebar divider item type

FreeAtLastTechnology

A simple horizontal break that you'll find in many other documentation solutions. While Docusaurus is fairly clean at the moment, indentation does not make up for all sidebar items being equidistant vertically. Having a new sidebar item type like "break" with a horizontal line and padding will allow much greater control over the visual flow of the material. This should be combined with the other suggestions regarding a non-linked label / title so that the docs can be sufficiently split into sections.

Example attached.

January 14, 2022

Sébastien Lorber

marked this post as

under review

Sébastien Lorber

Wouldn't this solve your need?

https://github.com/facebook/docusaurus/issues/5706

FreeAtLastTechnology

Quick update: I did this one my own leveraging empty links and some css:
``` // sidebars.js   
{
type: 'link',
label: '',
href: '',
}
```
.menu > .menu__list > .menu__list-item > :empty {
  pointer-events: none;
  border-bottom: var(--hr-border, 0);
  border-bottom-color: rgb(56, 61, 63);
  border-style: inset;
  border-width: 1px;
  margin: 1.5em 1em;
  padding: 0;
}
I'm not good at web dev so I'm sure there's some bad in this. I just copied the css from the reference in the picture I provided and made some tweaks.