diff --git a/packages/marketplace/src/components/pages/client-app-detail/__test__/__snapshots__/aside.test.tsx.snap b/packages/marketplace/src/components/pages/client-app-detail/__test__/__snapshots__/aside.test.tsx.snap
index 0be34ef4b3..e30b98a856 100644
--- a/packages/marketplace/src/components/pages/client-app-detail/__test__/__snapshots__/aside.test.tsx.snap
+++ b/packages/marketplace/src/components/pages/client-app-detail/__test__/__snapshots__/aside.test.tsx.snap
@@ -67,47 +67,43 @@ exports[`WebComponentConfig Should match snapshot 1`] = `
   }
 >
   <Component>
-    <Component>
-      <div
-        className="column  "
+    <div>
+      <Component>
+        <h5
+          className="title is-5  "
+          id=""
+        >
+          Settings
+        </h5>
+      </Component>
+      <Component
+        fullWidth={true}
+        onClick={[Function]}
+        type="button"
+        variant="primary"
       >
-        <Component>
-          <h6
-            className="title is-6  "
-            id=""
-          >
-            Settings
-          </h6>
-        </Component>
-        <Component
-          fullWidth={true}
+        <button
+          className="button  is-primary is-fullwidth "
+          data-test=""
+          disabled={false}
           onClick={[Function]}
           type="button"
-          variant="primary"
         >
-          <button
-            className="button  is-primary is-fullwidth "
-            data-test=""
-            disabled={false}
-            onClick={[Function]}
-            type="button"
-          >
-            Configuration
-          </button>
-        </Component>
-      </div>
-    </Component>
-    <Component
-      afterClose={[Function]}
-      closeModal={[Function]}
-      type="BOOK_VIEWING"
-    >
+          Configuration
+        </button>
+      </Component>
       <Component
         afterClose={[Function]}
-        renderChildren={true}
-        visible={true}
-      />
-    </Component>
+        closeModal={[Function]}
+        type="BOOK_VIEWING"
+      >
+        <Component
+          afterClose={[Function]}
+          renderChildren={true}
+          visible={true}
+        />
+      </Component>
+    </div>
   </Component>
 </Provider>
 `;
diff --git a/packages/marketplace/src/components/pages/client-app-detail/aside.tsx b/packages/marketplace/src/components/pages/client-app-detail/aside.tsx
index dc67c27316..f7ace520b8 100644
--- a/packages/marketplace/src/components/pages/client-app-detail/aside.tsx
+++ b/packages/marketplace/src/components/pages/client-app-detail/aside.tsx
@@ -4,12 +4,13 @@ import standAloneAppDetailStyles from '@/styles/blocks/standalone-app-detail.scs
 import { renderCategory, renderDesktopIntegrationTypes } from '../client-app-detail/app-content'
 import { DesktopIntegrationTypeModel } from '@reapit/foundations-ts-definitions'
 import { AppDetailDataNotNull } from '@/reducers/client/app-detail'
-import { GridItem, Button, H6 } from '@reapit/elements'
+import { Button, H5 } from '@reapit/elements'
 import { useDispatch, useSelector } from 'react-redux'
 import { selectIsWebComponentOpen } from '@/selector/client'
 import { clientCloseWebComponentConfig, clientOpenWebComponentConfig } from '@/actions/client'
 import { Dispatch } from 'redux'
 import WebComponentModal from '@/components/ui/web-component-config-modal'
