testsigmahq · jayavel-testsigma · Sep 11, 2023 · Sep 11, 2023 · Sep 11, 2023 · Sep 11, 2023
diff --git a/src/components/Footer.jsx b/src/components/Footer.jsx
@@ -10,7 +10,13 @@ const Footer = ()=> {
     return (
         <>
             <FeedbackButtons />
-            <SubscribeButton />
+            {/* <SubscribeButton /> */}
+            <div className='footer-cta rounded'>
+                <div className='flex items-center justify-between'>
+                    <h3 className='cta-heading m-0'>Learn how to execute low code tests across 3000+ device / browser environments.</h3>
+                    <a href='/request-demo' target={'_blank'} className='cta-link border border-green-600 px-4 py-1.5 bg-green-600 text-white rounded h-10'>Schedule a free demo</a>
+                </div>
+            </div>
             <div className="footer_greyBox">
                     <svg width="109" height="26" viewBox="0 0 109 26" fill="none" xmlns="http://www.w3.org/2000/svg">
                         <path

diff --git a/src/components/Footer.scss b/src/components/Footer.scss
@@ -1,7 +1,5 @@
 .footer_docs{
-  margin-top: 0px;
-  position: relative;
-  top: 40px;
+  margin: 2rem 0;
   @media (max-width: 576px) {
     overflow: hidden;
     top: 20px;
@@ -202,6 +200,7 @@
           border-radius: 3px;
           background-color: #FFF;
           box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.03);
+          width: 100%;
           @media only screen and (max-width: 767px) {
             max-width: 100%;
             width: 100%;
@@ -222,7 +221,7 @@
         background: #03A973 !important;
         border: 1px solid #03A973 !important;
         max-width: 100%;
-        width: 92%;
+        width: 97%;
         height: 40px;
         border-radius: 4px;
         -webkit-border-radius: 2px;
@@ -321,4 +320,18 @@
   .text_end{
     text-align: end!important;
   }
+}
+.footer-cta{
+  background-color: #EFEFEF;
+  padding: 2rem 6rem;
+  .cta-heading{
+    flex: 0 0 70%;
+    font-size: 24px !important;
+    line-height: 38px !important;
+    margin: 0 !important;
+  }
+  .cta-link{
+    font-weight: 600;
+    font-size: 18px;
+  }
 }
diff --git a/src/components/LeftNav.scss b/src/components/LeftNav.scss
@@ -9,7 +9,7 @@
   //height: 100%;
   position: sticky;
   height: 100vh;
-  top: 0px;
+  top: 4.5rem;
   font-size: 14px;
   overflow: scroll;
   font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica, Arial, sans-serif;

diff --git a/src/components/header.jsx b/src/components/header.jsx
diff --git a/src/components/navcards.jsx b/src/components/navcards.jsx
@@ -50,7 +50,7 @@ const data = [
 
 const Card = ({ title, description, path }) => {
     return (
-        <a href={path} className="card md:w-5/12 p-7 cursor-pointer justify-between flex mr-2 mb-2 w-full ">
+        <a href={path} className="card md:w-5/12 p-7 cursor-pointer justify-between flex w-full ">
             <div className="w-fit">
                 <span className="card_heading">{title}</span><br/>
                 <span className="card_desc">{description}</span>
@@ -68,7 +68,7 @@ const Card = ({ title, description, path }) => {
 
 const CardList = () => {
     return (
-        <div className="w-full flex flex-wrap">
+        <div className="w-full flex flex-wrap gap-2">
             {data.map((item) => (
                 <Card key={item.id} title={item.title} description={item.description} path={item.path}/>
             ))}

diff --git a/src/pages/tutorials/index.jsx b/src/pages/tutorials/index.jsx
diff --git a/src/templates/page.jsx b/src/templates/page.jsx
diff --git a/src/templates/page.scss b/src/templates/page.scss
@@ -20,7 +20,12 @@ body{
   height: 100%;
 }
 
-#root_header > div {
+#root_header{
+  position: sticky;
+  top: 0;
+  z-index: 99;
+  background-color: #fff;
+ > div {
   @media (max-width: 576px) {
     // position: relative;
     // z-index: 10;
@@ -68,6 +73,7 @@ body{
     }
   }
 }
+}
 
 .doc-page {
 
@@ -561,7 +567,7 @@ code[class*="language-"] {
 .homepage_footer{
   flex-basis: 100%;
   justify-content: space-between;
-  margin-bottom: 4rem;
+  margin: 2rem 0 4rem;
   .pagination_buttons{
     @media (min-width: $screen_768) {
       margin: 0;
@@ -586,4 +592,24 @@ code[class*="language-"] {
     background-size: cover;
     background-position: center;
   }
+}
+.float-cta{
+  @apply px-4 py-8 flex justify-center flex-col;
+  background-color: #EFEFEF;
+  width: 95%;
+  margin: 3rem 0 0;
+  .cta-title{
+    margin: 0 !important;
+    font-size: 24px !important;
+    line-height: 36px !important;
+    text-align: center;
+  }
+  .signup-btn{
+    margin: 1rem 0 0;
+    @apply flex justify-center;
+  }
+}
+
+.fixed{
+  display: none;
 }