From 64f4f31a6733ba2460710e00433c03c56c93926e Mon Sep 17 00:00:00 2001
From: meenakshi-deriv <meenakshi@regentmarkets.com>
Date: Thu, 15 Feb 2024 10:59:42 +0400
Subject: [PATCH 1/2] fix: export cta block

---
 libs/blocks/src/index.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/libs/blocks/src/index.ts b/libs/blocks/src/index.ts
index a9f4ed8b3..a6b55b2cc 100644
--- a/libs/blocks/src/index.ts
+++ b/libs/blocks/src/index.ts
@@ -16,3 +16,4 @@ export * from './lib/search';
 export * from './lib/social-proof';
 export * from './lib/platform';
 export * from './lib/block-wrapper';
+export * from './lib/cta';

From 16595ae92c5b483971b412c498c67a0a31fd0a79 Mon Sep 17 00:00:00 2001
From: meenakshi-deriv <meenakshi@regentmarkets.com>
Date: Fri, 16 Feb 2024 14:37:21 +0400
Subject: [PATCH 2/2] fix: cta block fixes

---
 libs/blocks/src/lib/cta/cta.stories.tsx |  6 +++---
 libs/blocks/src/lib/cta/index.tsx       | 14 +++++++++-----
 2 files changed, 12 insertions(+), 8 deletions(-)

diff --git a/libs/blocks/src/lib/cta/cta.stories.tsx b/libs/blocks/src/lib/cta/cta.stories.tsx
index bb577cf09..7dd9b37c0 100644
--- a/libs/blocks/src/lib/cta/cta.stories.tsx
+++ b/libs/blocks/src/lib/cta/cta.stories.tsx
@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/react';
 import CTABlock from '.';
-import { Text } from '@deriv/quill-design';
+import { Button, Text } from '@deriv/quill-design';
 
 const meta = {
   title: 'Blocks/CTABlock',
@@ -36,8 +36,8 @@ export const CTAContentLeft: Story = {
     content: (
       <>
         <img
-          className="block  w-full lg:hidden"
-          src="https://placehold.co/420x230"
+          className="block  w-full flex-1  lg:hidden"
+          src="https://placehold.co/256x496"
           alt="Placeholder"
         />
         <img
diff --git a/libs/blocks/src/lib/cta/index.tsx b/libs/blocks/src/lib/cta/index.tsx
index 7aa28d6a7..9da670630 100644
--- a/libs/blocks/src/lib/cta/index.tsx
+++ b/libs/blocks/src/lib/cta/index.tsx
@@ -18,16 +18,16 @@ const CTABlock = ({
   variant = 'content-left',
 }: CTABlockProps) => {
   return (
-    <Section className="py-general-4xl">
+    <Section className=" py-general-4xl">
       <div
         className={clsx(
-          ' relative isolate flex flex-col justify-center gap-gap-lg  lg:mx-auto lg:max-w-[1232px]',
+          ' relative isolate flex  h-full min-h-[496px] flex-col justify-end gap-gap-lg  md:justify-center  lg:mx-auto  lg:max-w-[1232px] ',
           variant === 'content-left' ? 'lg:flex-row-reverse' : 'lg:flex-row  ',
         )}
       >
         <div
           className={clsx(
-            'flex flex-col justify-center gap-gap-3xl px-general-lg lg:px-general-none ',
+            'flex w-full flex-col justify-center gap-gap-3xl px-general-lg pb-general-2xl lg:px-general-none lg:pb-general-none',
             variant === 'content-left'
               ? 'lg:ps-general-2xl '
               : 'lg:pe-general-2xl ',
@@ -41,7 +41,11 @@ const CTABlock = ({
               'lg:w-full',
             )}
           >
-            {title && <Heading.H2>{title}</Heading.H2>}
+            {title && (
+              <Heading.H2 className="text-solid-slate-50 lg:text-typography-prominent">
+                {title}
+              </Heading.H2>
+            )}
             {description && <Text>{description}</Text>}
           </div>
           {children && children}
@@ -49,7 +53,7 @@ const CTABlock = ({
         {content && (
           <div
             className={clsx([
-              'absolute -z-10  overflow-hidden object-cover object-top',
+              'absolute -z-10  h-full overflow-hidden object-cover object-top ',
               'h-full w-full lg:relative',
             ])}
           >