Responsive tables.

components/layout/MenuLayout.module.css

@@ -2,6 +2,7 @@
   display: flex;
   flex: 1;
   position: relative;
+  height: 100%;
 }
 
 .container .menu {
@@ -35,6 +36,10 @@
 }
 
 @media only screen and (max-width: 992px) {
+  .container {
+    height: auto;
+  }
+
   .container .content {
     border-top: 1px solid var(--gray300);
     border-left: 0;

components/layout/Page.js

@@ -2,5 +2,5 @@ import React from 'react';
 import styles from './Page.module.css';
 
 export default function Page({ children }) {
-  return <div className={styles.container}>{children}</div>;
+  return <div className={styles.page}>{children}</div>;
 }

components/layout/Page.module.css

@@ -1,7 +1,4 @@
-.container {
-  flex: 1;
-  display: flex;
-  flex-direction: column;
+.page {
   padding: 0 30px;
   background: var(--gray50);
   height: 100%;