fix collapsible section subtitle position (#85)

Author: stanislavCQ

src/components/form/sections/collapsibleSubSection.tsx

@@ -4,6 +4,7 @@ import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
 import Accordion, { AccordionProps } from '@mui/material/Accordion';
 import AccordionDetails from '@mui/material/AccordionDetails';
 import AccordionSummary from '@mui/material/AccordionSummary';
+import Stack from '@mui/material/Stack';
 import useTheme from '@mui/material/styles/useTheme';
 import Typography from '@mui/material/Typography/Typography';
 
@@ -46,12 +47,18 @@ export function CollapsibleSubSection({
         sx={{ backgroundColor: 'transparent', paddingLeft: 0 }}
         expandIcon={<ExpandMoreIcon />}
       >
-        {title && <Typography variant="h6">{title}</Typography>}
-        {subtitle && (
-          <Typography variant="body2" sx={{ color: palette.text.secondary }}>
-            {subtitle}
-          </Typography>
-        )}
+        <Stack
+          sx={{
+            gap: 1,
+          }}
+        >
+          {title && <Typography variant="h6">{title}</Typography>}
+          {subtitle && (
+            <Typography variant="body2" color={palette.text.secondary}>
+              {subtitle}
+            </Typography>
+          )}
+        </Stack>
       </AccordionSummary>
       <AccordionDetails sx={{ paddingLeft: 0 }}>
         <SubSection>{children}</SubSection>