@times-components/ts-components 1.146.2-784617dc4a33959b8795da1d7f425c9929322fae.24 → 1.146.2-9d94da839cee591620d598d11e637971d7109888.26

package/src/components/travel-mini-cta/index.tsx

@@ -39,7 +39,8 @@ export const TravelMiniCTA: FC<TravelMiniCTAProps> = ({
   primaryButtonText,
   secondaryButtonText,
   secondaryButtonUrl,
-  isApp
+  isApp,
+  isOnChannelPage = false
 }) => {
   const [chatReady, setChatReady] = useState(false);
   const [chatFailed, setChatFailed] = useState(false);
@@ -158,7 +159,7 @@ export const TravelMiniCTA: FC<TravelMiniCTAProps> = ({
                 ))}
             </WorkingHoursContainer>
           </ContactInfo>
-          <ButtonsContainer>
+          <ButtonsContainer $isOnChannelPage={isOnChannelPage}>
             {chatFailed ? (
               <PrimaryButton as="a" href={`tel:${phoneNumber}`} isApp={isApp}>
                 {buttonText}

package/src/components/travel-mini-cta/styles.ts

@@ -243,12 +243,14 @@ export const WorkingHoursText = styled.div<{ isApp?: boolean }>`
     )};
 `;
 
-export const ButtonsContainer = styled.div`
+export const ButtonsContainer = styled.div<{ $isOnChannelPage?: boolean }>`
   display: flex;
+  flex-direction: column;
   gap: 16px;
 
-  ${getMediaQuery('xs', 'md')} {
-    flex-direction: column;
+  ${getMediaQuery('lg')} {
+    flex-direction: ${({ $isOnChannelPage }) =>
+      $isOnChannelPage ? 'row' : 'column'};
   }
 `;
 

package/src/components/travel-mini-cta/travel-mini-cta.stories.tsx

@@ -13,7 +13,7 @@ storiesOf('Typescript Component/In Article/Travel Mini CTA', module).add(
           phoneLabel="Call us on"
           phoneNumber="08083049757"
           workingHours={['Mon - Fri: 9am - 6pm', 'Sat: 10am - 5pm']}
-          primaryButtonText="Chat with us"
+          primaryButtonText="Chat to a consultant"
           secondaryButtonText="Enquire now"
           secondaryButtonUrl="/enquire"
         />

package/src/components/travel-mini-cta/types.ts

@@ -7,4 +7,5 @@ export interface TravelMiniCTAProps {
   secondaryButtonText?: string;
   secondaryButtonUrl?: string;
   isApp?: boolean;
+  isOnChannelPage?: boolean;
 }