Merge branch 'main' into microservice-error-guessing-glossary-terms

Signed-off-by: Abhishek kushwaha <[email protected]>

Author: Abbhiishek

.github/ISSUE_TEMPLATE/documentation-request.md

@@ -1,10 +1,8 @@
 ---
 name: Documentation request
 about: Use this to propose information improvements and additions
-title: "[ Documentation request ] "
-labels: ''
-assignees: ''
-
+title: "[Docs]"
+labels: '[Documentation]'
 ---
 
 # Brief description

.github/pull_request_template.md

@@ -1,10 +1,8 @@
-# Pull Request Template
+## What has changed?
 
-## Description
+Please include a summary of the change.
 
-Please include a summary of the change. Please also include relevant motivation and context. List any dependencies that are required for this change.
-
-Fixes # (issue)
+This PR Resolves #(issue)
 
 ## Type of change
 
@@ -13,22 +11,16 @@ Please delete options that are not relevant.
 - [ ] Bug fix (non-breaking change which fixes an issue).
 - [ ] New feature (non-breaking change which adds functionality).
 - [ ] Breaking change (fix or feature that would cause existing functionality to not work as expected).
-- [ ] This change requires a documentation update.
+- [ ] Documentation update (if none of the other choices apply).
 
 ## How Has This Been Tested?
 
-Please describe the tests that you ran to verify your changes. Provide instructions so we can reproduce. Please also list any relevant details for your test configuration
-
-## Additional Context (Please include any Screenshots/gifs if relevant)
+Please run npm run build and npm run serve to check if the changes are working as expected. Please include screenshots of the output of both the commands. Add screenshots/gif of the changes if possible.
 
-...
 
 ## Checklist:
 
 - [ ] My code follows the style guidelines of this project.
 - [ ] I have performed a self-review of my own code.
-- [ ] I have made corresponding changes to the documentation.
-- [ ] I have added corresponding tests.
-- [ ] Any dependent changes have been merged and published in downstream modules.
 
-<!--- Thanks for opening this pull request! If the tests fail, please feel free to reach out to us by leaving a comment down below and we will be happy to take a look --->
+<!--- Thanks for opening this pull request! If the tests fail, please feel free to reach out to us by leaving a comment down below and we will be happy to take a look --->

.github/workflows/build_and_check.yml

@@ -20,11 +20,8 @@ jobs:
         with:
           node-version: 18.0.0
 
-      - name: Install Yarn
-        run: npm install -g yarn
-
       - name: Install Dependencies
-        run: yarn install
+        run: npm install
 
       - name: Build Documentation
-        run: yarn build
+        run: npm run build

.github/workflows/lint.yml

@@ -15,6 +15,14 @@ jobs:
         with:
           fetch-depth: 0
 
+      - name: Set up Node.js
+        uses: actions/setup-node@v2
+        with:
+          node-version: '18.0.0'
+
+      - name: Install Dependencies
+        run: npm install
+
       - name: Check commits messages
         uses: wagoid/commitlint-github-action@v5
         env:

.github/workflows/main.yml

@@ -23,10 +23,10 @@ jobs:
       # Checks-out your repository under $GITHUB_WORKSPACE, so your job can access it
       - uses: actions/checkout@v2
 
-      - name: Set Node.js 18.x
+      - name: Set Node.js 22.x
         uses: actions/setup-node@v3
         with:
-          node-version: 18.x
+          node-version: 22.x
 
       - uses: borales/actions-yarn@v4
         with:

README.md

