lil preview

datahub-project · Jul 30, 2024 · 48b5965 · 48b5965
1 parent 85efbcc
commit 48b5965
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 7 deletions.
diff --git a/docs-website/src/pages/cloud/Enterprise/index.js b/docs-website/src/pages/cloud/Enterprise/index.js
@@ -10,19 +10,19 @@ const featuresContent = [
     description: "We’ll focus on keeping DataHub running, so you can focus on the things that really matter."
   },
   {
-    title: "In-VPC Ingestion & Check execution",
+    title: "In-VPC Ingestion and<br/>Data Quality evaluation",
     description: "So your actual data never leaves your network."
   },
   {
-    title: "SOC-2 Compliance",
+    title: "SOC-2 Compliant",
     description: "An incredibly high level of security you can trust."
   },
 ];
 
 const Feature = ({ title, description }) => {
   return (
     <div className={clsx(styles.feature, "col col--4")}>
-      <h2>{title}</h2>
+      <h2 dangerouslySetInnerHTML={{ __html: title }}></h2>
       <p>{description}</p>
     </div>
   );

diff --git a/docs-website/src/pages/cloud/UnifiedTabs/index.js b/docs-website/src/pages/cloud/UnifiedTabs/index.js
@@ -12,7 +12,7 @@ const TabbedComponent = () => {
       description: 'All the search and discovery features of DataHub Core you already love, enhanced.',
       icon: "/img/assets/data-discovery.svg",
       link: "https://www.acryldata.io/acryl-datahub",
-      image: '/path/to/image1.png',
+      image: 'https://cdn.sanity.io/files/cqo9wkgf/production/4e97a9b91534b4b81080a62e05747a76cfd6f598.webm',
     },
     {
       title: 'Data Observability',
@@ -26,7 +26,7 @@ const TabbedComponent = () => {
       description: 'Powerful Automations, Reporting and Organizational tools to help you govern effectively.',
       icon: "/img/assets/data-governance.svg",
       link: "https://www.acryldata.io/acryl-datahub#governance",
-      image: '/path/to/image3.png',
+      image: 'https://cdn.sanity.io/images/cqo9wkgf/production/a99fe9d9bd6f8feb019bf7badc12948e2fd7319e-1878x1056.png?w=3840&q=75&fit=clip&auto=format',
     },
   ];
 
@@ -55,14 +55,18 @@ const TabbedComponent = () => {
               </div>
               {activeTab === index && (
                 <div className={clsx(styles.imageContainer, styles.mobileImageContainer)}>
-                  <div style={{ backgroundImage: `url(${tabs[activeTab].image})` }} alt={tabs[activeTab].title} className={clsx(styles.tabImage)} />
+                  <div className={clsx(styles.tabImage)}>
+                    <video src={tabs[activeTab].image} controls={false} autoPlay muted loop />
+                  </div>
                 </div>
               )}
             </React.Fragment>
           ))}
         </div>
         <div className={clsx(styles.imageContainer, styles.webImageContainer)}>
-          <div style={{ backgroundImage: `url(${tabs[activeTab].image})` }} alt={tabs[activeTab].title} className={clsx(styles.tabImage)} />
+          <div className={clsx(styles.tabImage)}>
+            <video src={tabs[activeTab].image} controls={false} autoPlay muted loop />
+          </div>
         </div>
       </div>
     </div>

diff --git a/docs-website/src/pages/cloud/UnifiedTabs/styles.module.scss b/docs-website/src/pages/cloud/UnifiedTabs/styles.module.scss
@@ -135,6 +135,12 @@
   width: 100%;
   height: 100%;
   display: block;
+  padding: 4px;
+}
+.tabImage video {
+  height: 100%;
+  width: 100%;
+  border-radius: 22px;
 }
 
 .mobileImageContainer {