diff --git a/src/components/Features/TwoColLayout.js b/src/components/Features/TwoColLayout.js index 29e18c823e03..bc0eaf7f3c9f 100644 --- a/src/components/Features/TwoColLayout.js +++ b/src/components/Features/TwoColLayout.js @@ -92,7 +92,7 @@ const TwoColLayout = ({ containerRefs, contentRefs }) => { (contentRefs.current[1] = el)}> -

Easing your Workflow Burden Collaboratively

+

Cognitive overload is real

Empower DevOps, platform, and site reliability engineers with our orchestration management solution. Achieve seamless collaboration and operational harmony for enhanced productivity.

Learn more →
diff --git a/src/components/Features/images/22.svg b/src/components/Features/images/22.svg new file mode 100644 index 000000000000..f789f4ea28d8 --- /dev/null +++ b/src/components/Features/images/22.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + + + + diff --git a/src/components/Features/images/cursor-2.svg b/src/components/Features/images/cursor-2.svg index a29c0544418d..88834405d80d 100644 --- a/src/components/Features/images/cursor-2.svg +++ b/src/components/Features/images/cursor-2.svg @@ -1,12 +1,5 @@ - - - - - - - - - - - + + + + diff --git a/src/components/Features/images/cursor-21.svg b/src/components/Features/images/cursor-21.svg new file mode 100644 index 000000000000..aa37f667fedd --- /dev/null +++ b/src/components/Features/images/cursor-21.svg @@ -0,0 +1,42 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/pages/cloud-native-management/generate-gcp-architecture-diagram.js b/src/pages/cloud-native-management/generate-gcp-architecture-diagram.js index 67b1dfbc656b..45c28526af7a 100644 --- a/src/pages/cloud-native-management/generate-gcp-architecture-diagram.js +++ b/src/pages/cloud-native-management/generate-gcp-architecture-diagram.js @@ -12,7 +12,7 @@ const Gcp = () => { }; export default Gcp; export const Head = () => { - return ; }; \ No newline at end of file diff --git a/src/sections/ArchitectureDiagram/index.js b/src/sections/ArchitectureDiagram/index.js index e65560b67022..f8ffb3a6b01c 100644 --- a/src/sections/ArchitectureDiagram/index.js +++ b/src/sections/ArchitectureDiagram/index.js @@ -12,7 +12,7 @@ import customizationGIF from "./images/customization.gif"; import shapesAndTemplatesGIF from "./images/shapes-and-templates.gif"; import RelatedPicks from "../../components/RelatedPicks"; let data = { - heading: "Design Architecture Diagram Online", + heading: "Design Architecture Diagrams Online", sub_heading: "Effortlessly create software architectures, application architectures and system architectures in minutes.", image: whiteboard_svg }; @@ -50,13 +50,13 @@ const ArchitectureDiagram = () => {

Why use an architecture diagramming software?

-

Following all the elements within your cloud environment can be challenging, but a visual diagram of your cloud architecture will help you stay up to date with its status, understand the relationship between components, identify and solve problems. This complexity adds up when multiple team members are working on the same project. A collaborative cloud diagramming sofware could help to pinpoint information and ensure that everybody is on the same page.

+

Cognitive overload is real. Trying to hold all elements of your environment in your mind can be challenging, but a visual diagram of your cloud architecture will help you stay up to date with its status, understand the relationship between components, identify and solve problems. This complexity adds up when multiple team members are working on the same project. A collaborative cloud diagramming sofware could help to pinpoint information and ensure that everybody is on the same page.

-

Visual Tool That Get Things Done

+

Visual Tool That Gets Things Done

Not just pretty pictures. Data-linked visual apps to streamline all your efforts.

diff --git a/src/sections/Docker-Meshery/index.js b/src/sections/Docker-Meshery/index.js index 8e999159f26b..25a2e33b22c1 100644 --- a/src/sections/Docker-Meshery/index.js +++ b/src/sections/Docker-Meshery/index.js @@ -4,7 +4,7 @@ import { Row, Col } from "../../reusecore/Layout"; import docker from "../../assets/images/socialIcons/docker_white.svg"; import meshery from "../../assets/images/meshery/icon-only/meshery-logo-white.svg"; import DockerExtensionMeshery from "./docker-extension-meshery"; -import KanvasCTA from "../kanvas-cta"; +import KanvasCTA from "../Kanvas/kanvas-cta"; const MesheryDockerPage = () => { return ( diff --git a/src/sections/Home/FeaturesContainer/index.js b/src/sections/Home/FeaturesContainer/index.js index 8bbedfbb1948..fc1d5a9e9b44 100644 --- a/src/sections/Home/FeaturesContainer/index.js +++ b/src/sections/Home/FeaturesContainer/index.js @@ -26,26 +26,17 @@ const FeaturesContainer = () => { const layoutRef = useRef(null); const featuresInfo = [ { - title: "Collaborate with Precision", + title: "Build Systems Faster, Together", show_custom_cursor: true, animationOne: true, redirectLink: "/cloud-native-management/kanvas/collaborate/peer-reviews", - desc: "Real-time collaboration for cloud and cloud native designs with live-editing, instant feedback, deploy dry runs, and secure access controls.", + desc: "Real-time collaboration for cloud native and Kubernetes designs with live-editing, instant feedback, deploy dry runs, and secure access controls.", imgLink: isDark ? CommentingImageDark : CommentingImageLight, cursor: false, }, - { - title: "Generate stunning diagrams", - show_custom_cursor: false, - animationOne: false, - redirectLink: "/whiteboard", - desc: "Crafting cloud-native symphonies: Our engineering diagramming tool is your conductor's baton, turning Kubernetes infrastructure into a canvas for freestyle orchestration.", - imgLink: isDark ? WhiteboardingImage : WhiteboardingImageLight, - cursor: true, - }, { title: "Multi-Cloud by Design", - show_custom_cursor: false, + show_custom_cursor: true, animationOne: true, redirectLink: "", desc: ( @@ -72,6 +63,15 @@ const FeaturesContainer = () => { }, ], }, + { + title: "Be on the same page, literally", + show_custom_cursor: true, + animationOne: false, + redirectLink: "/whiteboard", + desc: "Crafting cloud-native symphonies: Our engineering diagramming tool is your conductor's baton, turning Kubernetes infrastructure into a canvas for freestyle orchestration.", + imgLink: isDark ? WhiteboardingImage : WhiteboardingImageLight, + cursor: true, + } ]; useEffect(() => { diff --git a/src/sections/kanvas-cta/index.js b/src/sections/Kanvas/kanvas-cta/index.js similarity index 95% rename from src/sections/kanvas-cta/index.js rename to src/sections/Kanvas/kanvas-cta/index.js index 176ac64ca3e0..3512ea7b1c1b 100644 --- a/src/sections/kanvas-cta/index.js +++ b/src/sections/Kanvas/kanvas-cta/index.js @@ -1,10 +1,10 @@ import React from "react"; import styled from "styled-components"; -import { Container } from "../../reusecore/Layout"; +import { Container } from "../../../reusecore/Layout"; import Locator from "./locator.svg"; import MesherySurface from "./meshery-surface.svg"; -import Button from "../../reusecore/Button"; +import Button from "../../../reusecore/Button"; const KanvasCTAWrapper = styled.div` .CTAbody { diff --git a/src/sections/kanvas-cta/kanvas-icon-white.svg b/src/sections/Kanvas/kanvas-cta/kanvas-icon-white.svg similarity index 100% rename from src/sections/kanvas-cta/kanvas-icon-white.svg rename to src/sections/Kanvas/kanvas-cta/kanvas-icon-white.svg diff --git a/src/sections/kanvas-cta/locator.svg b/src/sections/Kanvas/kanvas-cta/locator.svg similarity index 100% rename from src/sections/kanvas-cta/locator.svg rename to src/sections/Kanvas/kanvas-cta/locator.svg diff --git a/src/sections/kanvas-cta/meshery-surface.svg b/src/sections/Kanvas/kanvas-cta/meshery-surface.svg similarity index 100% rename from src/sections/kanvas-cta/meshery-surface.svg rename to src/sections/Kanvas/kanvas-cta/meshery-surface.svg diff --git a/src/sections/Kubernetes-Diagram/diagram.js b/src/sections/Kubernetes-Diagram/diagram.js index 5811f418cc1f..df0cb432e941 100644 --- a/src/sections/Kubernetes-Diagram/diagram.js +++ b/src/sections/Kubernetes-Diagram/diagram.js @@ -150,17 +150,17 @@ const Kubernetes = () => {
-

Diagram + Config = Awesome!

-

- Stop wrestling with code templates! Our visual configuration interface gives you the precision of code with the ease of a diagram. +

Kubernetes made simple.

+ {/*

Visualize, configure, deploy.

*/} +

Ditch the code complexity. Design your Kubernetes clusters visually, then deploy with confidence.

-

Deploy with No Code Kubernetes

+

No Code Kubernetes Deployments

- Our visual Kubernetes interface enables anyone to deploy production-grade software with no code. Whether you're new to Kubernetes and are looking for the best way to learn or a seasoned pro, Kanvas has all the features you need to be successful in deploying and configuring your software using the industry-leading container orchestrator, all with no code.

+ Kanvas for Kubernetes empowers anyone to deploy production-ready infrastructure effortlessly. No coding experience? No problem! Kanvas offers all the tools you need to deploy and configure your software on Kubernetes, the top container orchestrator, without writing a single line of code. Perfect for beginners learning the ropes or seasoned professionals seeking streamlined workflows, Kanvas ensures success in deploying and managing your applications on Kubernetes.

@@ -175,18 +175,18 @@ const Kubernetes = () => {
-

Visual drag & drop

+

From Idea to Infrastructure in Seconds

- Instantly search for and find any integration that CNCF supports and drop on the canvas to create your cloud native infrastructure. Kanvas allow you to drag, drop and connect all your cloud components together simply and easily - no-code required! + Unlock the power of cloud-native computing without the coding complexity. Kanvas' drag-and-drop interface lets you visualize and build your cloud infrastructure effortlessly.

Learn more →
-

Extensive Kubernetes Icon Library

+

Comprehensive Kubernetes Toolkit for Platform Engineers

- Utilize a vast and continually expanding collection of Kubernetes icons designed for both diagramming and orchestration scenarios. Craft globally comprehensible diagrams that are not only authentic but also aligned with the latest industry standards. + Leverage an extensive and continuously updated library of Kubernetes components, meticulously designed for both diagramming and orchestration. Create accurate, industry-standard diagrams that communicate your infrastructure designs effectively across teams. Click "dry run" before deploying to ensure your configurations are error-free.

@@ -202,11 +202,11 @@ const Kubernetes = () => {
-

Kickstart with Ready-to-Use Templates

+

From Zero to Kubernetes in Minutes

- Jumpstart your projects with our quick-start templates designed for both Kubernetes diagramming and orchestration management. Access a range of professionally crafted templates that are fully customizable, ensuring you can tailor them to your specific needs. + Fast-track your Kubernetes projects with our curated collection of quick-start templates for both diagramming and orchestration. These professional-grade blueprints are fully customizable, giving you the flexibility to adapt them to your unique requirements.

- Learn more → + Explore Kubernetes templates → diff --git a/src/sections/Projects/Project-grid/index.js b/src/sections/Projects/Project-grid/index.js index e4b8634c55d5..3759ed57bef3 100644 --- a/src/sections/Projects/Project-grid/index.js +++ b/src/sections/Projects/Project-grid/index.js @@ -5,7 +5,7 @@ import PageHeader from "../../../reusecore/PageHeader"; // import ProudMaintainers from "../../../sections/Home/Proud-maintainers"; import { ThemeManagerContext } from "../../../theme/app/ThemeManager"; import { ProjectWrapper } from "./projectGrid.style"; -import KanvasCTA from "../../kanvas-cta"; +import KanvasCTA from "../../Kanvas/kanvas-cta"; import extension from "../../../assets/images/docker-extension/docker-extension-meshery-logo.svg"; import meshery from "../../../assets/images/meshery/icon-only/meshery-logo-light.svg"; diff --git a/src/sections/Projects/SMI/index.js b/src/sections/Projects/SMI/index.js index 6679337fca85..7cb10cb79926 100644 --- a/src/sections/Projects/SMI/index.js +++ b/src/sections/Projects/SMI/index.js @@ -5,7 +5,7 @@ import React from "react"; import SMIWrapper from "./smi.style"; import { Row, Col, Container } from "../../../reusecore/Layout"; import Button from "../../../reusecore/Button"; -import KanvasTA from "../../kanvas-cta"; +import KanvasCTA from "../../Kanvas/kanvas-cta"; import data from "./data"; import c_icon from "./c-icon.svg"; @@ -111,7 +111,7 @@ const SMIPage = () => { - + ); }; diff --git a/src/sections/Projects/SMP/index.js b/src/sections/Projects/SMP/index.js index 582f255a3c05..eb747593182d 100644 --- a/src/sections/Projects/SMP/index.js +++ b/src/sections/Projects/SMP/index.js @@ -8,7 +8,7 @@ import { BgImage } from "gbimage-bridge"; import SMPWrapper from "./smp.style"; import { Row, Col, Container } from "../../../reusecore/Layout"; import Button from "../../../reusecore/Button"; -import KanvasCTA from "../../kanvas-cta"; +import KanvasCTA from "../../Kanvas/kanvas-cta"; import example from "../../../assets/images/smp-page/service-mesh-performance-specification-example.gif"; import smp from "../../../assets/images/smp-page/smp-white.svg";