refactor(site): Add bottom spacing to the dashboard layout (#6084)

site/src/components/Dashboard/DashboardLayout.tsx

@@ -12,6 +12,7 @@ import { updateCheckMachine } from "xServices/updateCheck/updateCheckXService"
 import { usePermissions } from "hooks/usePermissions"
 import { UpdateCheckResponse } from "api/typesGenerated"
 import { DashboardProvider } from "./DashboardProvider"
+import { dashboardContentBottomPadding } from "theme/constants"
 
 export const DashboardLayout: FC = () => {
   const styles = useStyles()
@@ -71,5 +72,6 @@ const useStyles = makeStyles((theme) => ({
   },
   siteContent: {
     flex: 1,
+    paddingBottom: dashboardContentBottomPadding, // Add bottom space since we don't use a footer
   },
 }))

site/src/components/TemplateVersionEditor/TemplateVersionEditor.tsx

@@ -16,7 +16,7 @@ import { AvatarData } from "components/AvatarData/AvatarData"
 import { TemplateResourcesTable } from "components/TemplateResourcesTable/TemplateResourcesTable"
 import { WorkspaceBuildLogs } from "components/WorkspaceBuildLogs/WorkspaceBuildLogs"
 import { FC, useCallback, useEffect, useRef, useState } from "react"
-import { navHeight } from "theme/constants"
+import { dashboardContentBottomPadding, navHeight } from "theme/constants"
 import { TemplateVersionFiles } from "util/templateVersion"
 import {
   CreateFileDialog,
@@ -403,6 +403,7 @@ const useStyles = makeStyles<
     flex: 1,
     display: "flex",
     flexDirection: "column",
+    marginBottom: -dashboardContentBottomPadding, // Remove dashboard bottom padding
   },
   topbar: {
     padding: theme.spacing(2),

site/src/theme/constants.ts

@@ -8,3 +8,4 @@ export const containerWidth = 1380
 export const containerWidthMedium = 1080
 export const sidePadding = 24
 export const CardPadding = 20
+export const dashboardContentBottomPadding = 8 * 6