feat: create results cta component

fix responsiveness

src/components/search/results/results-cta/index.js

@@ -0,0 +1 @@
+export * from './results-cta'

src/components/search/results/results-cta/results-cta.css

@@ -0,0 +1,18 @@
+.cta-card {
+  margin: 1rem 0 3rem 0 !important;
+}
+
+.cta-card .text-container {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  font-size: 150%;
+  word-wrap: break-word;
+  padding: 1rem;
+}
+
+.cta-card .button-container {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}

src/components/search/results/results-cta/results-cta.js

@@ -0,0 +1,27 @@
+import React from 'react'
+import { Button, Card, Col, Row, Typography } from 'antd'
+import { useEnvironment } from '../../../../contexts'
+import { ArrowRightOutlined as CtaIcon } from '@ant-design/icons'
+
+import './results-cta.css'
+
+export const ResultsCTA = () => {
+  const { context } = useEnvironment()
+
+  return (
+    <Card className="cta-card">
+      <Row>
+        <Col className="text-container" xl={ 18 } lg={ 18 } md={ 20 } sm={ 24 } xs={ 24 }>
+          <Typography>{ context['results-cta'].text }</Typography>
+        </Col>
+        <Col className="button-container" xl={ 6 } lg={ 6 } md={ 4 } sm={ 24 } xs={ 24 }>
+          <Button
+            type="primary"
+            icon={ <CtaIcon /> }
+            href={ context['results-cta'].action.url }
+          >{ context['results-cta'].action.label }</Button>
+        </Col>
+      </Row>          
+    </Card>
+  )
+}