Hide table of content in blog posts for narrow screens

Author: Sylvain Corlay

src/css/custom.css

@@ -715,3 +715,17 @@ html:not([data-navbar-home-top]) .navbar__link:hover {
     padding-right: var(--ifm-spacing-lg);
   }
 }
+
+/* Hide table of contents on narrow screens for blog posts */
+@media (max-width: 996px) {
+  /* Hide the TOC column */
+  .mdxPageWrapper_j9I6 .col.col--2 {
+    display: none;
+  }
+
+  /* Expand main content to full width */
+  .mdxPageWrapper_j9I6 .col.col--8 {
+    flex: 0 0 100%;
+    max-width: 100%;
+  }
+}