+import clientAppDetailStyles from '@/styles/pages/client-app-detail.scss?mod'
 
 interface AsideProps {
   appDetailData: AppDetailDataNotNull
@@ -29,8 +30,12 @@ export const Aside: React.FC<AsideProps> = ({ desktopIntegrationTypes, appDetail
         <div className={standAloneAppDetailStyles.headerWithoutMargin}>
           {renderDesktopIntegrationTypes(desktopIntegrationTypes)}
         </div>
+        {isWebComponent && (
+          <div className={standAloneAppDetailStyles.headerWithoutMargin}>
+            <WebComponentConfig />
+          </div>
+        )}
       </div>
-      {isWebComponent && <WebComponentConfig />}
     </div>
   )
 }
@@ -49,13 +54,11 @@ export const WebComponentConfig = () => {
   const handleToggleWebComponentModal = toggleWebComponentModal(dispatch)
   const handleCloseWebComponentModal = closeWebComponentModal(dispatch)
   return (
-    <>
-      <GridItem>
-        <H6>Settings</H6>
-        <Button type="button" variant="primary" fullWidth onClick={handleToggleWebComponentModal}>
-          Configuration
-        </Button>
-      </GridItem>
+    <div className={clientAppDetailStyles.gutter}>
+      <H5>Settings</H5>
+      <Button type="button" variant="primary" fullWidth onClick={handleToggleWebComponentModal}>
+        Configuration
+      </Button>
       {isWebComponentOpen && (
         <WebComponentModal
           type="BOOK_VIEWING"
@@ -63,6 +66,6 @@ export const WebComponentConfig = () => {
           closeModal={handleCloseWebComponentModal}
         />
       )}
-    </>
+    </div>
   )
 }
diff --git a/packages/marketplace/src/tests/badges/badge-branches.svg b/packages/marketplace/src/tests/badges/badge-branches.svg
index dd44c5ead6..d254136e33 100644
--- a/packages/marketplace/src/tests/badges/badge-branches.svg
+++ b/packages/marketplace/src/tests/badges/badge-branches.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="170" height="20"><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="r"><rect width="170" height="20" rx="3" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="117" height="20" fill="#555"/><rect x="117" width="53" height="20" fill="#e05d44"/><rect width="170" height="20" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text x="595" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="1070">Coverage:branches</text><text x="595" y="140" transform="scale(.1)" textLength="1070">Coverage:branches</text><text x="1425" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="430">71.35%</text><text x="1425" y="140" transform="scale(.1)" textLength="430">71.35%</text></g></svg>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="170" height="20"><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="r"><rect width="170" height="20" rx="3" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="117" height="20" fill="#555"/><rect x="117" width="53" height="20" fill="#e05d44"/><rect width="170" height="20" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text x="595" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="1070">Coverage:branches</text><text x="595" y="140" transform="scale(.1)" textLength="1070">Coverage:branches</text><text x="1425" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="430">71.53%</text><text x="1425" y="140" transform="scale(.1)" textLength="430">71.53%</text></g></svg>
\ No newline at end of file
diff --git a/packages/marketplace/src/tests/badges/badge-functions.svg b/packages/marketplace/src/tests/badges/badge-functions.svg
index 11ad3123df..446c1469ed 100644
--- a/packages/marketplace/src/tests/badges/badge-functions.svg
+++ b/packages/marketplace/src/tests/badges/badge-functions.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="170" height="20"><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="r"><rect width="170" height="20" rx="3" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="117" height="20" fill="#555"/><rect x="117" width="53" height="20" fill="#e05d44"/><rect width="170" height="20" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text x="595" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="1070">Coverage:functions</text><text x="595" y="140" transform="scale(.1)" textLength="1070">Coverage:functions</text><text x="1425" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="430">78.39%</text><text x="1425" y="140" transform="scale(.1)" textLength="430">78.39%</text></g></svg>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="170" height="20"><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="r"><rect width="170" height="20" rx="3" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="117" height="20" fill="#555"/><rect x="117" width="53" height="20" fill="#e05d44"/><rect width="170" height="20" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text x="595" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="1070">Coverage:functions</text><text x="595" y="140" transform="scale(.1)" textLength="1070">Coverage:functions</text><text x="1425" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="430">77.11%</text><text x="1425" y="140" transform="scale(.1)" textLength="430">77.11%</text></g></svg>
\ No newline at end of file
diff --git a/packages/marketplace/src/tests/badges/badge-lines.svg b/packages/marketplace/src/tests/badges/badge-lines.svg
index ae82c191e2..01e37a3d1b 100644
--- a/packages/marketplace/src/tests/badges/badge-lines.svg
+++ b/packages/marketplace/src/tests/badges/badge-lines.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="146" height="20"><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="r"><rect width="146" height="20" rx="3" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="93" height="20" fill="#555"/><rect x="93" width="53" height="20" fill="#4c1"/><rect width="146" height="20" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text x="475" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="830">Coverage:lines</text><text x="475" y="140" transform="scale(.1)" textLength="830">Coverage:lines</text><text x="1185" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="430">90.28%</text><text x="1185" y="140" transform="scale(.1)" textLength="430">90.28%</text></g></svg>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="146" height="20"><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="r"><rect width="146" height="20" rx="3" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="93" height="20" fill="#555"/><rect x="93" width="53" height="20" fill="#4c1"/><rect width="146" height="20" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text x="475" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="830">Coverage:lines</text><text x="475" y="140" transform="scale(.1)" textLength="830">Coverage:lines</text><text x="1185" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="430">90.34%</text><text x="1185" y="140" transform="scale(.1)" textLength="430">90.34%</text></g></svg>
\ No newline at end of file
diff --git a/packages/marketplace/src/tests/badges/badge-statements.svg b/packages/marketplace/src/tests/badges/badge-statements.svg
index d56bc11bbb..e8a2820053 100644
--- a/packages/marketplace/src/tests/badges/badge-statements.svg
+++ b/packages/marketplace/src/tests/badges/badge-statements.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="182" height="20"><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="r"><rect width="182" height="20" rx="3" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="129" height="20" fill="#555"/><rect x="129" width="53" height="20" fill="#dfb317"/><rect width="182" height="20" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text x="655" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="1190">Coverage:statements</text><text x="655" y="140" transform="scale(.1)" textLength="1190">Coverage:statements</text><text x="1545" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="430">89.49%</text><text x="1545" y="140" transform="scale(.1)" textLength="430">89.49%</text></g></svg>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="182" height="20"><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="r"><rect width="182" height="20" rx="3" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="129" height="20" fill="#555"/><rect x="129" width="53" height="20" fill="#dfb317"/><rect width="182" height="20" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text x="655" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="1190">Coverage:statements</text><text x="655" y="140" transform="scale(.1)" textLength="1190">Coverage:statements</text><text x="1545" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="430">89.15%</text><text x="1545" y="140" transform="scale(.1)" textLength="430">89.15%</text></g></svg>
\ No newline at end of file