Merge pull request #653 from AppQuality/fix-scroll-x-campaign

🔧 fix(CampaignPage.tsx): import Col component from '@appquality/unguess-design-system'

Author: cannarocks

src/pages/Campaign/CampaignPage.tsx

@@ -1,4 +1,4 @@
-import { Grid, Row } from '@appquality/unguess-design-system';
+import { Col, Grid, Row } from '@appquality/unguess-design-system';
 import { useEffect } from 'react';
 import { useLocation, useNavigate, useParams } from 'react-router-dom';
 import { useAppDispatch } from 'src/app/hooks';
@@ -80,7 +80,9 @@ const CampaignPage = ({ children }: { children: React.ReactNode }) => {
     >
       <LayoutWrapper>
         <Grid>
-          <Row>{children}</Row>
+          <Row>
+            <Col>{children}</Col>
+          </Row>
         </Grid>
       </LayoutWrapper>
     </Page>

src/pages/Campaign/useWidgets/Experience/widgets/General/index.tsx

@@ -1,5 +1,5 @@
 import { Campaign } from 'src/features/api';
-import { Col, Row } from '@appquality/unguess-design-system';
+import { Col, Grid, Row } from '@appquality/unguess-design-system';
 import { SectionTitle } from 'src/pages/Campaign/SectionTitle';
 import { Divider } from 'src/common/components/divider';
 import { appTheme } from 'src/app/theme';
@@ -32,7 +32,7 @@ export const CampaignInfo = ({
   const { t } = useTranslation();
 
   return (
-    <div style={{ marginBottom: appTheme.space.xxl }} id={id}>
+    <Grid style={{ marginBottom: appTheme.space.xxl }} id={id}>
       <Row>
         <Col xs={12} style={{ margin: 0 }}>
           <SectionTitle
@@ -50,6 +50,6 @@ export const CampaignInfo = ({
           <Methodology campaignId={campaign.id} isPreview={isPreview} />
         </div>
       </StyledRow>
-    </div>
+    </Grid>
   );
 };

src/pages/Campaign/useWidgets/Experience/widgets/Overview/index.tsx

@@ -1,5 +1,5 @@
 import { Campaign } from 'src/features/api';
-import { Col, Row } from '@appquality/unguess-design-system';
+import { Col, Grid, Row } from '@appquality/unguess-design-system';
 import { SectionTitle } from 'src/pages/Campaign/SectionTitle';
 import { Divider } from 'src/common/components/divider';
 import { appTheme } from 'src/app/theme';
@@ -18,7 +18,7 @@ export const Overview = ({
   const { t } = useTranslation();
 
   return (
-    <div style={{ marginBottom: appTheme.space.xxl }} id={id}>
+    <Grid style={{ marginBottom: appTheme.space.xxl }} id={id}>
       <Row>
         <Col xs={12} style={{ margin: 0 }}>
           <SectionTitle
@@ -33,6 +33,6 @@ export const Overview = ({
           <Sentiment campaignId={campaign.id} isPreview={isPreview} />
         </Col>
       </Row>
-    </div>
+    </Grid>
   );
 };