Added mobile spacer

components/Header.module.css

@@ -84,6 +84,10 @@
 	cursor: pointer;
 }
 
+.mobileSpacer {
+	display: none;
+}
+
 @media screen and (max-width: 768px) {
 	.sideBarCommon {
 		width: 90vw;
@@ -96,6 +100,11 @@
 	.headerWrapper {
 		padding: calc(10rem / 16) calc(20rem / 16) 0 calc(20rem / 16);
 	}
+
+	.mobileSpacer {
+		display: block;
+		padding: calc(50rem / 16);
+	}
 }
 
 .closeMenuButton {

components/Header.tsx

@@ -26,41 +26,41 @@ export function Header() {
         </button>
       </div>
 
-      <>
+      <div className={styles.mobileSpacer} />
-        <div
-          className={isShowingMenu ? styles.sideBarShown : styles.sideBarHidden}
-        >
-          <h1 className={styles.menuHeader}>Sections</h1>
-          <div className={styles.lineWrapper}>
-            <button
-              className={styles.closeMenuButton}
-              onClick={(_) => {
-                setIsShowingMenu(false);
-              }}
-            >
-              <img
-                src="/images/rightArrow.svg"
-                className={styles.arrowIcon}
-                width="50"
-                height="50"
-                draggable="false"
-              />
-            </button>
-          </div>
-          <Sections data={sectionsData} />
-        </div>
 
-        <div
+      <div
-          className={
+        className={isShowingMenu ? styles.sideBarShown : styles.sideBarHidden}
-            isShowingMenu
+      >
-              ? styles.backgroundTintShow
+        <h1 className={styles.menuHeader}>Sections</h1>
-              : styles.backgroundTintHidden
+        <div className={styles.lineWrapper}>
-          }
+          <button
-          onClick={(_) => {
+            className={styles.closeMenuButton}
-            setIsShowingMenu(false);
+            onClick={(_) => {
-          }}
+              setIsShowingMenu(false);
-        />
+            }}
-      </>
+          >
+            <img
+              src="/images/rightArrow.svg"
+              className={styles.arrowIcon}
+              width="50"
+              height="50"
+              draggable="false"
+            />
+          </button>
+        </div>
+        <Sections data={sectionsData} />
+      </div>
+
+      <div
+        className={
+          isShowingMenu
+            ? styles.backgroundTintShow
+            : styles.backgroundTintHidden
+        }
+        onClick={(_) => {
+          setIsShowingMenu(false);
+        }}
+      />
     </>
   );
 }