Merge pull request #1171 from Ishavyas9/main

storylane demo added

Author: Ishavyas9

docs/smartui-pdf-comparison.md

@@ -54,6 +54,23 @@ This functionality is exclusive to our enterprise plan subscribers on SmartUI. F
 
 In the following section, we will walk you through the process of conducting your first Visual Regression test using LambdaTest's SmartUI platform.
 
+<div className="ytframe"> 
+<div className="youtube" data-embed="H91z4j5_JvQ">
+    <div className="play-button"></div>
+</div>
+</div>
+
+## Getting Started with PDF Comparison
+
+
+
+<div className="storylane-iframe">
+  <script async src="https://js.storylane.io/js/v2/storylane.js"></script>
+  <div className="sl-embed">
+    <iframe loading="lazy" className="sl-demo" src="https://app.storylane.io/demo/czorj4fbzohf?embed=inline" name="sl-embed" allow="fullscreen" allowfullscreen></iframe>
+  </div>
+</div>
+
 ## Step 1: Establishing a SmartUI Project
 
 To initiate a SmartUI PDF Comparison Project, adhere to the following instructions:

src/css/custom.css

@@ -1878,4 +1878,6 @@ h6[id]::before {
 
 
 .support_container{display: flex;gap:100px}
-.docusaurus-theme-github-codeblock .theme-code-block{max-height: 500px;overflow: auto;}
+.docusaurus-theme-github-codeblock .theme-code-block{max-height: 500px;overflow: auto;}
+.storylane-iframe{position:relative;padding-bottom:calc(45.26% + 25px);width:100%;height:0;transform:scale(1)}
+.storylane-iframe .sl-demo{position:absolute;top:0;left:0;width:100%!important;height:100%!important;border:1px solid rgba(63,95,172,0.35);box-shadow: 0px 0px 18px rgba(26, 19, 72, 0.15);border-radius:10px;box-sizing:border-box;}