add soc2 banner

components/Common/SOC2/index.jsx

@@ -0,0 +1,43 @@
+import PropTypes from 'prop-types';
+import Image from 'next/image';
+import soc2Logo from '../../../public/images/soc2.png';
+
+const Soc2Banner = ({ title, subTitle }) => {
+  const defaultTitle = (
+    <>Secured and compliant, because your data&nbsp;matters</>
+  );
+  const defaultSubTitle =
+    'Amplication is SOC-2 certified. We meet the highest standards for data security, availability, processing, integrity, confidentiality, and privacy.';
+
+  return (
+    <div className="d-flex align-items-center py-3 max-medium:flex-col max-medium:text-center">
+      <div className="max-medium:pb-8">
+        <h2 className="roadmap-heading m-0 pt-1">{title || defaultTitle}</h2>
+        <div>{subTitle || defaultSubTitle}</div>
+      </div>
+      <div className="ml-auto w-full large:max-w-[35%] d-flex justify-center align-items-center">
+        <Image src={soc2Logo} alt={'SOC2 Logo'} />
+        <div className="text-center d-flex align-items-center flex-column pl-4">
+          <span className="text-[32px] !font-semibold leading-[48px] whitespace-nowrap">
+            SOC 2 Type II
+          </span>
+          <span className="text-[24px] leading-[36px] border-t-1 font-normal tracking-widest">
+            CERTIFIED
+          </span>
+        </div>
+      </div>
+    </div>
+  );
+};
+
+Soc2Banner.propTypes = {
+  title: PropTypes.string,
+  subTitle: PropTypes.string,
+};
+
+Soc2Banner.defaultProps = {
+  title: undefined,
+  subTitle: undefined,
+};
+
+export default Soc2Banner;

pages/enterprise.js

@@ -13,6 +13,7 @@ import helpers from '../helpers';
 import Image from 'next/image';
 import Link from 'next/link';
 import PageSection from '../components/Common/PageSection';
+import Soc2Banner from '../components/Common/SOC2';
 
 const features = [
   {
@@ -161,14 +162,9 @@ const Features = () => {
           }}
         />
         <IconsGroup />
-        <StartNow
-          title="Build faster, with no limits"
-          description="Try Amplication Enterprise today and unlock the power of fast development cycles."
-          linkPrimary={{
-            href: 'https://app.amplication.com/login',
-            title: 'Start Now',
-          }}
-        />
+        <PageSection >
+          <Soc2Banner title={"Enterprise-grade compliance"} subTitle={"We strive to provide you with a secure environment where you can confidently build and manage your applications. Amplication meets rigorous standards for data security, availability, processing, integrity, confidentiality, and privacy. We are SOC-2 certified and continuously monitor and improve our data security measures."} />
+        </PageSection>
       </main>
     </>
   );

pages/index.js

@@ -10,6 +10,7 @@ import LogoList from '../components/Sections/About/LogoList';
 import { NextSeo } from 'next-seo';
 import { MainLayout } from '../layouts';
 import PageSection from '../components/Common/PageSection';
+import Soc2Banner from '../components/Common/SOC2';
 
 const Home = () => {
   return (
@@ -36,18 +37,22 @@ const Home = () => {
         <PageSection className={"page-welcome !pt-10 !pb-8 large:!py-[9vh] xlg:!py-[17vh]"}>
           <HeroBlock />
         </PageSection>
-        <PageSection alternate className={'!pt-5 !pb-4 laptop:!py-20 '} innerClassName={"flex-grow"}>
+        <PageSection className={'!pt-5 !pb-4 laptop:!py-20 '} innerClassName={"flex-grow"}>
           <Slider />
         </PageSection>
+        <PageSection alternate className={"page-welcome-solution !py-20"} >
+          <Features />
+        </PageSection>
         <PageSection innerClassName={"flex-grow"} className={"!pt-5 !pb-4 laptop:!px-14 laptop:!pt-24 laptop:!pb-20"} >
           <Testimonials />
         </PageSection>
         <PageSection className={"!py-10"} alternate>
           <Facts />
         </PageSection>
-        <PageSection className={"page-welcome-solution !py-20"} >
-          <Features />
+        <PageSection >
+          <Soc2Banner />
         </PageSection>
+
         <PageSection alternate className={"!py-20"} >
           <GetList />
         </PageSection>

tailwind.config.js

@@ -97,6 +97,7 @@ module.exports = {
       },
       borderWidth: {
         3: '3px',
+        1: '1px',
       },
       boxShadow: {
         hidden: 'initial',