chore: ui and versional changes

Signed-off-by: Atishay Tripathi <atishay1922@gmail.com>

Author: atishaytripathi

docusaurus.config.js

@@ -1,8 +1,7 @@
-//@ts-check
+// @ts-nocheck
 
-import {themes as prismThemes} from "prism-react-renderer";
-const path = require("path");
-import {visit} from "unist-util-visit";
+const { themes: prismThemes } = require("prism-react-renderer");
+const visit = require("unist-util-visit");
 const FontPreloadPlugin = require("webpack-font-preload-plugin");
 
 /** @type {import('@docusaurus/types').DocusaurusConfig} */
@@ -50,7 +49,7 @@ module.exports = {
         content:
           "API testing, Keploy docs, incident replay, network calls, code paths, test scenarios, code coverage, stubs, junit, go-test, live environment, production incidents, open source, regression tests, ai tests",
       },
-      {name: "twitter:card", content: "summary_large_image"},
+      { name: "twitter:card", content: "summary_large_image" },
     ],
     headTags: [
       // Preconnect tag
@@ -259,7 +258,7 @@ module.exports = {
            * in `/docs/next` directory, only versioned docs.
            */
           // excludeNextVersionDocs: false,
-          lastVersion: "4.0.0",
+          lastVersion: "3.0.0",
           versions: {
             "1.0.0": {
               label: "1.0.0",
@@ -271,13 +270,8 @@ module.exports = {
               path: "2.0.0",
               banner: "unmaintained",
             },
-            "3.0.0": {
-              label: "3.0.0",
-              path: "3.0.0",
-              banner: "unmaintained",
-            },
           },
-          onlyIncludeVersions: ["1.0.0", "2.0.0", "3.0.0", "4.0.0"],
+          onlyIncludeVersions: ["1.0.0", "2.0.0", "3.0.0"],
           includeCurrentVersion: true, // excludeNextVersionDocs is now deprecated
           // // below remark plugin disabled until we can figure out why it is not transpiling to ESNext properly - swyx
           remarkPlugins: [
@@ -343,11 +337,12 @@ module.exports = {
         theme: {
           customCss: require.resolve("./src/css/custom.css"),
         },
-        gtag: {
-          trackingID: "G-LLS95VWZPC",
-          // Optional fields.
-          anonymizeIP: true, // Should IPs be anonymized?
-        },
+        // Temporarily disabled gtag due to "window.gtag is not a function" error
+        // gtag: {
+        //   trackingID: "G-LLS95VWZPC",
+        //   // Optional fields.
+        //   anonymizeIP: true, // Should IPs be anonymized?
+        // },
         // Will be passed to @docusaurus/plugin-content-sitemap
         sitemap: {
           // Per v2.0.0-alpha.72 cacheTime is now deprecated

package.json

@@ -38,6 +38,7 @@
     "react-player": "^2.6.0",
     "remark-typescript-tools": "1.0.9",
     "typescript": "5",
+    "unist-util-visit": "^2.0.3",
     "uuid": "^8.3.2",
     "webpack-font-preload-plugin": "^1.5.0"
   },

sidebars.js

@@ -0,0 +1,33 @@
+/**
+ * Creating a sidebar enables you to:
+ - create an ordered group of docs
+ - render a sidebar for each doc of that group
+ - provide next/previous navigation
+
+ The sidebars can be generated from the filesystem, or explicitly defined here.
+
+ Create as many sidebars as you want.
+ */
+
+// @ts-check
+
+/** @type {import('@docusaurus/plugin-content-docs').SidebarsConfig} */
+const sidebars = {
+  // By default, Docusaurus generates a sidebar from the docs folder structure
+  // tutorialSidebar: [{type: 'autogenerated', dirName: '.'}],
+
+  // But you can create a sidebar manually
+  /*
+  tutorialSidebar: [
+    'intro',
+    'hello',
+    {
+      type: 'category',
+      label: 'Tutorial',
+      items: ['tutorial-basics/create-a-document'],
+    },
+  ],
+   */
+};
+
+module.exports = sidebars;

src/css/custom.css

@@ -2721,3 +2721,208 @@ html[data-theme="dark"] div[class^="sidebar_"] > nav > ul > li > .menu__list-ite
     line-height: 1.4;
   }
 }
+
+/* ===== CONSISTENT SPACING FOR DOCUMENTATION PAGES ===== */
+/* Fix inconsistent vertical spacing in documentation content */
+article header + * {
+  margin-top: 2rem !important; /* Consistent space after page title */
+}
+
+article h1 {
+  margin-bottom: 1.5rem !important; /* Consistent space after H1 */
+}
+
+article h2 {
+  margin-top: 2.5rem !important; /* Consistent space before H2 */
+  margin-bottom: 1rem !important; /* Consistent space after H2 */
+}
+
+article h3 {
+  margin-top: 2rem !important; /* Consistent space before H3 */
+  margin-bottom: 0.75rem !important; /* Consistent space after H3 */
+}
+
+article p {
+  margin-bottom: 1rem !important; /* Consistent space after paragraphs */
+}
+
+article img {
+  margin-top: 1.5rem !important; /* Consistent space before images */
+  margin-bottom: 1.5rem !important; /* Consistent space after images */
+}
+
+article \u003e div[style*='backgroundColor'] {
+  margin-top: 1.5rem !important; /* Consistent space before styled divs */
+  margin-bottom: 1.5rem !important; /* Consistent space after styled divs */
+}
+
+
+/* Override Tailwind prose spacing for better consistency */
+.prose.md\\:prose-md {
+  margin-top: 1.5rem !important;
+  margin-bottom: 1.5rem !important;
+}
+
+/* More specific overrides for prose elements */
+.prose p {
+  margin-top: 1rem !important;
+  margin-bottom: 1rem !important;
+}
+
+.prose h1 {
+  margin-top: 0 !important;
+  margin-bottom: 1.5rem !important;
+}
+
+.prose h2 {
+  margin-top: 2rem !important;
+  margin-bottom: 1rem !important;
+}
+
+.prose h3 {
+  margin-top: 1.5rem !important;
+  margin-bottom: 0.75rem !important;
+}
+
+.prose img {
+  margin-top: 1.5rem !important;
+  margin-bottom: 1.5rem !important;
+}
+
+/* Fix the large top margin on first element after header */
+.markdown \u003e *:first-child,
+article \u003e .markdown \u003e *:first-child {
+  margin-top: 1.5rem !important;
+}
+
+
+/* Fix clipped descenders in headings (y, g, p, q, j) */
+article h1,
+.prose h1 {
+  line-height: 1.3 !important; /* Increase line-height to prevent clipping */
+  padding-bottom: 0.2rem !important; /* Add padding to ensure descenders are visible */
+  overflow: visible !important; /* Ensure text isn't clipped */
+}
+
+article h2,
+.prose h2 {
+  line-height: 1.4 !important;
+  padding-bottom: 0.15rem !important;
+  overflow: visible !important;
+}
+
+article h3,
+.prose h3 {
+  line-height: 1.4 !important;
+  padding-bottom: 0.1rem !important;
+  overflow: visible !important;
+}
+
+
+/* Reduce excessive spacing - fine-tuned values */
+article h1,
+.prose h1 {
+  margin-bottom: 1rem !important; /* Reduced from 1.5rem */
+}
+
+/* Reduce top margin on first paragraph after title */
+article h1 + p,
+.prose h1 + p {
+  margin-top: 1rem !important; /* Consistent spacing after H1 */
+}
+
+/* Adjust H2 spacing to be less aggressive */
+article h2,
+.prose h2 {
+  margin-top: 1.75rem !important; /* Reduced from 2rem */
+  margin-bottom: 0.75rem !important; /* Reduced from 1rem */
+}
+
+/* Adjust paragraph spacing */
+article p,
+.prose p {
+  margin-top: 0.75rem !important; /* Reduced */
+  margin-bottom: 0.75rem !important; /* Reduced */
+}
+
+/* Adjust image spacing */
+article img,
+.prose img {
+  margin-top: 1.25rem !important; /* Reduced from 1.5rem */
+  margin-bottom: 1.25rem !important; /* Reduced from 1.5rem */
+}
+
+
+/* Reduce top padding/margin above page title across all docs pages */
+article,
+.markdown,
+[class*='docItemContainer'] article {
+  padding-top: 1rem !important; /* Reduced top padding */
+}
+
+/* Reduce margin-top on the H1 title itself */
+article h1:first-of-type,
+.prose h1:first-of-type,
+.markdown h1:first-of-type {
+  margin-top: 0.5rem !important; /* Minimal top margin for first H1 */
+}
+
+/* Remove excessive top margin from article header */
+article header {
+  margin-top: 0 !important;
+  padding-top: 0 !important;
+}
+
+/* Reduce top margin on first element after breadcrumbs */
+.theme-doc-breadcrumbs + * {
+  margin-top: 1rem !important;
+}
+
+
+/* OVERRIDE: Reduce top margin/padding on markdown container - more specific selectors */
+div.theme-doc-markdown.markdown,
+.theme-doc-markdown,
+[class*='theme-doc-markdown'] {
+  margin-top: 0 !important;
+  padding-top: 0.5rem !important; /* Minimal top padding */
+}
+
+/* Target the prose container specifically */
+.prose.md\\:prose-md.prose-auto.my-12 {
+  margin-top: 1rem !important; /* Override my-12 class */
+  margin-bottom: 1rem !important;
+}
+
+/* Remove large top margin from article/main content */
+main article,
+[class*='docItemContainer'] {
+  margin-top: 0 !important;
+  padding-top: 0.5rem !important;
+}
+
+
+/* EQUAL SPACING: Make top and bottom spacing around H1 consistent */
+/* This creates better visual balance for documentation pages */
+
+/* Set consistent spacing after breadcrumbs */
+nav.theme-doc-breadcrumbs {
+  margin-bottom: 1.5rem !important; /* Equal to H1 bottom margin */
+}
+
+/* Ensure H1 has equal spacing on both sides */
+article h1:first-of-type,
+.prose h1:first-of-type {
+  margin-top: 0 !important; /* No extra top margin */
+  margin-bottom: 1.5rem !important; /* Match breadcrumb spacing */
+}
+
+/* Remove any extra padding from containers */
+.theme-doc-markdown.markdown {
+  padding-top: 0 !important;
+}
+
+/* Table header vertical alignment - align headers to top of cells */
+table th {
+  vertical-align: top !important;
+}
+

versioned_docs/version-2.0.0/ci-cd/github.md

@@ -14,6 +14,10 @@ tags:
   - plugin
 ---
 
+import ProductTier from '@site/src/components/ProductTier';
+
+<ProductTier tiers="Open Source, Enterprise" offerings="Self-Hosted, Dedicated" />
+
 Keploy can be integrated with GitHub by two methods:-
 
 1. [Using Shell Scripts](#shell-scripts)
@@ -34,10 +38,6 @@ GitHub scripts are the easiest way to integrate Keploy with GitHub. We will be u
   ...
 ```
 
-> **Note: if you are using `arm_64` as runner use below to download keploy binary**
-
-`curl --silent --location "https://github.com/keploy/keploy/releases/latest/download/keploy_linux_arm64.tar.gz" | tar xz --overwrite -C /tmp`
-
 ### Example with Scripts
 
 While using [express-mongoose](https://github.com/keploy/samples-typescript/tree/main/express-mongoose) sample-application with keploy test in GitHub CI, the workflow would like:-

versioned_docs/version-2.0.0/ci-cd/gitlab.md

@@ -14,6 +14,10 @@ tags:
   - plugin
 ---
 
+import ProductTier from '@site/src/components/ProductTier';
+
+<ProductTier tiers="Open Source, Enterprise" offerings="Self-Hosted, Dedicated" />
+
 Keploy can integrated with GitLab CI to streamline your testing process and ensure continuous testing as part of your CI/CD pipeline.
 
 ## Create pipeline
@@ -41,10 +45,6 @@ keploy-test-job: # This job runs in the test stage.
     ...
 ```
 
-> **Note: if you are using `arm_64` as runner use below to download keploy binary**
-
-`curl --silent --location "https://github.com/keploy/keploy/releases/latest/download/keploy_linux_arm64.tar.gz" | tar xz --overwrite -C /tmp`
-
 Now that we have Keploy installed, and all ready, we need switch to path where `keploy` folder is present in our application and install all the application related dependencies. Since we are using [flask-mongo](https://github.com/keploy/samples-python) sample-application, steps in our `script:` would look like below:-
 
 ```yaml
@@ -66,17 +66,15 @@ In your `.gitlab-ci.yml file`, in last step we have `keploy test` command to run
 
 ### 📝 Note
 
-Did you notice some weird stuff in the pipeline? Like `kmod`, `linux-headers`, `/sys/kernel/debug`...and thought, _"Wait, am I hacking the kernel or something?"_ 😅
+Did you notice some weird stuff in the pipeline? Like `kmod`, `linux-headers`, `/sys/kernel/debug`
 
 Don’t worry — these are just there because **Keploy uses eBPF** (a cool Linux feature) to trace your app’s behavior.
 
 So we install `kmod`, `linux-headers-generic`, and `bpfcc-tools` to make that tracing possible.
 
-Some CI systems don’t have `/sys/kernel/debug` and `/sys/kernel/tracing` by default, so we create them and mount `debugfs` and `tracefs` — it’s like giving Keploy the **backstage pass** it needs to watch your app in action.
-
-No black magic. Just some low-level Linux stuff helping your tests run like magic! 🪄✨
+Some CI systems don’t have `/sys/kernel/debug` and `/sys/kernel/tracing` by default, so we create them and mount `debugfs` and `tracefs`
 
-We will get to see output : -
+We would output something like below:-
 
 ```sh
 $ keploy test -c "python3 app.py"  --delay 50