slightly adapt style

src/common-elements/headers.ts

@@ -51,6 +51,8 @@ export const UnderlinedHeader = styled.h5`
   text-transform: uppercase;
   font-size: 0.929em;
   line-height: 20px;
+  border-bottom: 1px solid rgb(228, 231, 235);
+  padding-bottom: 0.8em;
 
   ${extensionsHook('UnderlinedHeader')};
 `;

src/common-elements/panels.ts

@@ -12,6 +12,12 @@ export const MiddlePanel = styled.div<{ $compact?: boolean }>`
       theme.spacing.sectionHorizontal
     }px`};
   `};
+  ${({ $compact, theme }) =>
+    media.lessThan('small', true)`
+    padding: ${`${$compact ? 0 : theme.spacing.sectionVertical / 2}px ${
+      theme.spacing.sectionHorizontal / 2
+    }px`};
+  `};
 `;
 
 export const Section = styled.div.attrs(props => ({

src/components/Parameters/Parameters.tsx

@@ -101,7 +101,9 @@ export function BodyContent(props: {
       {({ schema }) => {
         return (
           <>
-            {description !== undefined && <Markdown source={description} />}
+            {description !== undefined && <p></p> && (
+              <Markdown className={'description-body-request'} source={description} />
+            )}
             {schema?.type === 'object' && (
               <ConstraintsView constraints={schema?.constraints || []} />
             )}

src/components/Schema/ArraySchema.tsx

@@ -10,6 +10,7 @@ import { ObjectSchema } from './ObjectSchema';
 
 const PaddedSchema = styled.div`
   padding-left: ${({ theme }) => theme.spacing.unit * 2}px;
+  padding-top: ${({ theme }) => theme.spacing.unit * 2}px;
 `;
 
 export class ArraySchema extends React.PureComponent<SchemaProps> {

src/components/SecurityRequirement/styled.elements.ts

@@ -102,8 +102,7 @@ export const Wrap = styled.div<{ $expanded?: boolean }>`
   width: 100%;
   display: flex;
   margin: 1em 0;
-  padding-bottom: 1em;
-  border-bottom: 1px solid rgb(228, 231, 235);
+  padding-bottom: 0.8em;
   flex-direction: ${p => (p.$expanded ? 'column' : 'row')};
   ${media.lessThan('small')`
     flex-direction: column;