diff --git a/content-learn/mastering-meshery/introduction-to-meshery/meshery/creating-designs.mdx b/content-learn/mastering-meshery/introduction-to-meshery/meshery/creating-designs.mdx index 23a8751ea0ec2..f91169f2e7b1a 100644 --- a/content-learn/mastering-meshery/introduction-to-meshery/meshery/creating-designs.mdx +++ b/content-learn/mastering-meshery/introduction-to-meshery/meshery/creating-designs.mdx @@ -19,7 +19,7 @@ import importDesignImage from "../../../../src/assets/images/learning-path/creat import configuringImportedDesignImage from "../../../../src/assets/images/learning-path/creating-designs/configuring-imported-design.png"; import mesheryHelmChartImage from "../../../../src/assets/images/learning-path/creating-designs/meshery-helm-chart.png"; import cloneDesignImage from "../../../../src/assets/images/learning-path/creating-designs/clone-design.png"; -import listOfDesignsImage from "../../../../src/assets/images/learning-path/creating-designs/list-of-designs.png"; +import renderedDesign from "../../../../src/assets/images/learning-path/creating-designs/rendered-design.png"; import catalogImage from "../../../../src/assets/images/learning-path/creating-designs/catalog.png"; import openInPlaygroundImage from "../../../../src/assets/images/learning-path/creating-designs/open-in-playground.png"; import { ChapterStyle } from "../../../../src/components/Learn-Components/Chapters-Style/chapters.style.js"; @@ -117,15 +117,13 @@ When working with Kanvas, you can effortlessly integrate various design files to 2. Enter a name for the design in the **Design File Name** field. -3. Choose the appropriate **Design Type** for the file you want to import (Helm Chart, Kubernetes, Manifest, etc). - -4. Select your preferred import method: either **URL** or **File Upload**. +3. Select your preferred import method: either **URL** or **File Upload**. -5. **Example:** Use the Meshery Server Helm chart at [Meshery Helm Chart](https://meshery.github.io/meshery.io/charts/meshery-v0.7.48.tgz). +4. **Example:** Use the Meshery Server Helm chart at [Meshery Helm Chart](https://meshery.github.io/meshery.io/charts/meshery-v0.7.48.tgz). @@ -139,7 +137,7 @@ When working with Kanvas, you can effortlessly integrate various design files to 1. Switch to Kanvas Designer mode, if not already in it. -2. In the left navigation panel, click the **“Catalog”** menu tab. +2. From the canvas, click the **“Start From Template”** tab. 3. Select a design from the list that appears in the panel. @@ -151,12 +149,12 @@ When working with Kanvas, you can effortlessly integrate various design files to 5. Click **“clone”** and a copy of the design will appear on your Kanvas canvas. You can then configure the design to suit your purposes. -6. Find your newly cloned design in the list of designs in the left navigation panel. - - - + + +6. Find your newly cloned design in the list of designs in your workspace. +

Github Integrations

Integrating your GitHub account with Meshery unlocks the ability to import files as designs directly from your repositories, enhancing your collaboration and version control processes. This integration allows you to streamline your workflow, ensuring that your design infrastructure is always up-to-date and aligned with your source code. To get started with integrating GitHub into Meshery, follow the comprehensive guide available [here](https://docs.layer5.io/cloud/getting-started/github-integration/). diff --git a/src/assets/images/learning-path/creating-designs/clone-design.png b/src/assets/images/learning-path/creating-designs/clone-design.png index a57b35c0c12a5..4aa0183bb0e23 100644 Binary files a/src/assets/images/learning-path/creating-designs/clone-design.png and b/src/assets/images/learning-path/creating-designs/clone-design.png differ diff --git a/src/assets/images/learning-path/creating-designs/configuring-imported-design.png b/src/assets/images/learning-path/creating-designs/configuring-imported-design.png index 928982dadbd6c..f16d876320168 100644 Binary files a/src/assets/images/learning-path/creating-designs/configuring-imported-design.png and b/src/assets/images/learning-path/creating-designs/configuring-imported-design.png differ diff --git a/src/assets/images/learning-path/creating-designs/import-design.png b/src/assets/images/learning-path/creating-designs/import-design.png index 9f03395901354..b2c1694e2da05 100644 Binary files a/src/assets/images/learning-path/creating-designs/import-design.png and b/src/assets/images/learning-path/creating-designs/import-design.png differ diff --git a/src/assets/images/learning-path/creating-designs/open-in-playground.png b/src/assets/images/learning-path/creating-designs/open-in-playground.png index 23fa3cefd9eea..c4b979981d8c6 100644 Binary files a/src/assets/images/learning-path/creating-designs/open-in-playground.png and b/src/assets/images/learning-path/creating-designs/open-in-playground.png differ diff --git a/src/assets/images/learning-path/creating-designs/open-kanvas.png b/src/assets/images/learning-path/creating-designs/open-kanvas.png index 2861f11e64f95..a0bde62715204 100644 Binary files a/src/assets/images/learning-path/creating-designs/open-kanvas.png and b/src/assets/images/learning-path/creating-designs/open-kanvas.png differ diff --git a/src/assets/images/learning-path/creating-designs/rendered-design.png b/src/assets/images/learning-path/creating-designs/rendered-design.png new file mode 100644 index 0000000000000..db2c565652ed5 Binary files /dev/null and b/src/assets/images/learning-path/creating-designs/rendered-design.png differ diff --git a/src/assets/images/learning-path/creating-designs/step1.png b/src/assets/images/learning-path/creating-designs/step1.png index e175d136706b3..e132ac36ed537 100644 Binary files a/src/assets/images/learning-path/creating-designs/step1.png and b/src/assets/images/learning-path/creating-designs/step1.png differ diff --git a/src/assets/images/learning-path/creating-designs/step2.png b/src/assets/images/learning-path/creating-designs/step2.png index 458591b795e40..994459218370c 100644 Binary files a/src/assets/images/learning-path/creating-designs/step2.png and b/src/assets/images/learning-path/creating-designs/step2.png differ diff --git a/src/assets/images/learning-path/creating-designs/step3.png b/src/assets/images/learning-path/creating-designs/step3.png index ea5eef1c15c82..08ce80df504b4 100644 Binary files a/src/assets/images/learning-path/creating-designs/step3.png and b/src/assets/images/learning-path/creating-designs/step3.png differ diff --git a/src/assets/images/learning-path/creating-designs/step4.png b/src/assets/images/learning-path/creating-designs/step4.png index 067fe6b356322..cb80c0ba6b0dd 100644 Binary files a/src/assets/images/learning-path/creating-designs/step4.png and b/src/assets/images/learning-path/creating-designs/step4.png differ diff --git a/src/assets/images/learning-path/creating-designs/step5.png b/src/assets/images/learning-path/creating-designs/step5.png index 54ceccc0b0bb7..5723837d2d9c7 100644 Binary files a/src/assets/images/learning-path/creating-designs/step5.png and b/src/assets/images/learning-path/creating-designs/step5.png differ