Fix view for Table of Contents on smaller screens

For backstage.io/docs and backstage.io/blog pages, we have a sidebar with Table of Contents. On smaller screens, this sidebar becomes a nav bar on top with a toggle hamburger button. However, we also have a nav bar on the website. This nav bar hinders the view of the TOC bar.

This commit fixes the view for Table of Contents on Blog and Docs page on smaller screens.

microsite/static/css/custom.css

@@ -203,6 +203,54 @@ td {
   border-radius: 0.25rem;
 }
 
+/*
+ * Fix for viewing Table of Contents bar on documentation
+ * and blog pages on smaller screens.
+ */
+@media only screen and (max-width: 1023px) {
+  /* Nav bar hides the docs toc bar */
+  .docMainWrapper {
+    margin-top: 4rem;
+  }
+
+  /* Toc bar does not have to be fixed */
+  .docsNavContainer {
+    position: unset;
+    width: 95vw;
+    z-index: 100;
+    margin-left: -2vw;
+  }
+
+  /* Toc bar does not have to be fixed when slider is active */
+  .docsSliderActive .toc .navBreadcrumb,
+  .tocActive .navBreadcrumb {
+    position: unset;
+  }
+
+  /* Fix unexpected width increase when toc is toggled */
+  .docsSliderActive .toc .navBreadcrumb,
+  .tocActive .navBreadcrumb {
+    width: inherit;
+  }
+
+  /* This pseudo-element stops toc toggle button to be clicked */
+  header.postHeader::before {
+    height: 2em !important;
+    margin-top: -2em !important;
+  }
+
+  /* This pseudo-element stops toc toggle button to be clicked */
+  #__docusaurus.postHeaderTitle::before {
+    height: 1em;
+    margin-top: -1em;
+  }
+
+  /* Useless button causing trouble */
+  .tocToggler {
+    display: none;
+  }
+}
+
 /* content */
 .postContainer blockquote {
   color: $textColor;
@@ -288,17 +336,17 @@ code {
   background: linear-gradient(70.44deg, #121212 75%, #5d817b 100%);
 }
 .bg-teal-top-right {
-  background: 
+  background:
   /* linear-gradient(
       178.64deg,
       rgba(255, 255, 255, 0) 57.61%,
       rgba(255, 255, 255, 0.17) 127.71%
-    ), */ 
+    ), */
     /* linear-gradient(
       144.35deg,
       rgba(98, 197, 179, 0) 56.68%,
       rgba(98, 197, 179, 0.59) 109.25%
-    ), */ 
+    ), */
     /* linear-gradient(
       192.29deg,
       rgba(155, 240, 225, 0) 54.17%,