docs: update home page content

Author: lokesh-coder

docs/gatsby-config.js

@@ -5,7 +5,7 @@ const version = require("./package.json").version;
 const tailwindConfig = require("./tailwind.config.js");
 
 const siteMetadata = {
-  title: "Lesy | CLI framework | Documentation",
+  title: "Lesy CLI framework | Documentation",
   description: "Lesy CLI Framework",
   author: "Lokesh Rajendran",
   version,

docs/src/components/feature-section.js

@@ -0,0 +1,17 @@
+import React from "react";
+
+const FeatureSection = ({ heading, subheading, children }) => {
+  return (
+    <div className="container mx-auto pb-20">
+      <div className="text-center  lg:px-56">
+        <h3 className="text-heading text-3xl lg:text-5xl font-extrabold tracking-tighter font-banner leading-none">
+          {heading}
+        </h3>
+        <p className="mb-8 text-xl">{subheading}</p>
+      </div>
+      <div>{children}</div>
+    </div>
+  );
+};
+
+export default FeatureSection;

docs/src/components/home-sections/artist.js

@@ -0,0 +1,15 @@
+import React from "react";
+import FeatureSection from "../feature-section";
+
+const ArtistSection = () => {
+  return (
+    <FeatureSection
+      heading="Cool visuals with Artist UI"
+      subheading="Artist is a handy plugin, which helps you to format and dynamically update the screen content"
+    >
+      here comes the Artist data
+    </FeatureSection>
+  );
+};
+
+export default ArtistSection;

docs/src/components/home-sections/commands.js

@@ -0,0 +1,16 @@
+import React from "react";
+import FeatureSection from "../feature-section";
+import Features from "../parts/features";
+
+const CommandsSection = () => {
+  return (
+    <FeatureSection
+      heading="Powerful command parsing"
+      subheading="Whether it is a simple command or a multi-level complex one, it got covered"
+    >
+      <Features />
+    </FeatureSection>
+  );
+};
+
+export default CommandsSection;

docs/src/components/home-sections/flavor.js

@@ -0,0 +1,47 @@
+import React from "react";
+import FeatureSection from "../feature-section";
+
+const FlavorSection = () => {
+  return (
+    <FeatureSection
+      heading="write in your favorite flavor"
+      subheading="Lesy supports both Typescript and plain javascript"
+    >
+      <div className="flex justify-center">
+        <div className="w-24 mr-5">
+          <svg viewBox="0 0 128 128">
+            <g id="original">
+              <rect
+                fill="#fff"
+                x="22.67"
+                y="47"
+                width="99.67"
+                height="73.67"
+              ></rect>
+              <path
+                id="original-2"
+                data-name="original"
+                fill="#007acc"
+                d="M1.5,63.91v62.5h125V1.41H1.5Zm100.73-5a15.56,15.56,0,0,1,7.82,4.5,20.58,20.58,0,0,1,3,4c0,.16-5.4,3.81-8.69,5.85-.12.08-.6-.44-1.13-1.23a7.09,7.09,0,0,0-5.87-3.53c-3.79-.26-6.23,1.73-6.21,5a4.58,4.58,0,0,0,.54,2.34c.83,1.73,2.38,2.76,7.24,4.86,8.95,3.85,12.78,6.39,15.16,10,2.66,4,3.25,10.46,1.45,15.24-2,5.2-6.9,8.73-13.83,9.9a38.32,38.32,0,0,1-9.52-.1,23,23,0,0,1-12.72-6.63c-1.15-1.27-3.39-4.58-3.25-4.82a9.34,9.34,0,0,1,1.15-.73L82,101l3.59-2.08.75,1.11a16.78,16.78,0,0,0,4.74,4.54c4,2.1,9.46,1.81,12.16-.62a5.43,5.43,0,0,0,.69-6.92c-1-1.39-3-2.56-8.59-5-6.45-2.78-9.23-4.5-11.77-7.24a16.48,16.48,0,0,1-3.43-6.25,25,25,0,0,1-.22-8c1.33-6.23,6-10.58,12.82-11.87A31.66,31.66,0,0,1,102.23,58.93ZM72.89,64.15l0,5.12H56.66V115.5H45.15V69.26H28.88v-5A49.19,49.19,0,0,1,29,59.09C29.08,59,39,59,51,59L72.83,59Z"
+              ></path>
+            </g>
+          </svg>
+        </div>
+        <div className="w-24">
+          <svg viewBox="0 0 128 128">
+            <path
+              fill="#F0DB4F"
+              d="M1.408 1.408h125.184v125.185h-125.184z"
+            ></path>
+            <path
+              fill="#323330"
+              d="M116.347 96.736c-.917-5.711-4.641-10.508-15.672-14.981-3.832-1.761-8.104-3.022-9.377-5.926-.452-1.69-.512-2.642-.226-3.665.821-3.32 4.784-4.355 7.925-3.403 2.023.678 3.938 2.237 5.093 4.724 5.402-3.498 5.391-3.475 9.163-5.879-1.381-2.141-2.118-3.129-3.022-4.045-3.249-3.629-7.676-5.498-14.756-5.355l-3.688.477c-3.534.893-6.902 2.748-8.877 5.235-5.926 6.724-4.236 18.492 2.975 23.335 7.104 5.332 17.54 6.545 18.873 11.531 1.297 6.104-4.486 8.08-10.234 7.378-4.236-.881-6.592-3.034-9.139-6.949-4.688 2.713-4.688 2.713-9.508 5.485 1.143 2.499 2.344 3.63 4.26 5.795 9.068 9.198 31.76 8.746 35.83-5.176.165-.478 1.261-3.666.38-8.581zm-46.885-37.793h-11.709l-.048 30.272c0 6.438.333 12.34-.714 14.149-1.713 3.558-6.152 3.117-8.175 2.427-2.059-1.012-3.106-2.451-4.319-4.485-.333-.584-.583-1.036-.667-1.071l-9.52 5.83c1.583 3.249 3.915 6.069 6.902 7.901 4.462 2.678 10.459 3.499 16.731 2.059 4.082-1.189 7.604-3.652 9.448-7.401 2.666-4.915 2.094-10.864 2.07-17.444.06-10.735.001-21.468.001-32.237z"
+            ></path>
+          </svg>
+        </div>
+      </div>
+    </FeatureSection>
+  );
+};
+
+export default FlavorSection;

docs/src/components/home-sections/middlewares.js

@@ -0,0 +1,15 @@
+import React from "react";
+import FeatureSection from "../feature-section";
+
+const MiddlewaresSection = () => {
+  return (
+    <FeatureSection
+      heading="Middlewares and features"
+      subheading="Sometimes you want to change the behaviour without touching the existing code. Here comes the middlewares and features"
+    >
+      here comes the Middlewares data
+    </FeatureSection>
+  );
+};
+
+export default MiddlewaresSection;

docs/src/components/home-sections/performance.js

@@ -0,0 +1,21 @@
+import React from "react";
+import FeatureSection from "../feature-section";
+import data from "../../../../benchmark/results/perf.json";
+import Chart from "../../components/visuals/chart.js";
+
+const PerformanceSection = () => {
+  return (
+    <FeatureSection
+      heading="Lesy is just faster"
+      subheading="Lesy does lot of work, but never compromised on performance"
+    >
+      <div className="flex justify-center">
+        <div className="w-2/4">
+          <Chart data={data} />
+        </div>
+      </div>
+    </FeatureSection>
+  );
+};
+
+export default PerformanceSection;

docs/src/components/home-sections/pilot.js

@@ -0,0 +1,16 @@
+import React from "react";
+import FeatureSection from "../feature-section";
+import Preview from "../parts/preview";
+
+const PilotSection = () => {
+  return (
+    <FeatureSection
+      heading="Run commands from Pilot UI"
+      subheading="Pilot is a plugin for lesy, which lets you to view and run commands from any lesy projects. It is a fully functional dashboard with console viewer, prompt modal and runner"
+    >
+      <Preview />
+    </FeatureSection>
+  );
+};
+
+export default PilotSection;

docs/src/components/home-sections/plugins.js

@@ -0,0 +1,16 @@
+import React from "react";
+import FeatureSection from "../feature-section";
+import PluginsList from "../parts/plugins-list";
+
+const PluginsSection = () => {
+  return (
+    <FeatureSection
+      heading="Extend lesy with plugins"
+      subheading="Plugins are the best possible way to extend, tweak or resuse the functionality "
+    >
+      <PluginsList />
+    </FeatureSection>
+  );
+};
+
+export default PluginsSection;

docs/src/components/home-sections/testing.js

@@ -0,0 +1,21 @@
+import React from "react";
+import FeatureSection from "../feature-section";
+
+const TestingSection = () => {
+  return (
+    <FeatureSection
+      heading="Testing made easier and simple"
+      subheading="Writing Unit test and integration test are fun in lesy"
+    >
+      <div className="flex justify-center">
+        <img
+          src="/images/lesy-testing-code.svg"
+          className="w-2/4"
+          alt="testing-img"
+        />
+      </div>
+    </FeatureSection>
+  );
+};
+
+export default TestingSection;