@@ -64,12 +64,13 @@ The Keploy documentation site uses [Docusaurus 2](https://v2.docusaurus.io/), wh
 You can make changes locally without previewing them in the browser.
 However, if you want to build the site and preview changes in the browser, you need to have [Docusaurus 2 dependencies](https://v2.docusaurus.io/docs/installation/#requirements) installed.
 
-Initialize Docusaurus 2 in the repo by running [`yarn`](https://classic.yarnpkg.com/en/docs/cli/) once in the root directory of the repo.
+Initialize Docusaurus 2 in the repo by running [`npm`](https://docs.npmjs.com/cli/v7/commands/npm-install) once in the root directory of the repo.
 
 Now you can build and view the site locally:
 
 ```bash
-yarn start
+npm install
+npm start
 ```
 
 The command starts a local development server and opens a browser window.
@@ -95,17 +96,17 @@ cd docs
 3. Install all the dependencies
 
 ```sh
-yarn install
+npm install
 
 ## Start the development server.
 
-yarn start
+npm start
 ```
 
 4. To reformat:
 
 ```sh
-yarn prettier --write '**/*.{js,md}'
+npm prettier --write '**/*.{js,md}'
 ```
 
 5. Check the build status:

package.json

@@ -5,6 +5,7 @@
   "scripts": {
     "docusaurus": "docusaurus",
     "start": "docusaurus start",
+    "clean": "rimraf build",
     "build": "docusaurus build",
     "swizzle": "docusaurus swizzle",
     "deploy": "docusaurus deploy",
@@ -25,10 +26,10 @@
     "@mdx-js/react": "^3.0.0",
     "clsx": "^2.0.0",
     "lint": "^0.8.19",
+    "prism-react-renderer": "^2.1.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-player": "^2.6.0",
-    "prism-react-renderer": "^2.1.0",
     "remark-typescript-tools": "1.0.9",
     "typescript": "5",
     "uuid": "^8.3.2",
@@ -61,9 +62,10 @@
     "postcss-preset-env": "^7.4.1",
     "prettier": "^2.5.1",
     "prettier-plugin-tailwindcss": "^0.1.4",
+    "rimraf": "^6.0.1",
     "tailwindcss": "^3.0.1"
   },
   "engines": {
-    "node":">=18.0"
+    "node": ">=18.0"
   }
 }

src/components/Intro.js

@@ -4,7 +4,7 @@ import useBaseUrl from "@docusaurus/useBaseUrl";
 
 function Languages() {
   return (
-    <div className="rounded-lg bg-[color:var(--ifm-card-background-color)] p-5 shadow">
+    <div className="rounded-lg bg-[color:var(--ifm-card-background-color)] p-5 shadow transition hover:shadow-lg hover:shadow-[color:var(--ifm-card-shadow-color)]">
       <div className="flex items-center space-x-4">
         <svg
           width="16"
@@ -116,7 +116,7 @@ function Languages() {
 
 function Frameworks() {
   return (
-    <div className="flex flex-col rounded-lg bg-[color:var(--ifm-card-background-color)] p-5 shadow">
+    <div className="flex flex-col rounded-lg bg-[color:var(--ifm-card-background-color)] p-5 shadow transition hover:shadow-lg hover:shadow-[color:var(--ifm-card-shadow-color)]">
       <div className="flex items-center space-x-4">
         <svg
           className="mb-4 h-10 w-10 rounded-lg bg-[color:var(--ifm-color)] p-2 text-[color:var(--ifm-background-color)]"
@@ -176,7 +176,10 @@ function Frameworks() {
           </Link>
         </li>
         <li className="mt-5 flex flex-col space-y-3 text-lg">
-          <Link className="flex flex-col items-center justify-center space-y-1 p-6 text-center ">
+          <Link
+            to={useBaseUrl("/dependencies/redis")}
+            className="flex flex-col items-center justify-center space-y-1 p-6 text-center "
+          >
             <img
               className="h-8 w-8"
               src="/docs/img/redis-logo.svg"

src/css/custom.css

@@ -12,11 +12,11 @@
 
 :root {
   --ifm-color-primary: #ff914d;
-  --ifm-color-primary-dark: #E67643;
-  --ifm-color-primary-darker: #C95919;
+  --ifm-color-primary-dark: #e67643;
+  --ifm-color-primary-darker: #c95919;
   --ifm-color-primary-darkest: #be2c1b;
-  --ifm-color-primary-light: #FFD0A0;
-  --ifm-color-primary-lighter: #FFB575;
+  --ifm-color-primary-light: #ffd0a0;
+  --ifm-color-primary-lighter: #ffb575;
   --ifm-color-primary-lightest: #ffceb1;
   --ifm-code-font-size: 95%;
   --doc-sidebar-width: 275px !important;
@@ -28,11 +28,11 @@
 
 html[data-theme="dark"] {
   --ifm-color-primary: #ff914d;
-  --ifm-color-primary-dark: #E67643;
-  --ifm-color-primary-darker: #C95919;
+  --ifm-color-primary-dark: #e67643;
+  --ifm-color-primary-darker: #c95919;
   --ifm-color-primary-darkest: #be2c1b;
-  --ifm-color-primary-light: #FFD0A0;
-  --ifm-color-primary-lighter: #FFB575;
+  --ifm-color-primary-light: #ffd0a0;
+  --ifm-color-primary-lighter: #ffb575;
   --ifm-color-primary-lightest: #ffceb1;
   --ifm-link-color: var(--ifm-color-primary-lighter);
   --ifm-menu-color-active: var(--ifm-color-primary-lighter);
@@ -45,42 +45,44 @@ html[data-theme="dark"] {
   --ifm-footer-background-color: #000;
   --ifm-card-background-color: #1a1a1a;
   --collapse-button-bg-color-dark: transparent;
-  --ifm-badge-background-color: #F88E34;
+  --ifm-badge-background-color: #f88e34;
   --card-color: rgba(17, 24, 39);
+  --ifm-card-shadow-color: rgba(255, 255, 255, 0.2);
 }
 
 html[data-theme="light"] {
   --ifm-blockquote-color: #000000;
   --ifm-color-emphasis-300: #505050;
   /* --ifm-code-background: var(--ifm-color-primary-lightest); */
   --ifm-color-input-background: #ffffff;
-  --ifm-color: #00163D;
+  --ifm-color: #00163d;
   --ifm-background-color: rgb(249, 250, 251);
   --ifm-footer-background-color: #ffffff;
   --ifm-card-background-color: #ffffff;
   --ifm-badge-background-color: rgba(239, 246, 255);
 
   --card-color: rgba(239, 246, 255);
+  --ifm-card-shadow-color: rgba(0, 0, 0, 0.2); /* Dark shadow for light theme */
 }
 
 @font-face {
-  font-family: 'Roboto';
+  font-family: "Roboto";
   src: url("../fonts/Roboto-Light.woff2");
   font-weight: 400;
   font-style: normal;
   font-display: swap;
 }
 
 @font-face {
-  font-family: 'Roboto';
+  font-family: "Roboto";
   src: url("../fonts/Roboto-Bold.woff2");
   font-weight: 700;
   font-style: normal;
   font-display: swap;
 }
 
 @font-face {
-  font-family: 'Roboto';
+  font-family: "Roboto";
   src: url("../fonts/Roboto-Light.woff2");
   font-weight: 300;
   font-style: normal;
@@ -193,7 +195,7 @@ div[class^="sidebar_"] .button svg {
 
 /* Pagination */
 .pagination-nav {
-  @apply flex flex-col items-start justify-center space-y-5 space-x-0 md:flex-row md:space-y-0 md:space-x-10;
+  @apply flex flex-col items-start justify-center space-x-0 space-y-5 md:flex-row md:space-x-10 md:space-y-0;
 }
 .pagination-nav__item {
   @apply w-full max-w-md;
@@ -204,7 +206,7 @@ div[class^="sidebar_"] .button svg {
 
 /* Navbar */
 .navbar__inner {
-  @apply mx-auto max-w-screen-lg lg:px-10 shadow-none;
+  @apply mx-auto max-w-screen-lg shadow-none lg:px-10;
 }
 
 .navbar__items--right {
@@ -230,7 +232,7 @@ div[class^="sidebar_"] .button svg {
 }
 
 /* Footer */
-footer  {
+footer {
   margin-top: 4%;
 }
 
@@ -253,7 +255,6 @@ footer svg {
 
   .DocSearch-Button {
     @apply mr-[-18px] !important;
-  
   }
 
   /* .footer .footer__block {
@@ -408,8 +409,6 @@ footer svg {
   .docs-centered-image-size-25 {
     max-width: 25%;
   }
-
-  
 }
 
 .docs-image-legend-wrapper {
@@ -501,7 +500,9 @@ footer svg {
 [data-theme="light"] .prose :where(pre code):not(.not-prose) {
   background-color: #ffffff;
 }
-[data-theme="light"] .prose :where(pre):not(:where([class~=not-prose],[class~=not-prose] *)) {
+[data-theme="light"]
+  .prose
+  :where(pre):not(:where([class~="not-prose"], [class~="not-prose"] *)) {
   background-color: #ffffff;
 }
 
@@ -545,11 +546,11 @@ div[class^="announcementBar_"] {
 }
 
 /*Correcting alignment of home icon in navbar breadcrumbs.*/
-a[class="breadcrumbs__link"]{
+a[class="breadcrumbs__link"] {
   padding-top: 2px;
   margin-bottom: -10px;
 }
 
 [data-theme="dark"] th {
   color: white;
-}
+}

src/pages/concepts/reference/glossary.js

@@ -161,12 +161,13 @@ function Glossary() {
           {new Array(26).fill(0).map((x, i) => (
             <button
               className={`col-span-1  gap-2 rounded-sm p-3
-                    ${state[String.fromCharCode(65 + i)]
-                  ? "text-black-200 rounded-3xl bg-orange-200 font-bold shadow-md hover:text-orange-950"
-                  : entries[String.fromCharCode(65 + i)] === undefined
-                    ? "bg-transparent text-gray-400" // Modified color class
-                    : "bg-grey-200 rounded-3xl shadow-md"
-                } `}
+                    ${
+                      state[String.fromCharCode(65 + i)]
+                        ? "text-black-200 rounded-3xl bg-orange-200 font-bold shadow-md hover:text-orange-950 dark:text-orange-900"
+                        : entries[String.fromCharCode(65 + i)] === undefined
+                        ? "bg-transparent text-gray-400" // Modified color class
+                        : "bg-grey-200 rounded-3xl shadow-md"
+                    } `}
               key={i}
               disabled={
                 entries[String.fromCharCode(65 + i)] === undefined
@@ -182,13 +183,13 @@ function Glossary() {
         <div className="-mb-3 mt-10 flex flex-wrap justify-center gap-4 text-xl font-semibold">
           {Object.entries(state).map(([key, value]) => {
             return (
-              <div key={key} className="col-span-3 mb-4 w-1/4">
+              <div key={key} className="mb-4 w-1/4">
                 <div key={key}>{value ? key : ""}</div>
                 {value ? (
-                  <div className="text-l flex grid justify-around">
-                    {entries[key]?.map(({ name, link }, i) => (
+                  <div className="ml-4 flex flex-col justify-around text-xl">
+                    {entries[key]?.map(({name, link}, i) => (
                       <a
-                        className="text-orange-600 hover:text-orange-950 hover:underline"
+                        className="text-orange-600 hover:text-orange-800 hover:underline"
                         key={i}
                         href={link}
                       >