feat: Diminish banner height

Author: ptbrowne

app/configurator/components/presence.tsx

@@ -36,9 +36,11 @@ export const navPresenceProps = {
   exit: "exit",
 };
 
+export const BANNER_HEIGHT = 250;
+export const BANNER_MARGIN_TOP = 96;
 export const bannerPresenceProps: Transition = {
   transition: { duration: 0.5 },
-  initial: { marginTop: -446 },
-  animate: { marginTop: 96 },
-  exit: { marginTop: -446 },
+  initial: { marginTop: -(BANNER_HEIGHT + BANNER_MARGIN_TOP) },
+  animate: { marginTop: BANNER_MARGIN_TOP },
+  exit: { marginTop: -(BANNER_HEIGHT + BANNER_MARGIN_TOP) },
 };

app/configurator/components/select-dataset-step.tsx

@@ -29,6 +29,8 @@ import {
 } from "@/configurator/components/layout";
 import {
   bannerPresenceProps,
+  BANNER_HEIGHT,
+  BANNER_MARGIN_TOP,
   MotionBox,
   navPresenceProps,
   smoothPresenceProps,
@@ -81,8 +83,8 @@ const useStyles = makeStyles<Theme, { datasetPresent: boolean }>((theme) => ({
     gridTemplateColumns:
       "minmax(12rem, 20rem) minmax(22rem, 1fr) minmax(12rem, 20rem)",
     gridTemplateAreas: `". banner ."`,
-    height: 350,
-    marginTop: 96,
+    height: BANNER_HEIGHT,
+    marginTop: BANNER_MARGIN_TOP,
     backgroundColor: theme.palette.primary.light,
   },
   panelBanner: {