feat: add styles to hide empty aside and expand article for better layout on medium screens (#659)

assets/css/_core/_media.scss

@@ -40,6 +40,21 @@
   }
 }
 
+@media only screen and (max-width: 1200px) and (min-width: 961px) {
+  .wrapper main {
+    // Hide empty aside and expand article when only one aside is empty
+    aside:first-child:empty:has(~ aside:not(:empty)),
+    aside:first-child:not(:empty) ~ aside#toc-auto:empty {
+      display: none;
+    }
+
+    aside:first-child:empty:has(~ aside:not(:empty)) ~ article,
+    aside:first-child:not(:empty) ~ article:has(~ aside:empty) {
+      flex: 3;
+    }
+  }
+}
+
 @media only screen and (max-width: 960px) {
   %page-style {
     width: ROUND(80%, 2px) !important;