diff --git a/packages/docs/docusaurus.config.js b/packages/docs/docusaurus.config.js
index 6e938cd57..9b1cc4667 100755
--- a/packages/docs/docusaurus.config.js
+++ b/packages/docs/docusaurus.config.js
@@ -23,9 +23,15 @@ module.exports = {
       theme: require("prism-react-renderer/themes/shadesOfPurple"),
     },
     navbar: {
+      hideOnScroll: false,
       title: "craft.js",
       links: [
-        { to: "docs/overview", label: "Documentation", position: "left" },
+        {
+          to: "docs/overview",
+          label: "Documentation",
+          position: "left",
+          activeBasePath: `docs`,
+        },
         { to: "docs/support", label: "Support Craft.js", position: "right" },
         {
           href: "https://github.com/prevwong/craft.js",
diff --git a/packages/docs/src/css/custom.css b/packages/docs/src/css/custom.css
index dbd702152..7da37c012 100755
--- a/packages/docs/src/css/custom.css
+++ b/packages/docs/src/css/custom.css
@@ -177,12 +177,6 @@ header + .markdown > .badge-wrapper:first-child {
   margin-top: -10px !important;
 }
 
-@media only screen and (max-width: 996px) {
-  header + .markdown > .badge-wrapper:first-child {
-    margin-top: -20px !important;
-  }
-}
-
 .badge {
   display: inline-block;
   color: #fff;
@@ -376,6 +370,10 @@ html[data-theme="dark"] .api-description {
   color: var(--ifm-sidebar-color);
 }
 
-.docMainContainer_node_modules-\@docusaurus-theme-classic-src-theme-DocPage- {
-  overflow: hidden;
+.navbar .navbar-sidebar a.navbar__brand .navbar__title {
+  color: var(--ifm-sidebar-color);
+}
+
+.navbar .navbar-sidebar .navbar-sidebar__items .navbar__link--active {
+  color: var(--ifm-color-primary);
 }