From d123bed87518c144c7eac0bc72ceb8034fcd3cef Mon Sep 17 00:00:00 2001
From: Owaise Imdad <owaiseimdad@gmail.com>
Date: Sat, 1 Mar 2025 22:43:35 +0530
Subject: [PATCH] FIX-1848 minor theme fixes.

---
 .../Create/Components/Tabs/SectionStack.jsx   | 22 +++++++++++--------
 1 file changed, 13 insertions(+), 9 deletions(-)

diff --git a/src/Pages/StatusPage/Create/Components/Tabs/SectionStack.jsx b/src/Pages/StatusPage/Create/Components/Tabs/SectionStack.jsx
index 2eacf5ea5..9708d8a85 100644
--- a/src/Pages/StatusPage/Create/Components/Tabs/SectionStack.jsx
+++ b/src/Pages/StatusPage/Create/Components/Tabs/SectionStack.jsx
@@ -1,17 +1,21 @@
 import { Stack, Typography } from "@mui/material";
 import ConfigBox from "../../../../../Components/ConfigBox";
 import PropTypes from "prop-types";
+import { useTheme } from "@emotion/react";
 
 // This can be used to add any extra/additional section/stacks on top of existing sections on the tab
-const SectionStack = ({ title, description, children }) => (
-	<ConfigBox>
-		<Stack gap={2}>
-			<Typography component="h2">{title}</Typography>
-			<Typography component="p">{description}</Typography>
-		</Stack>
-		{children}
-	</ConfigBox>
-);
+const SectionStack = ({ title, description, children }) => {
+	const theme = useTheme();
+	return (
+		<ConfigBox>
+			<Stack gap={theme.spacing(6)}>
+				<Typography component="h2">{title}</Typography>
+				<Typography component="p">{description}</Typography>
+			</Stack>
+			{children}
+		</ConfigBox>
+	);
+};
 
 SectionStack.propTypes = {
 	title: PropTypes.string.isRequired, // Title must be a string and is required