diff --git a/website/src/components/sidebar.js b/website/src/components/sidebar.js
index 541cc1260..27c71e70f 100644
--- a/website/src/components/sidebar.js
+++ b/website/src/components/sidebar.js
@@ -7,6 +7,18 @@ import Link from './link'
import Dropdown from './dropdown'
import classes from '../styles/sidebar.module.sass'
+function getActiveHeading(items, slug) {
+ if (/^\/?universe/.test(slug)) return 'Universe'
+ for (let section of items) {
+ for (let { isActive, url } of section.items) {
+ if (isActive || slug === url) {
+ return section.label
+ }
+ }
+ }
+ return 'Documentation'
+}
+
const DropdownNavigation = ({ items, defaultValue }) => {
return (
@@ -28,6 +40,7 @@ const Sidebar = ({ items, pageMenu, slug }) => {
const [initialized, setInitialized] = useState(false)
const [activeSection, setActiveSection] = useState(null)
const activeRef = useRef()
+ const activeHeading = getActiveHeading(items, slug)
useEffect(() => {
const handleInView = ({ detail }) => setActiveSection(detail)
@@ -45,10 +58,13 @@ const Sidebar = ({ items, pageMenu, slug }) => {
return (
- - {section.label}
+ - {section.label}
{section.items.map(({ text, url, onClick, menu, isActive }, j) => {
const currentMenu = menu || pageMenu || []
const active = isActive || slug === url
diff --git a/website/src/styles/sidebar.module.sass b/website/src/styles/sidebar.module.sass
index 3163ee5f0..c26da5074 100644
--- a/website/src/styles/sidebar.module.sass
+++ b/website/src/styles/sidebar.module.sass
@@ -45,6 +45,9 @@ $crumb-bar: 2px
&:hover
color: var(--color-dark)
+.active-heading
+ display: none
+
.crumbs
display: block
padding-top: 1rem