fix: Extract page toc from markdown

frappe/public/scss/markdown.scss

@@ -122,3 +122,41 @@ main:not(.my-5) .from-markdown {
 		margin-top: 5rem;
 	}
 }
+
+.page-toc {
+	font-size: $font-size-sm;
+
+	h5 {
+		font-size: $font-size-sm;
+		margin-bottom: 0.5rem;
+		color: $gray-500;
+	}
+
+	> div {
+		padding-top: 2rem;
+		position: sticky;
+		top: 0;
+	}
+
+	ul {
+		padding-left: 0;
+		list-style-type: none;
+	}
+
+	li > ul {
+		padding-left: 0.5rem;
+	}
+
+	a {
+		display: block;
+		padding: 0.25rem 0;
+
+		color: $gray-600;
+		text-decoration: none;
+		font-weight: 500;
+
+		&:hover {
+			color: $gray-700;
+		}
+	}
+}

frappe/utils/data.py

@@ -1129,6 +1129,7 @@ def md_to_html(markdown_text):
 		'fenced-code-blocks': None,
 		'tables': None,
 		'header-ids': None,
+		'toc': None,
 		'highlightjs-lang': None,
 		'html-classes': {
 			'table': 'table table-bordered',

frappe/website/router.py

@@ -271,6 +271,9 @@ def setup_source(page_info):
 		if page_info.template.endswith('.md'):
 			source = frappe.utils.md_to_html(source)
 
+			if page_info.page_toc:
+				page_info.page_toc_html = source.toc_html
+
 			if not page_info.show_sidebar:
 				source = '<div class="from-markdown">' + source + '</div>'