Numbering your outline

Custom CSS & Theme Design
1

Add numbering to your Outline (Table of Contents) in the sidebar for better readability

Css

.workspace-leaf-content[data-type="outline"] {
  counter-reset: item;
}

.workspace-leaf-content[data-type="outline"] .tree-item {
  counter-increment: item;
}

.workspace-leaf-content[data-type="outline"] .tree-item-children {
  counter-reset: item;
}

.workspace-leaf-content[data-type="outline"] .tree-item-inner::before {
  content: counters(item, ".") ". " !important;
  color: var(--text-muted);     /* custom color. i like red */
  font-weight: 500;           
  margin-right: 4px;            /* spacing with text */
}

Result

image
image115×433 6.14 KB

Old topic

I see some similar topic but it really outdate and can not use in current version. So that I create new topic. Thanks.

1 Like